0

我为数据库中的每条记录生成以下内容

$allbills = mysql_query("SELECT * FROM outgoings WHERE outgoings.user_id = '$uid'") or die(mysql_error()); 

        echo "<table>";
        while($info = mysql_fetch_array( $allbills )) 
         { 
         echo "<tr>"; 
         echo "<th>bill id:</th> <td>".$info['id'] . "</td> ";
         echo "<th>total:</th> <td>".$info['bill'] . "</td> ";
         echo "<th>bill name:</th> <td>".$info['bill_name'] . "</td> ";
         echo "<th>bill deposit:</th> <td>".$info['bill_description'] . "</td> "; 
         echo "<th>colour:</th> <td>".$info['bill_colour'] . " </td>"; 
         echo "<th>edit:</th> <td>

         <form class='bill-upd'>
             <input type='hidden' value='".$info['rand']."' name='rand2' id='rand2'>
             <input type='hidden' value='".$info['id']."' name='billid' id='billid'>
            Total <input type='text' id='total' name='total' /><br />
            Bill name<input type='text' id='bill-name' name='bill-name' /><br />
           bill descriptiion <input type='text' id='bill-description' name='bill-description' /><br />
            bill colour<input type='text' id='bill-colour' name='bill-colour' />
        <input type='button' value='submit' class='bill-upd-submit' />
        </form>   

         </td>"; 
         echo "</tr>";
         }
         echo "</table>";

这会使用 AJAX 更新我的用户在表中的记录

$(document).ready(function(){   
    $(".bill-upd-submit").click(function() {
        var elem = $(this);
        $.post('update_bill.php', elem.parent('.bill-upd').serialize(), function(data) {
            elem.append(data);
        });
    });
});

但是，一旦完成，用户需要刷新页面以查看结果，有没有办法可以在更新查询发生后使用最新数据填充用户编辑的表？

4

2 回答 2

1

我会尝试不同的方法：

1）在按钮之后添加一个不可见的 div。您可以动态执行此操作：

$(document).ready(function() {
   $(".bill-upd-submit").after("<div style='display:none'></div>");
    // ...
});

2）现在您的发布事件如下：

 $(".bill-upd-submit").click(function() {
      var elem = $(this);
      $.post("update_bill.php", elem.parent(".bill-upd").serialize(), function(data) {
            elem.next("div").html(data);
      });
});

顺便说一句，我假设同一页面中还有其他按钮，这就是使用 class (bill-upd-submit) 而不是 id 的原因。如果只有一个按钮，则 id 更快。另外，我认为 bill-upd-submit 是按钮类型。如果是提交类型，我会将其更改为按钮或将以下内容添加到单击事件中：

function() {
    // ... the code shown above
    return false;
});

这将阻止表单的提交发生。

于 2012-04-21T22:12:02.460 回答
0

在我看来，您当前的 javascript 正在尝试附加表单，而不是表格。如果您尝试在底部的表格中添加一行并保留所有其他行，那么这可能会起作用。在 html 标记中为您的表指定一个 ID（这里我使用“table_id”）：

     $(".bill-upd-submit").click(function() {
         $.post("update_bill.php", elem.parent(".bill-upd").serialize(), function(data){
         $("#table_id tr:last").after(data);             
         });
     });

并且只需确保您的 php 文件 (update_bill.php) 内置了适当的 html 来为您回显适当的 tr。

于 2012-04-21T22:41:11.123 回答