私のスクリプトは、最初の項目を返します

Question

私はasp.net/c＃でコーディングしています。私はajaxを使ってIDと製品の数量を取得しようとしています。問題は、私が3番目の製品の数量を入力しようとすると、私は何らかの数量を提供していないというエラーが出るので、私のコードは最初の項目のみを認識することです。

 <script type="text/javascript"> 
$(function() { 
    $('.Sendparams').click(function (e) { 
    e.preventDefault(); 
    debugger; 
// var id = $(this).attr('id'); 
    var quant = $("#quant").val(); 
var id = $("#id").val(); 

    $.ajax({ 
     type: 'GET', 
     url: '/ShoppingCart/AddToCart', 
     data:{ "id": id , "quant": quant }, 
    success: function (response) { 
      $("#mainContainerCenter").html(response); } });}); 
    }); 
</script> 
    <section class="content"> 
    <!-- Small boxes (Stat box) --> 
    <div class="row">  

    @foreach (var album in Model.Produits) 
    { 


      <div class="col-lg-3 col-xs-6"> 
       @Html.Hidden("id", album.ProduitId, new { @id = "id" })<br/> 

       @album.Nom_Produit<br /> 
      @album.Categorie.Nom_categorie<br /> 
       @String.Format("{0:F}", album.Prix)<br /> 
       @Html.TextBox("quant", null, new { id = "quant" })<br /> 
       @Html.ActionLink("voila", "AddToCart", "ShoppingCart", new { id = album.ProduitId }, new { @class = "Sendparams" })<br /> 

      </div> 
    } 

    </div> 

Answer 1

id属性は、u​​niqの値のようになります。

は、ここに私のコードです。あなたの場合、idはuniqではなく、すべての項目に "quant"値を使用しています（id = "quant"）。私が正しくあなたがこれを行うにしようとすると、コードは助けることができるであることを理解場合：https://jsfiddle.net/9usvg6wv/

$(".item").submit(function(event) { 
 
    $('#clickedid').text(
 
    \t $(this).find('input[name="id"]').val() 
 
); 
 
    $('#clickedquant').text(
 
    \t $(this).find('input[name="quant"]').val() 
 
); 
 
    console.log($(this).find('input[name="quant"]').val()); 
 
    event.preventDefault(); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div> 
 
    <form action="" class="item" > 
 
     <input type="hidden" name="id" value="1" /> 
 
     <input type="text" name="quant" value="100" /> 
 
     <input type="submit" class="" > 
 
    </form> 
 
    
 
    <form action="" class="item" > 
 
     <input type="hidden" name="id" value="2" /> 
 
     <input type="text" name="quant" value="200" /> 
 
     <input type="submit" class="" > 
 
    </form> 
 
    
 
    <form action="" class="item" > 
 
     <input type="hidden" name="id" value="3" /> 
 
     <input type="text" name="quant" value="300" /> 
 
     <input type="submit" class="" > 
 
    </form> 
 
    
 
    <form action="" class="item" > 
 
     <input type="hidden" name="id" value="4" /> 
 
     <input type="text" name="quant" value="400" /> 
 
     <input type="submit" class="" > 
 
    </form> 
 
</div> 
 

 
<div> 
 
Clicked id:<span id="clickedid"></span>; quant:<span id="clickedquant"></span> 
 
</div>