一位朋友最近向我介绍了jquery,现在我想用它重写并开发一个库存Web应用程序。
我的原始应用程序包含一个简单的网页,要求您输入ID号并单击按钮。 id号通过post方法传递给php文件。 php文件查询数据库并在表格中显示结果。
我创建了一个HTML表单,我想使用更新,输入新记录,并根据按下的按钮显示查询结果。
此时我想显示查询结果。
我已经想出如何使用jquery在表单底部的div中显示查询结果。我需要帮助的是如何在表单的给定位置显示结果。
以下是我想要的一个简单例子:
<html>
< head>
< title>JQuery test< /title>
< /head>
< body>
< form>
< table>
< tr>< th>Equipment ID< /th>
< td>< input type="text name="eqid" id="eqid" />< /td>
< th>Manufacturer< /th>
< td>< input type="text name="manuf" id="manuf" />< /td>
< th>Model< /th>
< td>< input type="text name="model" id="model" />< /td>< tr>
< /table>
< div id=output> < /div>
< /form>
< /body>
< /html>
$("#submit_btn").click(function()
{
var data = $('form:first').serialize();
$.ajax(
{
url:"passdata.php",
type: "POST",
data:data,
success:function(data)
{
$("#output").html(data);
} //end success
}); // end ajax
}); // end click
这就是我在我的php文件中使用的
<?php
$eqid = $_POST['eqid'];
$manuf = 'Apple';
$model ='IPAD 2';
echo "<table border=0><tr>";
echo "<th align ='left'>Manufacturer</th><td><input name='manuf' id='manuf' type='text' size='10' value=" . $manuf . "></td></tr>";
echo "<tr><th align ='left'>Surveyed by</th><td><input name='model' id='model' type='text' value=". $model . "></td></tr></total>";
?php>
我希望查询(制造商和型号)的结果显示在上面示例中表单的适当位置。
任何建议都将不胜感激。
克里斯
答案 0 :(得分:1)
passdata.php需要进行数据库查询,然后返回数据。 JSON是一种很好的方法。
<?php
$iteminfo = array('id' => $id, 'manuf' => $manuf, 'model' => $model);
echo json_encode($iteminfo);
?>
您的ajax调用然后需要获取此数据并填充您的表单。
$("#submit_btn").click(function()
{
var data = $('form:first').serialize();
$.ajax(
{
url:"passdata.php",
type: "POST",
dataType: 'json',
data:data,
success:function(data)
{
$("eqid").val(data.id);
$("manuf").val(data.manuf);
$("model").val(data.model);
} //end success
}); // end ajax
}); // end click
当然如果你在所有CRUD操作中使用相同的表单,那么你的php必须像你的javascript一样偷偷摸摸。你确定这对你来说是一个好主意吗?