遍历序列化数据以将更新插入MySQL DB

时间:2018-10-19 04:34:26

标签: php jquery mysql ajax

由于下面的帮助,我将代码切换为使用serlize(),但是我仍然遇到类似的问题,即 only 获取最新的行,这是我现在正在做的事情< / p>

<form id="test_table">
<table>
  <thead>
    <tr>
      <th> ID </th>
      <th> col2 </th>
      <th> col3 </th>
    </tr>
  </thead>
  <tbody><!--table body-->
  <form id="form_x">
    <tr>
      <td> <input type="text" name="col1" default value="1"> </td>
      <td> <input type="text" name="col2" default value="cat"> </td>
      <td> <input type="text" name="col3" default value="dog"> </td>
    </tr>
    <tr>
      <td> <input type="text" name="col1" default value="2"> </td>
      <td> <input type="text" name="col2" default value="fish"> </td>
      <td> <input type="text" name="col3" default value="rabbit"> </td>
    </tr>
  </tbody>
</table>
</form>

<button  class="btn btn-primary" value="test_table" onclick="update(this.value)">Update</button>
<p><tt id="results"></tt></p>

<script>
function update(form_name){
  var str = $( test_table ).serialize();
  $( "#results" ).text( str );
  $.ajax({
    type: "POST",
    url: "/site/pages/update.php",
    data: $( "#"+form_name ).serialize(),
    success : function(res){ console.log(res); }
  });
}
</script>

我可以看到正在捕获的序列化数据,即

col1=1&col2=cat&col3=dog&col1=2&col2=fish&col3=rabbit

但是当我转储正在传递的内容时,它只会看到最后一行的值

update.php

<?php var_dump($_POST); ?>

结果:

array(3) {
  ["col1"]=>
  string(1) "2"
  ["col2"]=>
  string(4) "fish"
  ["col3"]=>
  string(6) "rabbit"
}

谁能指导我一些建议来修复我的update.php页面以遍历POST数据?我想从该行的每个ID更新数据库行,例如

//setup loop
$sql = "UPDATE Table SET 
col2 ='".$_POST["col2"]."', 
col3 ='".$_POST["col2"]."', 
WHERE id='".$_POST["col1"]."' ";

$sql = "UPDATE table SET
col2='cat' , col3='dog'
WHERE id=1";

$sql = "UPDATE table SET
col2='fish' , col3='rabbit'
WHERE id=2";

================================================ ==========================

旧问题:

我试图让用户编辑动态创建的行(在TD中具有基于用户的输入),该行在单击更新按钮时发送并更新,我可以看到输入已正确捕获,但是无法解决要从ajax调用更新数据库,下面是(节略的)代码:

form_page.php

<table id="table_name">
<thead>
    <tr>
        <th>ID</th>
        <th>Col 2</th>
        <th>Col 3</th>
    </tr>

   

与生成表行相关的phpcode:

<?php
echo '<form id="" method="POST" action="" >';
$sql= "SELECT * FROM tablename";
$stmt= $conn->prepare($sql);
$stmt->execute();
$results = $stmt->fetchAll();
foreach ($results as $row) {
echo '<td>';
echo 'ItemID_'.$row['ID'].'';
echo '</td>';
echo '<td>';
echo '  <input class="update_value" type="text" id="ItemID_'.$row['ID'].'" default value="'.$row['col2'].'">';
echo '</td>';
echo '  <input class="update_value" type="text" id="ItemID_'.$row['ID'].'" default value="'.$row['col3'].'">';
echo '</td>';
echo'</tr'>;
}
?>
<button type="button" id="update_button">Update</button>
</form>
</table>

可编辑的2/3列结果:

ID | col2             | col3
1  | lorem (editable) | ipsum    (editable)
2  | dolor (editable) | sit amet (editable)

Update (Button)

代码如下所示:

<table id="table_name">
<thead>
    <tr>
        <th>ID</th>
        <th>Col 2</th>
        <th>Col 3</th>
    </tr>
</thead>
<tbody>
<form id="" method="POST" action="">
    <tr>
        <td>
        ItemID_1
        </td>
        <td> <input class="update_value" type="text" id="ItemID_1" default value="lorem">
       </td>
        <td> <input class="update_value" type="text" id="ItemID_2" default value="ipsum">
       </td>
    </tr>
</tbody>
<button type="button" id="update_button">Update</button>

   

这是我用来将其发送到更新页面的ajax

<script>
$(document).ready(function(){
    $("#update_button").click(function(e) {
        e.preventDefault();
            var values = {};
            $('input.update_value').each(function(n, user_input){
                 values[ $(user_input).attr('id') ] = $(user_input).val();
                 //used to test and make sure its passing id vals to values
                 //alert(JSON.stringify(values, null, 4));
            });
        $.ajax({
            type: "POST",
            url: "/site/pages/update.php",
            data: { updatefrominputs: values }
        });
    });
});
</script>

