使用2个表单的SQL查询更新DIV
Update a DIV with 2 forms SQL query
我在一个html页面中有两个表单。我想用这两种形式的结果更新一个单曲。(form1或form2显示相同的结果。DIV将使用来自.php文件的1行进行更新。
这是我的代码:
我的html页面(2个表单):
<form name="form1" id="form1" action="result.php" method="post">
<input type="text" name="data1">
<input type="text" name="data2">
<input type="submit" value="OK">
</form>
<form name="form2" id="form2" action="result2.php" method="post">
<input type="text" name="data3">
<input type="text" name="data4">
<input type="submit" value="OK">
</form>
<div id="resultDIV"></div>
使用的脚本:
$('#form1').submit(function () {
$.post('result.php', $('#form1').serialize(), function (data, textStatus) {
$('#resultDIV').append(data);
});
return false;
});
$('#form2').submit(function () {
$.post('result2.php', $('#form2').serialize(), function (data, textStatus) {
$('#resultDIV').append(data);
});
return false;
});
但它不起作用。这段代码在一个新窗口中打开result.php或result2.php。(已编辑)
使用event.preventDefault();
$('#form1').submit(function (e) {
e.preventDefault();
$.post('result.php', $('#form1').serialize(), function (data, textStatus) {
$('#resultDIV').append(data);
});
return false;
});
$('#form2').submit(function (e) {
e.preventDefault();
$.post('result2.php', $('#form2').serialize(), function (data, textStatus) {
$('#resultDIV').append(data);
});
return false;
});
几件事:
- 您是根据表单的id引用表单,但它们没有id。您必须将其
id
属性设置为form1
和form2
- 您没有用
</form>
关闭<form>
标记 - 您可以使用
.preventDefault()
阻止页面重定向
HTML:
<form id="form1" name="form1" action="result.php" method="post">
<input type="text" name="data1">
<input type="text" name="data2">
<input type="submit" value="OK">
</form>
<form id="form2" name="form2" action="result.php" method="post">
<input type="text" name="data3">
<input type="text" name="data4">
<input type="submit" value="OK">
</form>
<div id="resultDIV"></div>
JS:
$('#form1').submit(function (e) {
e.preventDefault();
$.post('result.php', $('#form1').serialize(), function (data, textStatus) {
$('#resultDIV').append(data);
});
});
$('#form2').submit(function (e) {
e.preventDefault();
$.post('result2.php', $('#form2').serialize(), function (data, textStatus) {
$('#resultDIV').append(data);
});
});
这是我现在的代码。。。总是result.php,它在一个新窗口中打开,而不是更新我的DIV
头和/头之间的脚本
<script src="https://code.jquery.com/jquery-1.10.2.js"></script>
<script>
$('#form1').submit(function (e) {
e.preventDefault();
$.post('result.php', $('#form1').serialize(), function (data, textStatus) {
$('#resultDIV').append(data);
});
return false;
});
</script>
还有我的HTML文件(something.HTML):
<form name="form1" action="result.php" method="post" id="form1">
<input type="text" name="data1">
<input type="text" name="data2">
<input type="submit" value="OK">
</form>
<div id="resultDIV"></div>
好的,我用这个代码解决了(如果它能帮助其他人的话)
<script>
$(document).ready (function() {
$("form").submit(function () {
$.post("result.php",$(this).serialize(),function(texte){
$("div#resultDIV").append(texte);
});
return false;
});
});
</script>
相关文章:
- 更新从Mysql查询检索到的数据?Node.js节点mysql
- 向更新mysql查询传递一个id
- 每次在输入中键入新字符时更新查询
- 如何在不重新加载URL的情况下查询Node.Js的后端并更新页面
- 为什么我的文本框没有用查询结果更新
- 使用2个表单的SQL查询更新DIV
- 使用 IF 语句更新 mysql 查询
- 如何在 mongodb 中获取更新查询写入结果
- 在 BIRT 中输入参数后更新数据集查询
- Ng-重复在资源查询后不更新 - $apply() 不起作用
- 使用模态使用 php 更新查询
- 我怎样才能自动更新查询 PHP 或 JavaScript
- j查询更新表单元素
- 为什么当媒体查询更新 CSS 规则时,修改 CSS 规则会失败
- j查询更新图像 src 在悬停时
- 更新查询更新不起作用
- 如何使用Node.js中的MySQL查询更新MySQL数据库中的JSON记录
- 基于匹配查询更新所有文档和嵌入式文档中的字段.MongoDB NodeJS
- 如何在Neo4j中使用cypher查询更新关系细节
- 根据其他集合的查询更新文档