AJAX回報，

頁

上更新表我有一個在我的數據庫生成的每個記錄以下AJAX回報，

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

一旦這是一個表但是，用戶需要刷新頁面才能看到結果，有沒有一種方法可以填充用戶編輯的表格，以及更新查詢發生後的最新數據？

來源

2012-04-21 Liam

當然。您已經擁有他們提交的信息。只需使用DOM在表格中添加另一行即可。 jQuery使這很容易做到。 – 2012-04-21 22:03:04

請停止使用古老的'mysql_ *'函數編寫新代碼。他們不再被維護，社區已經開始[棄用流程]（http://news.php.net/php.internals/53799）。相反，您應該瞭解[準備好的陳述]（http://en.wikipedia.org/wiki/Prepared_statement）並使用[PDO]（http://php.net/pdo）或[MySQLi]（http：// php.net/mysql）。如果你關心學習，[這裏]（http://wiki.hashphp.org/PDO_Tutorial_for_MySQL_Developers）是一個相當不錯的PDO相關教程。 – 2012-04-21 22:06:27

我會嘗試不同的方法：

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

順便說一句，我假設有在同一個頁面其他按鈕，這是該使用類（bill-upd-submit）而不是id的原因。如果只有一個按鈕，則ID更快。另外，我認爲bill-upd-submit是類型按鈕。如果它的類型是提交，我會改變，它的按鈕或添加了以下點擊事件：

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

這將阻止表單提交的發生。

來源

2012-04-21 22:12:02

在我看來像你當前的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-21 22:41:11

回答

相關問題