2017-01-05 40 views
2

我有两个问题在下面; 1)我如何将一个值从一个foreach传递给ajax。这是我的代码,我到目前为止,试图把ajax放在foreach中,但它一直给我每个中的姓氏的ID。向Ajax添加foreach值

2)有没有一种方法,我可以点击添加和和数据将被保存并放在另一个html表下面这个html表,但不会被插入到数据库,直到我点击插入第二个表。

<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); 
     } 
     }); 

    }); 

    }); 

回答

0

如果我得到你的权利,你的意思是你想从项目列表中选择表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> 

请命名此作为getData.php处理提交使用多个值插入方法添加的数据的列表中的。

<?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 
    } 
+0

是完全相同@casey – hamobi

+0

我会写一个演示,可能 – Casey

+0

非常感谢发送明天或今晚@casey – hamobi