php-AJAX表单仅执行一次(首次输入)
内容导读
互联网集市收集整理的这篇技术教程文章主要介绍了php-AJAX表单仅执行一次(首次输入),小编现在分享给大家,供广大互联网技能从业者学习和参考。文章包含2271字,纯文字阅读大概需要4分钟。
内容图文
![php-AJAX表单仅执行一次(首次输入)](/upload/InfoBanner/zyjiaocheng/669/d6809137dca345d09a6ce287023dafe4.jpg)
我通过while循环循环了sql select行的输出.每行都有自己的形式.只有第一种形式有效.其他表格只是刷新页面,并显示所有结果.在表单上提交
通过AJAX update.php函数被执行.它仅在第一个输入字段起作用,并且不知道如何触发其他对象.
的PHP
echo " <div class=\"col-6 flex-vcenter-items fs-1\">
<form id='form".$row["id"]."' action='' method='POST'>
<input id='id' name='potnik' value='".$row["id"]."' type='hidden' />
<input id='cas' class=\"form-control cas".$row["id"]." fancy-border\" type=\"text\" name=\"posodobljeni_cas\"/>
<input class='btn btn-outline-primary' id='submit' type='submit' value='Nastavi uro'>
<label id=\"info\"></label>
</form>
</div>";
JS
$( document ).ready(function() {
//Async update
$(function () {
let idrow = $("#id").val();
$('#form'+idrow).on('submit', function (e) {
let updaterow = "update.php?id=";
console.log(updaterow + idrow);
e.preventDefault();
$.ajax({
type: 'post',
url: updaterow + idrow,
data: $('#form'+idrow).serialize(),
success: function () {
console.log('ura posodobljena');
//Koda za vstavljanje
console.log("Prej?nji ?as",$("#id-ura"+idrow).text());
$("#id-ura"+idrow).replaceWith( $(".cas"+idrow).val() );
console.log("Novi ?as",$(".cas"+idrow).val());
}
});
});
});
});
解决方法:
基本的HTML规则是每个元素都有唯一的ID,因为您正在循环创建表单,所以我将使用类而不是ID
echo " <div class=\"col-6 flex-vcenter-items fs-1\">
<form class='form' data-id='".$row["id"]."' action='' method='POST'>
<input name='potnik' value='".$row["id"]."' type='hidden' />
<input class=\"form-control cas".$row["id"]." fancy-border\" type=\"text\" name=\"posodobljeni_cas\"/>
<input class='btn btn-outline-primary' type='submit' value='Nastavi uro'>
<label class=\"info\"></label>
</form>
</div>";
现在,我将根据类更改jQuery代码:-
$( document ).ready(function() {
$('input[type=submit]').on('click', function (e) {
e.preventDefault();
var obj = $(this);
let idrow = obj.closest("form").data('id'); // i have used data-id in forms
let updaterow = "update.php?id=";
$.ajax({
type: 'post',
url: updaterow + idrow,
data: obj.closest("form").serialize(),
success: function () {
//change these code also based on classes
console.log('ura posodobljena');
console.log("Prej?nji ?as",$("#id-ura"+idrow).text());
$("#id-ura"+idrow).replaceWith( $(".cas"+idrow).val() );
console.log("Novi ?as",$(".cas"+idrow).val());
}
});
});
});
内容总结
以上是互联网集市为您收集整理的php-AJAX表单仅执行一次(首次输入)全部内容,希望文章能够帮你解决php-AJAX表单仅执行一次(首次输入)所遇到的程序开发问题。 如果觉得互联网集市技术教程内容还不错,欢迎将互联网集市网站推荐给程序员好友。
内容备注
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 gblab@vip.qq.com 举报,一经查实,本站将立刻删除。
内容手机端
扫描二维码推送至手机访问。