Jquery UI对话框内的输入没有被发送?

nei*_*eil 18 html forms post jquery-ui

我的对话框中的输入字段没有发布,我不知道为什么......

我已经在mac firefox和safari上测试了它,并且Windows IE和firefox具有相同的结果,所以我不认为它是浏览器,如果我禁用对话框,字段会发布.

我已经重新阅读了jquery ui docs并找不到我做错了什么......对话框似乎不太可能不支持输入.

这是我正在使用的代码的精简版本:

<script type="text/javascript">
 $(document).ready(function(){
  $("#dialog").dialog({
   autoOpen: false,
   buttons: {
    "OK": function() {
     $(this).dialog('close');
    }
   }
  });
  $("#publishSettings").click(function(){
   $("#dialog").dialog('open');
  });
 });
</script>

<form method="POST" action="publish.php">
 <input type="button" id="publishSettings" value="Publish Settings">
 <div id="dialog">
  Publish Date
  <input type="text" name="publishOn"><br>
  Unpublish Date
  <input type="text" name="unPublishOn">
 </div>
 <input type="submit" name="pubArticle" value="Publish">
</form>
Run Code Online (Sandbox Code Playgroud)

没什么不寻常的吧?为什么这不适合我!?

谢谢!

kri*_*hna 33

当JQuery打开对话框时,它会将其移到表单之外.

这是解决方案:

带有ASP.NET按钮回发的jQuery UI对话框

基本上在你的情况下:

var dlg =  $("#dialog").dialog({ 
   autoOpen: false, 
   buttons: { 
    "OK": function() { 
     $(this).dialog('close'); 
    } 
   } 
  }); 
dlg.parent().appendTo($("#yourformId")); 
Run Code Online (Sandbox Code Playgroud)

应该解决它.

  • 从jQuery UI v1.10.0开始,您可以使用appendTo属性直接执行此操作 - http://api.jqueryui.com/dialog/#option-appendTo (4认同)

Jec*_*kov 10

我知道这是一个老问题,但对于任何有相同问题的人来说,有一个更新更简单的解决方案:jQuery UI 1.10.0中引入了"appendTo"选项

http://api.jqueryui.com/dialog/#option-appendTo

$("#dialog").dialog({
    appendTo: "form"
    ....
});
Run Code Online (Sandbox Code Playgroud)