Php 将foreach值添加到Ajax

我有两个问题在下面； 1） 如何将值从foreach传递到ajax。这是我的代码，到目前为止，我已经尝试过将ajax放在foreach中，但它一直在为我提供foreach中姓氏的id

2） 有没有一种方法可以让我点击add，然后数据将被保存并放在这个html表下面的另一个html表中，但在我点击第二个表中的insert之前不会被插入到数据库中

 <table class="table table-bordered datatable" id="table_export">
                <thead>
                    <tr>
                        <th>#</th>
                        <th><div>Item</div></th>
                        <th><div>Quantity Left</div></th>
                        <th><div>Price</div></th>
                        <th><div>Quantity</div></th>
                        <th><div>Sell</div></th>

                    </tr>
                </thead>
                <tbody>
                    <?php
                        $count = 1; 
                        $notarray = DataDB::getInstance()->get_rows_from_field('name');
                        foreach($notarray as $row):?>

                    <tr>

                        <td><?php echo $count++;?></td>
                        <td><?php echo $row['name'];?></td>
                        <td><?php echo $row['nickname'];?></td>
                        <td><?php echo $row['surname']; ?></td>

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

                                <div class="form-group">

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

                        </td>

                            <td>

                            <div class="btn-group">
                            <button type="submit" class="btn btn-primary" name = "check">Add</button>
                            </div>
                            </td>
                        </form>

                   </tr>

                    <?php endforeach;?>
                </tbody>
            </table>

            <br><br>
            <div id="get_result">
                      </div>


<script type="text/javascript">


$(function () {

    $('form').on('submit', function (e) {

      e.preventDefault();

      $.ajax({
        type: 'post',
        url: 'verify.php',
        data: $('form').serialize() + '&ins=sellin' + '&id=<?php echo $row['name_id'];?>',
         success: function(data)
        {
            jQuery('#get_result').html(data);
        }
      });

    });

  });

#
项目
剩余数量
价格
量
卖
添加



$（函数（）{
$（'form'）。关于（'submit'，函数（e）{
e、 预防默认值（）；
$.ajax({
键入：“post”，
url:'verify.php'，
数据：$（'form'）。serialize（）+'&ins=sellin'+'&id='，
成功：功能（数据）
{
jQuery（'#get_result'）.html（数据）；
}
});
});
});

---

如果我没记错，您的意思是您想从表A中的项目列表中选择一个项目，它应该显示在表B中。之后，您想单击表B中的“提交”按钮保存从表A中选择的项目吗

以下是解决方案：

请将此文件命名为

test.php

<?php
/**
 * Created by PhpStorm.
 * User: SQ05
 * Date: 06/01/2017
 * Time: 06:31 PM
 */
//Note that data is a typical example of data u gotten from DB. so make sure u push all $row into an array
//such that u create something of this nature eg
// $data=array();
// $i=0;
//while($row=mysql_fetch_assoc($query)){
//$data[$i]=$row;
//$i++;
//}
// this will then create data of this nature below,
$data=array(
    array('id'=>1,'name'=>'Loveth','age'=>23,'phone'=>'9889087455'),
    array('id'=>2,'name'=>'Susan','age'=>51,'phone'=>'787987455'),
    array('id'=>3,'name'=>'Precious','age'=>13,'phone'=>'98989087455'),
    array('id'=>4,'name'=>'Hannah','age'=>21,'phone'=>'987087455'),
    array('id'=>5,'name'=>'Kenneth','age'=>43,'phone'=>'569087455'),
);

?>
<div style="float:left;width:50%">
    THE LIST OF ALL ITEMS
    <table>
    <tr>
        <td>Name</td>
        <td>Age</td>
        <td>Phone</td>
        <td>Action</td>
    </tr>
    <?php
    $i=0;
    for ($i=0;$i<count($data);$i++) {
        $item=$data[$i];
        ?>
        <tr>
            <td><?php echo $item['name'];?></td>
            <td><?php echo $item['age'];?></td>
            <td><?php echo $item['phone'];?></td>
            <td><button onclick='addToList(<?php echo json_encode($item);?>);'>Add</button></td>
        </tr>
    <?php
    }
    ?>
</table>
</div>

<div style="float:left; width:50%">
  THE ITEM TO BE SAVED
<div id="showToSave"></div>
    </div>

<script src="bower_components/jquery/dist/jquery.js"></script> <!--Please install jquery base on ur own directory path-->
<script>
    var listToSave=[]; // must be global

    /**
     * The add to list function that process data and add to list
     * @param data
     */
   var addToList= function(data){
        var lenData=listToSave.length;
          if(lenData>0){
              //this is used to avoid duplicate
             for(var j=0;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><tr><td>Name</td> <td>Age</td> <td>Phone</td> <td>Action</td></tr>";
     var i;
        for(i=0;i<len;i++){
          content=data[i];
        tableToSave+="<tr><td>"+content.name+"</td><td>"+content.age+"</td><td>"+content.phone+"</td><td>" +
            "<button onclick='deleteFromSave("+i+")'>Delete</button></td></tr>";
        }
     tableToSave+="</table><div><button onclick='saveData()' type='button'>Save</button></div>";
     return tableToSave;
    };


    /**
     * This is use to delete data added locally
     */
    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
    };

    /**
     * This is use to submit data
     */
    var saveData=function () {
        console.log('thjis=',listToSave);
        $.ajax({
            type: "POST",
            url: "getData.php",
            data: {list : JSON.stringify(listToSave)},
            success: function(resp){
                console.log('response=',resp);
            }
        });
    };
</script>

---

我将编写一个演示，并可能在明天或今晚发送。我已经提供了@hamobits工作的解决方案，但我不能在表B中放入多个项目。请检查我评论为“这是用于避免重复”的行，请确保您添加到列表中的值不是相同的Id，或者在addToList函数中重构该行以满足您的需要。在标记它之前，我已经对其进行了排序，正在尝试的是在for each中获取名为kin的输入表单的值，并将其添加到项数组中；输入表单似乎不是唯一的，当我试图通过将项目id附加到输入表单名称来使其唯一时，在array@Casey

    <?php
    /**
     * Created by PhpStorm.
     * User: SQ05
     * Date: 06/01/2017
     * Time: 07:28 PM
     */
    if ($_SERVER['REQUEST_METHOD'] == 'POST') {
    $data = json_decode(stripslashes($_POST['list'])); //the data here can now be used to create a multiple value insert to ur mysql db.
        print_r(json_encode($data)); // this is used to send response back to ur page if using array buh echo if string
    }