上面的警报(用于测试)显示:

localhost says
{
    "ItemID_1": "lorem"
    "ItemID_1": "ipsum"
}

到目前为止,还可以,但是再单击一次,它会写上“ lorem”

localhost says
{
    "ItemID_1": "ipsum"
    "ItemID_2": "dolor"
}

这是第一个问题,它已覆盖“ lorem”值以进行发送

这是第二个问题,这是我目前遇到的问题,正在发送和更新数据库

通过将其添加到ajax中,我可以看到ajax正在发布:

success: function (data) {
    alert("sent");
}

update.php文件代码:

<? php
include connect.php //database connection script (don't think I need to call it)
foreach($_POST['updatefrominputs'] as $id=>$value)
$sqlQuery = "UPDATE tablename SET
        //col2=col2inputvalue
        //col3=col3inputvalue
        WHERE 
        //col1id=the NUMBER without the ID_part?
        ";
        $sqlQueryStmt = $conn->prepare($sqlQuery);
        $sqlQueryStmt->execute();
?>

我的问题是我似乎无法获取它来更新数据库,我不确定如何填写下面的UPDATE子句。另外,它甚至感觉都不会发布到此页面,但是成功功能表明确实如此?

此外,我如何才能获取WHERE子句中使用的数字?我可以编辑上面的代码,只给我ID号,然后使用col1ID=col1passedID,但是如果我在多个表单(同一页)上使用此过程,则会得到重复的ID。例如

<form 1>
    foreach ($results1 as $row1) {
    echo '  <input class="update_value" type="text" id="'.$row1['ID'].'" default value="'.$row['col2'].'">';
    }
</form 1>

<form 2>
    foreach ($results2 as $row2) {
    echo '  <input class="update_value" type="text" id="'.$row2['ID'].'" default value="'.$row2['col2'].'">';
    }
</form 2>

将输出:

<form 1>
    <input class="update_value" type="text" id="1" default value="lorem">
</form 1>

<form 2>
    <input class="update_value" type="text" id="1" default value="ipsum">
</form 2>

我能想到的一种解决方案是像这样发送ajax:

var updatedetals= {
    id: $("#ItemID_1").val(),
    col1: $("#col2").val(),
    col2: $("#col2").val()
      }
      $.ajax({
            type: "POST",
            url: "/site/pages/update.php",
            data:updatedetals,
            dataType: 'JSON',
            success: function(JSON){
                refreshResults();
            }
      });

但这也不会给我唯一的ID,我必须对每一行都进行ajax调用吗?

是否有更好的方法来遍历每个唯一生成的行,获取TD输入值并将这些更新的值发送到数据库?

2 个答案:

答案 0 :(得分:1)

您需要在HTML中使用name="col1[]",这将在数组中发送所有值。因为默认情况下您有多个具有相同名称php的输入会获取最后一个。如果添加[],则可以获取诸如$_POST["col1"][0]之类的值。 然后,您还可以遍历类似

的值
for($i=0;$i<count($_POST["col1"]);$i++){
    $col1 = $_POST["col1"][$i];
    $col2 = $_POST["col2"][$i];
    $col3 = $_POST["col3"][$i];
    //use the variables in update query
 }

答案 1 :(得分:1)

问题在于您的列具有重复的名称,但是$ POST需要值的唯一键。因此,您仅获得3个键:col1,col2和col3 ...,并且值被覆盖,因此只剩下最后一行的值。

如果要收集所有行,则应为每个行指定一个唯一的名称。例如

<form id="test_table">
<table>
  <thead>
    <tr>
      <th> ID </th>
      <th> col2 </th>
      <th> col3 </th>
    </tr>
  </thead>
  <tbody><!--table body-->
  <form id="form_x">
    <tr>
      <td> <input type="text" name="row1_col1" default value="1"> </td>
      <td> <input type="text" name="row1_col2" default value="cat"> </td>
      <td> <input type="text" name="row1_col3" default value="dog"> </td>
    </tr>
    <tr>
      <td> <input type="text" name="row2_col1" default value="2"> </td>
      <td> <input type="text" name="row2_col2" default value="fish"> </td>
      <td> <input type="text" name="row2_col3" default value="rabbit"> </td>
    </tr>
  </tbody>
</table>
</form>

<button  class="btn btn-primary" value="test_table" onclick="update(this.value)">Update</button>
<p><tt id="results"></tt></p>

<script>
function update(form_name){
  var str = $( test_table ).serialize();
  $( "#results" ).text( str );
  $.ajax({
    type: "POST",
    url: "/site/pages/update.php",
    data: $( "#"+form_name ).serialize(),
    success : function(res){ console.log(res); }
  });
}
</script>

尝试一下。这将在您的php $ POST中给您六个值。

然后,您可以遍历它们,并使用诸如splitsubstr之类的一些字符串切片技术来提取col名称。