ループ内のドロップダウンは、foreachループの最初の項目値のみを取得します。php/ajax

Question

私のカート内で私の製品のドロップダウンが2つあります。 すべての製品は、foreachループ内のセッションに格納されます。 しかし、私のドロップダウンはループからの最初の製品でのみ機能します。 例：カートに2つの製品がある場合、製品の行は両方のdorpdownsに基づいてコストを得ます。 ですが、2番目の製品は最初のドロップダウンから同じコストを得ています。 誰かがこの問題を解決する方法を教えてください。

cart.phpでcheckout.phpで私のスクリプト

$(document).ready(function() { 

    $('.fabric, .size').on('change', sendData); 

    function sendData() { 
     var fabricID = $('.fabric').val(); 
     var sizeID = $('.size').val(); 
     var cost = $(this).attr('data-id'); 
     if (fabricID !== "" && sizeID !== "") { 
      $.ajax({ 
       type  : 'GET', 
       url  : 'calculates.php', 
       dataType : 'json', 
       data  : { 
        prod_id:cost, 
        fabric_id: fabricID, 
        size_id: sizeID 
       } 
      }).done(function(data) { 
       $('.icms' + cost).text(data.val); 

      }); 
     } 
    } 
}); 

私のPHPのforeachループが

function cart(){ 
    global $conn; 


    $fabric_options = '<option>Select Fabric</option>'; 
    $query2 = "SELECT * FROM almofadas"; 
    $result = mysqli_query($conn,$query2); 
    while($rows = mysqli_fetch_assoc($result)){ 

     $tecido=$rows['tecido']; 
     $id_price=$rows['id_price']; 
     $t50='50'; 
     $t45='45'; 

     $fabric_options .= '<option value="'.$id_price.'">'.$tecido.'</option>'; 
    } 

    if(!isset($_SESSION['icms'])) { 
     $_SESSION['icms']='0'; 
    }else{ 
     $_SESSION['icms']; 
    } 

    foreach ($_SESSION as $name => $value) { 
     if($value > 0){ 
      if(substr($name, 0, 8) == "product_"){ 
       $length = strlen($name) -8; 
       $item_id = substr($name,8 , $length); 

       $query = "SELECT * 
          FROM gallery2 
          WHERE gallery2.id =".escape_string($item_id). ""; 
       $run_item = mysqli_query($conn,$query); 
       while($rows = mysqli_fetch_assoc($run_item)){ 
        $vari = $rows['variante']; 
        $num = $rows['title']; 
        $id  = $rows['id']; 

        $btn_add ='<button type="button" class="btn btn-success actions plus" data-action="plus" product_id="'.$id.'"><i class="fa fa-plus fa-lg" aria-hidden="true" add_btn></i></button>'; 

        $btn_remove ='<button type="button" class="btn btn-warning actions less" data-action="remove" product_id="'.$id.'"><i class="fa fa-minus fa-lg" aria-hidden="true" remove_btn></i></button>'; 

        $btn_delete ='<button type="button" class="btn btn-default actions" data-action="delete" product_id="'.$id.'" onclick="deleteRow(this)"><i class="fa fa-times fa-lg" aria-hidden="true"></i></button>'; 

        if($rows['variante'] < 1){ 
         $vari=""; 
        }else{ 
         $vari = "-".$rows['variante']; 
        } 

        $product = ' 
     <tr> 
      <td style="width:100px; "><img src="../'.$rows['image'].'" style="width:90%;border: 1px solid black;"></td> 
      <td>'.$num.''.$vari.'</td> 
      <td style="width:15%;"> 
       <select name="fabric" class="fabric select form-control selectpicker" required="" data-id="'.$id.'"> 
       '. $fabric_options . ' 
       </select> 
      </td> 

      <td> 
       <select data-id="'.$id.'" class="select size form-control selectpicker" required style="width:80%;" > 
       <option>Select size</option> 
       <option value="'.$t50.'">50x'.$t50.'</option> 
       <option value="'.$t45.'">45x'.$t45.'</option> 

       </select> 
      </td> 
      <td class="product'.$id.'">'.$value.'</td> 
      <td class="icms">R$: '.$_SESSION['icms'].'</td> 
      <td class="total'.$id.'" data-id="'.$id.'">R$: '.$value * $_SESSION['icms'] .' </td> 
      <td> 
      '.$btn_add.' '.$btn_remove.' '.$btn_delete.' 
      </td> 
     </tr>'; 
     echo $product; 

     } 
     } 
    } 
    } 
} 

と私の計算が行われる場所です。..

calculates.php

<?php header('Content-Type: application/json'); 

include_once '../incluedes/conn_cms.php'; //session allways start here 

if(isset($_GET["size_id"],$_GET["fabric_id"],$_GET['prod_id'])){ 
    $size_id=$_GET["size_id"] ; 
    $fabric_id=$_GET["fabric_id"] ; 
    $prod = $_GET['prod_id']; 
    $prodname = 'product_'.$prod; 

    $query3 =" SELECT * FROM valores_almofadas WHERE size='$size_id' AND price_id ='$fabric_id'"; 

    $result = mysqli_query($conn,$query3); 
    while($rows = mysqli_fetch_assoc($result)){ 

     if($_SESSION['estado'] == 'SP'){ 
      $ICMS = $rows['icms_7']; 
     }else{ 
      $ICMS = $rows['icms_12']; 
     } 
     $_SESSION['icms']=$ICMS; 

    } 
    echo json_encode($_SESSION['icms']); 
} 

私はどのように私のドロップダウン作業foreach製品を作ることができますか？

Answer 1

var fabricID = $(".fabric").val()は、fabricクラスで見つかった最初の要素から値を選択しているという問題があります。これは、そのクラスのページに要素がいくつあっても、毎回同じ要素（最初の要素）になります。

正しい要素から値を選択する必要があります。これは、ファブリックとサイズの両方の値を同時に送信する必要があるという事実によって、やや厄介です。幸運にも、<select>要素の両方で行IDをデータ属性として取得していますので、これを使用して一致させることができます。エラーキャッチされないでSyntaxErrorなっ

$(document).ready(function() { 

    $('.fabric, .size').on('change', sendData); 

    function sendData() { 
    //use the data-id attribute of the selected element to match the correct elements 
    var id = $(this).data("id"); 
    var fabricID = $('.fabric[data-id=' + id + ']').val(); 
    var sizeID = $('.size[data-id=' + id + ']').val(); 

    if (fabricID !== "" && sizeID !== "") { 
     $.ajax({ 
      type  : 'GET', 
      url  : 'calculates.php', 
      dataType : 'json', 
      data  : { 
       prod_id:id, 
       fabric_id: fabricID, 
       size_id: sizeID 
      } 
     }).done(function(data) { 
      $('.icms' + id).text(data.val); 

     }); 
     } 
    } 
});