EM1*_*M10 3 html javascript php sql database
我有一个包含信息的HTML表格.现在我可以使用javascript 添加行并使用按钮删除行.我还可以使用Add Rows按钮直接将信息添加到数据库,并使用Delete Rows按钮从数据库中删除数据.但我不想使用这些按钮,因为我认为最好有另一个按钮,用于将所有信息一次性插入数据库.所以我需要有关如何从HTML表中读取信息并将其数据插入到mysql数据库的建议.
这是代码:现在代码不会将数据插入数据库.
<HTML>
<HEAD>
<TITLE> Add/Remove dynamic rows in HTML table </TITLE>
<SCRIPT language="javascript">
function addRow(tableID) {
var table = document.getElementById(tableID);
var rowCount = table.rows.length;
var row = table.insertRow(rowCount);
var cell1 = row.insertCell(0);
var element1 = document.createElement("input");
element1.type = "checkbox";
element1.name="chkbox[]";
cell1.appendChild(element1);
var cell2 = row.insertCell(1);
cell2.innerHTML = rowCount;
var cell3 = row.insertCell(2);
cell3.innerHTML = rowCount;
var cell4 = row.insertCell(3);
cell4.innerHTML = rowCount;
var cell5 = row.insertCell(4);
cell5.innerHTML = rowCount;
var cell6 = row.insertCell(5);
cell6.innerHTML = rowCount;
}
function deleteRow(tableID) {
try {
var table = document.getElementById(tableID);
var rowCount = table.rows.length;
for(var i=1; i<rowCount; i++) {
var row = table.rows[i];
var chkbox = row.cells[0].childNodes[0];
if(null != chkbox && true == chkbox.checked) {
table.deleteRow(i);
rowCount--;
i--;
}
}
}catch(e) {
alert(e);
}
}
</SCRIPT>
</HEAD>
<BODY>
<INPUT type="button" value="Add Row" onclick="addRow('dataTable')" />
<INPUT type="button" value="Delete Row" onclick="deleteRow('dataTable')" />
<TABLE id="dataTable" border="1">
<tr>
<th><INPUT type="checkbox" name="chk[]"/></th>
<th>Make</th>
<th>Model</th>
<th>Description</th>
<th>Start Year</th>
<th>End Year</th>
</tr>
</TABLE>
</BODY>
</HTML>
是..你有很好的JavaScript代码来添加动态内容..哇..现在你想将这些内容插入MySQL表..你可以...在进行那么小的修改之前做你的代码..首先你要了解插入对数据库来说,你有一个HTML表单元素..和控件..你可以动态添加HTML表单元素,如下所示
function addRow(tableID) {
var table = document.getElementById(tableID);
var rowCount = table.rows.length;
var row = table.insertRow(rowCount);
var cell1 = row.insertCell(0);
var element1 = document.createElement("input");
element1.type = "checkbox";
element1.name="chkbox[]";
cell1.appendChild(element1);
var cell2 = row.insertCell(1);
cell2.innerHTML = "<input type='text' name='item[]'>";
var cell3 = row.insertCell(2);
cell3.innerHTML = "<input type='text' name='price[]' />";
var cell4 = row.insertCell(3);
cell4.innerHTML = "<input type='text' name='qty[]' />";
}
保持删除方法相同,但只更改此行
var i=1
至
var i=0
现在更改您的HTML代码如下,确保您的表体标签有一个名为"dataTable"的ID,并删除您复选框,将表单元素放到您的表...砰......
<INPUT type="button" value="Add Row" onClick="addRow('dataTable')" />
<INPUT type="button" value="Delete Row" onClick="deleteRow('dataTable')" />
<form action="" method="post" name="f">
<TABLE width="425" border="1">
<thead>
<tr>
<th width="98"></th>
<th width="94">Item</th>
<th width="121">Price</th>
<th width="84">Qty</th>
</tr>
</thead>
<tbody id="dataTable">
</tbody>
</TABLE>
<INPUT type="submit" value="Insert" name="submit" />
</form>
//创建mysql数据库,然后创建表//以下是示例
CREATE TABLE `your_table_name` (
`id` int(11) NOT NULL auto_increment,
`item` varchar(200) NOT NULL,
`price` varchar(200) NOT NULL,
`qty` varchar(200) NOT NULL,
PRIMARY KEY (`id`)
) ENGINE=InnoDB DEFAULT CHARSET=latin1 AUTO_INCREMENT=1 ;
greate ...现在这是有趣的部分..我使用php语言将数据插入数据库..确保你应该创建数据库连接..
<?php
if($_POST[submit])
{
foreach ($_POST['item'] as $key => $value)
{
$item = $_POST["item"][$key];
$price = $_POST["price"][$key];
$qty = $_POST["qty"][$key];
$sql = mysql_query("insert into your_table_name values ('','$item', '$price', '$qty')");
}
}
?>
我认为这篇文章对所有人都很重要.
首先，您应该将客户端和服务器端分开：
客户端是浏览器，HTML 表存储在“浏览器”内存中，所有编辑都在客户端计算机上完成，您可以断开互联网连接并仍然使用此页面 - 并且它将起作用（添加/删除行）
服务器端在远程服务器上工作，不知道客户端的 HTML 表中插入了哪些行/列。
因此，完成后，您需要某种机制将数据从客户端发送到服务器。
第二项：HTML表和关系数据库表是不同的实体，HTML表只是数据的直观表示，关系数据库表是特定数据库（可以有多个数据库，每个数据库可以有多个表）中的实体，存储在光盘（在通常是服务器）。
HTML 表可以有动态行/列，但 RD 表只能有动态行，不能有列（不完全正确，一些 RDBMS 允许删除列）。
最后 - 你应该解决 2 个问题：
<form action="phpscript.php">...</form>将数据从客户端发送到服务器，这可以通过放置并向其添加“提交”按钮来实现<table>，不要忘记在某些“隐藏”字段中存储列/行的数量，另外 - 我想您需要在此单元格中提供数据，所以<input>在每个 HTML 表格单元格中添加
在服务器上存储数据 - 对于 mysql，您确实可以使用动态列添加/删除，但您也可以只存储带有数据的 ROW 和 COLUMN 索引，例如：
0, 0, dataincell_0_0 1, 0, 数据incell_1_0