jQuery模式对话框没有提交我的表单

我正在使用jQuerymodal dialog询问用户是否希望提交表单。

但是，在用户单击“对话框”的“提交”按钮后，表单未提交。

如果我再次单击表单提交按钮，则提交。

我猜这是一个范围问题，我已经看到了一些关于它的其他post但是我们已经花了很多时间没有运气。 关于如何解决这个问题的任何想法？

使用Javascript

$(document).ready(function(){ var submitForm = $('#myform'); submit = false; $("#confirm").dialog({ resizable: false, height: 140, modal: true, autoOpen: false, buttons: { 'Submit': function() { $(this).dialog('close'); submit = true; submitForm.submit(); }, 'Cancel': function() { $(this).dialog('close'); } } }); $("#confirm").parent().appendTo($("#myform")); submitForm.submit(function() { if (submit) { return true; } else { $("#confirm").dialog('open'); return false; } }); }); 

HTML

 
   
 
Please confirm that you want to submit 

Answer 1

解决方案就是……你的按钮名称。 你为什么问？ 我会告诉你的！

拿这个jsfiddle注意我只做了一些改动。 javascript没有改变，只是HTML

HTML

 
   
 
Please confirm that you want to submit
​ 

我做了两处改动：

1. 我将动作更改为jsfiddle兼容性的javascript调用
2. 我将您的按钮名称修改为提交以外的其他名称

我不得不做＃2，因为调用$（’＃myform’）。submit是引用按钮，而不是提交方法，jQuery有各种各样的困惑。 通过重命名你的按钮，$（’＃myform’）。submit仍然是预期的jQuery提交function，每个人都很高兴。

我经历了几次迭代，偶然发现了这一点，我为了后代而将其保留在下面。

祝好运！

=======下面的原始post========

如果你想做的就是“解决这个问题”，你可以按如下方式进行重构：

HTML

 
   
 
Please confirm that you want to submit
​ 

JavaScript的

 $(document).ready(function(){ var submitForm = $('#myform'); submit = false; $("#confirm").dialog({ resizable: false, height: 140, modal: true, autoOpen: false, buttons: { 'Submit': function() { $(this).dialog('close'); submit = true; submitForm.submit(); }, 'Cancel': function() { $(this).dialog('close'); } } }); $("#confirm").parent().appendTo($("#myform")); $("#btnSubmit").click(function() { $("#confirm").dialog('open'); }); submitForm.submit(function() { if (submit) { return true; } }); });​ 

奇怪的是，下面也是这样的：

HTML

 
   
 
Please confirm that you want to submit
​ 

JavaScript的

 $(document).ready(function(){ var submitForm = $('#myform'); submit = false; $("#confirm").dialog({ resizable: false, height: 140, modal: true, autoOpen: false, buttons: { 'Submit': function() { $(this).dialog('close'); submit = true; $('#myform').submit(); //submitForm.submit(); }, 'Cancel': function() { $(this).dialog('close'); } } }); $("#confirm").parent().appendTo($("#myform")); $("#btnSubmit").click(function() { $('#myform').submit(); }); submitForm.submit(function() { if (submit) { return true; } else { $("#confirm").dialog('open'); return false; } }); });​ 

我在这里更改的唯一内容是删除了提交按钮，100％通过jQuery提交。

Answer 2

将提交按钮的名称属性从“提交”更改为“btnSubmit”

将表单操作属性中的“＃”替换为空白或任何其他有效url。

Answer 3

您可以尝试提交事件表单，具有不同类型的事件。

 onsubmit="return confirm('Please confirm that you want to submit')" 

看到这个编辑 ，现在你可以用modal dialog改变创建一个函数返回true或false。