フォーム入力フィールドをそれぞれ固有にします

Question

こんにちはテーブルAのアイテムのリストからアイテムを選び、テーブルBに表示する必要があります。その後、テーブルBの送信ボタンをクリックして、選択したアイテムを保存します問題は、テーブルAの私の年齢の入力フィールドに入れているが、テーブルbに渡そうとすると、それぞれの最初のアイテムの入力値が渡されます入力フィールドを一意にします。これは私のコード

<?php 
$data=array(); 
$i=0; 
$notarray = DataDB::getInstance()->get_rows_from_field('inventory','branch_id',$branchid); 
foreach($notarray as $row){ 
    $data[$i]=$row; 
    $i++; 
} 
?> 


<table class="table table-bordered datatable" id="table_export"> 
    <thead> 
     <tr> 
      <th>#</th> 
      <th><div>name</div></th> 
      <th><div>surname</div></th> 
      <th><div>date</div></th> 
      <th><div>Age</div></th> 
      <th><div>action</div></th> 

     </tr> 
    </thead> 
    <tbody> 

     <?php 
     $i=0; 
     for ($i=0;$i<count($data);$i++) { 
      $item=$data[$i]; 
      $count = 1; 
      ?> 

      <tr> 

       <td><?php echo $count++;?></td> 
       <td><?php echo $item['name'];?></td> 
       <td><?php echo $item['surn'];?></td> 
       <td><?php echo $item['date']; ?></td> 

       <form method="post" action="" role="form"> 
        <td> 

         <div class="form-group"> 

          <div class=""> 
           <input type="number" class="form-control" name="age" data-validate="required" data-message-required="Age required" autofocus> 
          </div> 
         </div> 

        </td> 

        <td> 

         <div class="btn-group"> 
          <button type="submit" class="btn btn-primary" id="addb" name="save" onclick='addToList(<?php echo json_encode($item);?>);'>Add</button> 
         </div> 
        </td> 
       </form> 

      </tr> 

      <?php 
     } 

     ?> 


    </tbody> 
</table> 

<br><br> 

<div id="showToSave"> 
</div> 


<script type="text/javascript"> 

    var listToSave=[]; // must be global 

    var addToList= function(data){ 

     var button = document.getElementById("addb"), 
     value = button.form.quantity+"Panadol".value; 
     data.quan = value; 
     var lenData=listToSave.length; 
     if(lenData>0){ 
       //this is used to avoid duplicate 
      for(var j=1;j<lenData;j++){ 
       if(data.id==listToSave[j].id) return; 
      } 
     } 

     listToSave.push(data); 
     console.log(listToSave); 
     document.getElementById('showToSave').innerHTML=createData(listToSave); 


    }; 

    var createData= function (data) { 

     var len=data.length; 
     var tableToSave="<table class='table table-bordered datatable'><tr><td>Item</td> <td>Quantity</td> <td>Price</td> <td>Action</td></tr>"; 
     var i; 
     for(i=0;i<len;i++){ 
      content=data[i]; 

      tableToSave += "<tr><td>"+content.item_name+"</td><td>"+content.quan+"</td><td>"+content.price+"</td><td>" + 
      "<button class='btn btn-danger' onclick='deleteFromSave("+i+")'>Delete</button></td></tr>"; 
     } 
     tableToSave += "</table><div><button class='btn btn-success' onclick='saveData()' type='button'>Save</button></div>"; 
     return tableToSave; 
    }; 

    var deleteFromSave=function (index) { 
     listToSave.splice(index,1); //this is use to delete from list to save 
     document.getElementById('showToSave').innerHTML=createData(listToSave); //to rerender after delete 
    }; 
</script> 

Answer 1

あなたがあなたの年齢inputフィールドにid="age<?php echo $i ?>"を添付しなければならない何をしたい、もう少し説明してください。 とdataをaddToListに渡して、次のようなフィールド値から年齢inputを取得することができます。

var addToList= function(data,i){ 

    var button = document.getElementById("addb"), 
    value = button.form.quantity+"Panadol".value; 
    data.quan = value; 
    data.age = document.getElementById("age"+i).value; 
    var lenData=listToSave.length; 
    if(lenData>0){ 
      //this is used to avoid duplicate 
     for(var j=1;j<lenData;j++){ 
      if(data.id==listToSave[j].id) return; 
     } 
    } 

    listToSave.push(data); 
    console.log(listToSave); 
    document.getElementById('showToSave').innerHTML=createData(listToSave); 


}; 

createDataの機能は次のように変更されます。

var createData= function (data) { 

    var len=data.length; 
    var tableToSave="<table class='table table-bordered datatable'><tr><td>Item</td> <td>Quantity</td> <td>Price</td><td>Age</td> <td>Action</td></tr>"; 
    var i; 
    for(i=0;i<len;i++){ 
     content=data[i]; 

     tableToSave += "<tr><td>"+content.item_name+"</td><td>"+content.quan+"</td><td>"+content.price+"</td><td>"+content.age+"</td><td>" + 
     "<button class='btn btn-danger' onclick='deleteFromSave("+i+")'>Delete</button></td></tr>"; 
    } 
    tableToSave += "</table><div><button class='btn btn-success' onclick='saveData()' type='button'>Save</button></div>"; 
    return tableToSave; 
}; 

これが役立ちます。

Answer 2

あなた<form>小さく「1フィールド」の形で、Submitをクリックするとそう、それは一つのアイテムだけをお送りします。

次のいずれかが可能です。

• 各小フォームを使用して、テーブル全体を包み込む大きなフォームを作る
• 必要なデータを戻すために、そしてあなたが変更のためのアドオン隠さ（s）は入力（S） name="age"フィールドをname="age[<?php echo $the_unique_id_of_this_line;?>]"に変更し、DBユニークIDを使用します。これは、あなたの質問にお答えしていない場合はこれを使用すると、ID 45

ため$name[45]などのデータにアクセスすることを可能にするだろう、あなたは