2011-11-16 71 views
1

我有一個顯示數據庫值的html表。我有一個JavaScript,使我能夠編輯這些數據,但我不知道如何使用PHP將其保存回數據庫。我發現一些信息,我應該使用xmlhttprequests,但我不知道如何做到這一點。有什麼建議麼?非常感謝您的幫助。下面的代碼;將html表中的值保存到數據庫

<html xmlns="http://www.w3.org/1999/xhtml"> 
    <head> 
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> 
    <title>Untitled Document</title> 
    <script type="text/javascript"><!-- 

    function edit_input(obj) { 
    var is_checked = obj.checked; 
    while (obj.tagName!='TR') 
    obj = obj.parentNode; 

    var td = obj.getElementsByTagName('TD'); 
    var len = td.length; 

    if (!is_checked) { 

    for (var i=0; i<len; i++) 
    if (td[i].className=='editable') 
    td[i].innerHTML = td[i].firstChild.value; 


    } else { 

    var input; 

    for (var i=0; i<len; i++) 
    if (td[i].className=='editable') { 
    input = document.createElement('INPUT'); 
    input.value = td[i].innerHTML; 
    td[i].innerHTML = ''; 
    td[i].appendChild(input); 
    } 
    } 

    } 


    --></script> 


    </head> 

    <body> 
    <table border="1"> 
    <tr> 
     <th width="56">Branch ID</th> 
    <th width="75">Branch Name</th> 
     <th width="75">Branch Personnel</th>        
     <th width="105">Branch Headquaters</th> 
    <th width="50">Edit</th> 
    </tr> 
<?php 

$result = mysql_query($query); 
    while ($row= mysql_fetch_array($result)) { ?> 
     <tr> 
      <td class="editable"><?php echo $row['branchid'];?></td> 
      <td class="editable"><?php echo $row['branchname'];?></td>  
      <td class="editable"><?php echo $row['branchpersonnel'];?></td> 
      <td class="editable"><?php echo $row['branchhq'];?></td> 
     <td><input type="checkbox" onclick="edit_inpu(this);">Edit</td> 
     </tr>           
<?php } ?> 
    <tr><td><input type="submit" name="editbranch" class="button2"  value="Update"/></td></tr> 
</table>  
    </body> 
    </html> 
+1

您需要學習AJAX,請參閱http://www.w3schools.com/php/php_ajax_intro.asp –

+3

http://w3fools.com/ ...也許有一個看看那裏一旦你已經看過w3schools –

+0

@ RupeshPawar - 你應該避免推薦w3schools。它有一些嚴重的問題。 – Polynomial

回答

2

如果使用jQuery是沒有問題的,也許使用類似JEditable是一個解決方案。當你點擊表格中的一個單元格時,它會變成一個文本字段,當按下輸入或離開焦點時,它會向服務器發出網絡請求,您可以在其中進行更改。

參見例如this jsfiddle腳本。它非常易於使用。唯一需要做的其他事情是給表格單元一個id,它會被髮送到你保存的頁面。

+0

嗨Ikke,謝謝,但像使用jQuery一樣簡單,我以前沒有使用它。我知道我應該學習它,但我現在不能應用它。任何其他想法? – Nas

+0

學習jQuery比學習javascript和XHR更容易。該組件爲您處理所有工作。 – Ikke

+0

一定要試一試! – Nas

0

您的腳本是否通過XMLHttpRequest觸發了一個Ajax請求,該腳本將值保存回數據庫。

的URL可以是這樣的:updatetable.php?row=0&col=0&data=1234

+0

我試圖理解你,但不知何故我迷路了。所以我應該有一個單獨的PHP腳本,做更新然後解決我的更新按鈕作爲updatetable.php?row = 0&col = 0&data = 1234 ?這是什麼意思? – Nas

+0

不,您應該使用Ajax來觸發對腳本的HTTP請求。請參閱我鏈接的XMLHttpRequest文檔。 – Polynomial

+0

好吧,正在工作... – Nas