我有一个问题,如何使用javascript将数据插入MySql DB?
我有以下JS代码:
function saveData()
{
var table = document.getElementById('tblResult');
var rowCount = table.rows.length;
i = rowCount;
var template = "<tr> <td>"+i+"</td> <td>"+document.getElementById('ctrl_ball_size_val').value+"</td> <td style='text-align: center; background-color: lime;'>± 0.1</td> <td>"+document.getElementById('ctrl_cilindr_height_val').value+"</td> <td style='text-align: center; background-color: lime;'>± 0.1</td> <td>"+document.getElementById('stopwatch').value+"</td> <td style='text-align: center; background-color: lime;'>± 0.1</td> <td>11300</td> <td style='text-align: center; background-color: lime;'>± 0.1</td> <td>1260</td> <td style='text-align: center; background-color: lime;'>± 0.1</td> </tr>";
$('tbody').append(template);
}
使用此代码我正在构建一个包含动态数据的表,这是我从html页面上的输入获得的。 这是表格的HTML代码:
<table id="tblResult" class="zebra-striped">
<thead>
<tr>
<th id="ID">Nr.p.k</th>
<th>d ± △d, mm</th>
<th style="background-color: lime;">△d, mm</th>
<th>l ± △l, cm</th>
<th style="background-color: lime;">△l, cm</th>
<th>t ± △t, s</th>
<th style="background-color: lime;">△t, s</th>
<th>p ± △p, kg/m<sup>3</sup></th>
<th style="background-color: lime;">△p, kg/m<sup>3</sup></th>
<th>p<sub>1</sub> ± △p<sub>1</sub>, kg/m<sup>3</sup></th>
<th style="background-color: lime;">△p<sub>1</sub>, kg/m<sup>3</sup></th>
</tr>
</thead>
<tbody></tbody>
</table>
我在其中插入此动态数据。 所以我需要将所有HTML表插入/保存到MySQL DB中,这个表将显示在第二页上,但如何组织这些数据插入然后显示我不知道......任何人都可以帮我吗?
答案 0 :(得分:0)
您将需要某种类型的服务器端软件来连接到您的数据库。只有Javascript和HTML不会让你到那里。您可以发出AJAX请求(或标准POST),但后端必须有一些东西来响应请求。
您是否在服务器上运行以下任何内容:ColdFusion,PHP,Python,Ruby,C ++,Java,ASP,Perl?
编辑:
像@showdev建议的那样,您可以使用AJAX将您的请求发布到PHP页面,该页面将针对您的数据库运行INSERT语句(请参阅@ blunderBoy的回答)。听起来你在屏幕上有一个用来输入数据的表单,如果你使用jQuery,你的AJAX请求可能如下所示:$.post("test.php", $("#testform").serialize() );
其中test.php
是您要发布到的网址,testform
是输入所在表单的ID。
将该行放入saveData()函数中,在该函数中将行追加到表中。
答案 1 :(得分:0)
你无法通过JavaScript单独完成这一切。您需要了解客户端和服务器端之间的区别。看到你的所有JS代码将在用户的浏览器上运行所以你无法在客户端像mySql那样提供永久存储。您有一些HTML5存储API,如webstorage,localstorage,但这些API在大小和其他方面存在限制。我不打算深入研究这些。所以我们在服务器端有我们的数据库。当我们需要一些数据时,我们发送一个get请求并获取它。同样,我们希望保存一些我们使用数据发布请求的数据。我们在后端运行一些服务,响应这些GET和POST请求,并对发送的数据采取适当的操作。如果你想看一下示例php代码与数据库进行交互。看看下面的PHP代码与数据库进行交互。
<?php
/****** 5 Step Story ***********
1. Create a connection
2. Select the database
3. Fire the query
4. Use query result
5. Close the connection
*******************************/
// Step1. Create a connection
$con = mysql_connect("localhost", "root", "root");
if (!$con) {
die("Database connection could not be established" . mysql_error());
}
// Step2. Select the database
$db_select = mysql_select_db("widget_corp", $con);
if (!$db_select) {
die("Database could not be selected" . mysql_error());
}
?>
<html>
<head>
<title> Database Interaction (MySQL + PHP) </title>
</head>
<body>
<h1><center><u>Database Interation (MySQL + PHP) </u></center></h1>
<?php
// Step3: Querying from Database
$result = mysql_query("SELECT * from subjects", $con);
if (!$result) {
die("Error in firing query on database" . mysql_error());
}
// Step4: Using query result
/* $row is an associative array as well So both types of indexes work on it
Numeric indexes as well as Keys both work */
while ($row = mysql_fetch_array($result)) {
echo $row["id"] . " " .
$row["menu_name"] . " " .
$row[2] . " " .
$row[3] . "<hr>";
}
?>
</body>
</html>
<?php
mysql_close($con);
?>