2012-04-19 256 views
0

我已經搜索了這個問題的答案,但找不到任何答案。將html表格輸入值添加到mysql數據庫表格

我想添加一個html表格的內容到一個MySQL數據庫使用PHP和JavaScript,其中每一行是一個新的記錄。

這裏有一個表例如:

<table width="100%" border="1" cellspacing="0" cellpadding="0"> 
    <tr> 
    <th scope="col">ID</th> 
    <th scope="col">NAME</th> 
    <th scope="col">EMAIL</th> 

    </tr> 
    <tr id="row"> 
    <td><input name="ID" type="text" value="20" /></td> 
    <td><input name="NAME" type="text" value="Peter" /></td> 
    <td><input name="EMAIL" type="text" value="[email protected]" /></td> 
    </tr> 
    <tr id="row"> 
    <td><input name="ID" type="text" value="21" /></td> 
    <td><input name="NAME" type="text" value="Jhon" /></td> 
    <td><input name="EMAIL" type="text" value="[email protected]" /></td> 
    </tr> 
    <tr id="row"> 
    <td><input name="ID" type="text" value="22" /></td> 
    <td><input name="NAME" type="text" value="Mike" /></td> 
    <td><input name="EMAIL" type="text" value="[email protected]" /></td> 
    </tr> 
</table> 

<input name="Btn" type="button" onclick="addRecords()" value="Add"/> 
</form> 

和我試過的JavaScript樣本:

<script> 
function addRecords() 
{ 
    var row = document.getElementById("row") 


    for (x in row) 
    { 
     $.post="<? $insertSQL = sprintf("INSERT INTO accounts (acc_id, acc_name, acc_email) VALUES (%s, %s)", 
         GetSQLValueString($_POST['ID'], "integer"), 
         GetSQLValueString($_POST['NAME'], "text"), 
         GetSQLValueString($_POST['EMAIL'], "text")); 

    mysql_select_db($database_G3CSAdminControlPanel, $G3CSAdminControlPanel); 
    $Result1 = mysql_query($insertSQL, $G3CSAdminControlPanel) or die(mysql_error()); ?>" 
    } 
} 

</script> 

上面做什麼,它只是增加了在最後一個記錄表到數據庫。 我猜我的問題是與PHP代碼,並且每個輸入應該放入數組以及不只是行,不知道如何做到這一點。

UPDATE 感謝您的回覆。我所展示的代碼僅僅是我想要做的一個例子。行的id必須保持不變,因爲我使用的是在我的實際網頁中創建表的腳本。

基本上我想做到以下幾點,但在PHP中:

<script> 
function addRecords() 
{ 
    var row = document.getElementById("row"); 
    var n = 0; 
    var q = 0; 
    for (x in "row") 
    { 
     n++; 
     var code = document.getElementsByName("ID")[q].value; 
     var desc = document.getElementsByName("NAME")[q].value; 
     var price = document.getElementsByName("EMAIL")[q].value; 
     alert(code + ' ' + desc + ' ' + price); 
     q++; 
    } 
    alert('There is ' + n + ' rows in the table'); 
} 
</script> 

腳本的每一行返回的輸入值。 我想在PHP中做類似的事情,但要將來自每行輸入的值作爲記錄添加到數據庫表中。

因此,不應該爲每行執行JavaScript警報,而應該執行一個php腳本來插入該行的記錄。

+0

你看看AJAX方法嗎?或JQuery? – Elen 2012-04-19 14:13:21

+0

JS在客戶端上運行,PHP在服務器上運行。你試圖做什麼都不行,期間。您需要使用AJAX或完整的往返傳統表單提交系統。 – 2012-04-19 14:16:17

+0

我會檢查出AJAX和JQuery。我現在意識到,服務器端PHP不能與客戶端JS混合使用。試圖找出如何在PHP中做到這一點,但PHP交互和返回html值/元素的方式並不像JS:/ – ChrisRSA 2012-04-19 20:09:55

回答

0

您必須唯一標識每一行(ID0,EMAIL0等)。當通過PHP或腳本構建表時,這很容易完成。然後在你的PHP表單代碼中,你在$ _GET上做了一個foreach並讀取它們。你現在的方式是,每個後續的ID,EMAIL等都寫完前一個。

0

您有三個要插入的字段。每個都有一些。所以你需要使用輸入字段的名稱作爲html數組。否則,在表單發佈後,最後一個字段將覆蓋之前的字段。相反

<table width="100%" border="1" cellspacing="0" cellpadding="0"> 
    <tr> 
    <th scope="col">ID</th> 
    <th scope="col">NAME</th> 
    <th scope="col">EMAIL</th> 
    </tr> 
    <tr id="row1"> 
    <td><input name="ID[]" type="text" value="22" /></td> 
    <td><input name="NAME[]" type="text" value="Mike" /></td> 
    <td><input name="EMAIL[]" type="text" value="[email protected]" /></td> 
    </tr> 
    <tr id="row2"> 
    <td><input name="ID[]" type="text" value="22" /></td> 
    <td><input name="NAME[]" type="text" value="Mike" /></td> 
    <td><input name="EMAIL[]" type="text" value="[email protected]" /></td> 
    </tr> 
    <tr id="row3"> 
    <td><input name="ID[]" type="text" value="22" /></td> 
    <td><input name="NAME[]" type="text" value="Mike" /></td> 
    <td><input name="EMAIL[]" type="text" value="[email protected]" /></td> 
    </tr> 
</table> 
+0

謝謝,花了我一段時間來弄清楚如何使用這些數組的代碼,但得到它的工作。而不是爲每一行分配一個唯一的名稱。我創建了一個隱藏字段,該字段的值爲每行增加javascript值。這個值然後用來遍歷所有的數組值。 – ChrisRSA 2012-04-24 12:00:31

0

不是直接訪問你的行,先得到你的表,然後將行:

具體講,如下編輯您的標記。

var table = document.getElementById('myTable'); 
for (i=1; i < table.rows.length; i++) { 
    var row = table.rows(i); 
} 
0

如果你有相同ID的多個元素,如:

<tr id="row"> 

則函數:

document.getElementById("row") 

只考慮他們的最後一個這取決於(瀏覽器)。

要確定你真的會得到所有的元素,你必須給他們不同的id。像

<tr id="row1">... 
... 
<tr id="row2">... 
... 
<tr id="row3">... 
... 

祝你好運!