Jquery - 动态表单元素未提交
我的问题是,我制作的页面基本上像模态表单对话框的 jQuery 演示一样工作,只不过在添加了所需的所有行之后,它会在最后提交它们。 我不只是使用 AJAX 来在创建行并保存它们的地方工作,是因为表单包含从 PHP 和 PHP 创建的动态行。 SQL 链接到使用模态形式添加的行,并且需要在添加所有行后进行处理。
表单页面有一堆使用 PHP 创建的行,从 1 到 X。
<table>
<form action="submitform.php" method="POST">
<input type="hidden" name="order" value="X">
<tr><td><input type="text" name="1" value=""</td></tr>
<div id="1"></div>
<tr><td><input type="text" name="2" value=""</td></tr>
<div id="2"></div>
<tr><td><input type="text" name="3" value=""</td></tr>
<div id="3"></div>
...
...
<tr><td><input type="text" name="X" value=""</td></tr>
<div id="X"></div>
</table>
当文本字段更改时,弹出窗口会要求提供更多信息,然后在已更改的文本框下方添加行。 当弹出窗口完成时,上面的
标签使用 jQuery 填充额外的表单元素。itemHiddenInfo = "<input type='hidden' name='"+temp2+"A"+x+"' value='"+itemNum+"_"+itemID+"'/>";
$( "#"+itemDiv ).append("<tr id='"+temp2+"_"+x+"R' class='"+temp2+"'>" +
"<td>" + itemHiddenInfo + itemMat + "</td>" +
"<td>" + itemQty + "</td>" +
"<td>" + itemNote + "</td>" +
"<td>" + "<button id='"+temp2+"_"+x+"' class='remmy'onclick=$('#'+this.id+'R').remove()>REMOVE</button>" + "</td>"+ "</tr>");
一切在视觉上看起来都很棒,行在预期的时候出现和消失,并且使用 Firefox 开发工具,我可以看到 DOM 已被修改为包含我添加的所有元素,但是当我尝试使用以下任一方法提交表单时“提交”按钮或通过 jQuery AJAX 和 .sequence()
来收集表单元素,这两种方法都无法识别
中添加的任何新表单元素> 的。页面上用于显示模态表单的
是使用另一个 PHP 文件动态生成的,该文件使用 $.get
方法填充结果填充表单
。此表单上填充的字段确实已提交,这就是为什么添加的其他字段没有提交似乎很奇怪。我环顾四周,似乎我做的一切都是正确的,但它不想合作。 我是在尝试做一些不可能的事情还是我在这里错过了一些东西?
非常感谢任何帮助。
My problem is that I made a page to work basically like the jQuery demo of a modal-form dialog box, except that after you've added all the rows you want, it will submit them at the end.
The reason i don't just AJAX this to work where as the rows are created they are saved, is because the form contains dynamic rows created from PHP & SQL which are linked to the rows that get added using the modal-form and need to be processed once all the rows have been added.
The form page has a bunch of rows created using PHP from 1 to X.
<table>
<form action="submitform.php" method="POST">
<input type="hidden" name="order" value="X">
<tr><td><input type="text" name="1" value=""</td></tr>
<div id="1"></div>
<tr><td><input type="text" name="2" value=""</td></tr>
<div id="2"></div>
<tr><td><input type="text" name="3" value=""</td></tr>
<div id="3"></div>
...
...
<tr><td><input type="text" name="X" value=""</td></tr>
<div id="X"></div>
</table>
When the text fields are changed, a popup asks for more information and then adds rows below the text box that has changed.
The above <DIV>
tags are filled with extra form elements using jQuery when the popup is completed.
itemHiddenInfo = "<input type='hidden' name='"+temp2+"A"+x+"' value='"+itemNum+"_"+itemID+"'/>";
$( "#"+itemDiv ).append("<tr id='"+temp2+"_"+x+"R' class='"+temp2+"'>" +
"<td>" + itemHiddenInfo + itemMat + "</td>" +
"<td>" + itemQty + "</td>" +
"<td>" + itemNote + "</td>" +
"<td>" + "<button id='"+temp2+"_"+x+"' class='remmy'onclick=$('#'+this.id+'R').remove()>REMOVE</button>" + "</td>"+ "</tr>");
And everything visually looks great, the rows appear and disappear when they are suppose to and using the Firefox development tools, I can see the DOM has been modified to include all the elements i have added, but when i try to submit the form using either a "SUBMIT" button or via jQuery AJAX and .sequence()
to gather the form elements, neither way will recognize any of the new form elements added in the <DIV>
's.
The <DIV>
on the page which is used to display the modal-form is dynamically generated using another PHP file which is populated using the $.get
method with the results populating the forms <DIV>
. The fields which get populated on this form do get submitted which is why it seems odd that the other fields added do not.
I've searched around and it seems like I am doing everything correctly but it doesn't want to cooperate.
Am I doing trying to do something that is impossible or am I missing something here?
Any help is greatly appreciated.
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
尝试使用
live
或委托
提交表单的方法Try to use
live
ordelegate
methods for submitting form