里面有一个jQuery对话框的表单不提交

我有一个小窗体，其中包含一个jQuery UI对话框，用于在检查特定复选框时询问附加信息。该对话框打开并包含2个额外的复选框。里面有一个jQuery对话框的表单不提交

问题是，当表单被提交时，对话框中的2个复选框没有与表单的其余部分一起提交。从jQuery渲染对话框时我可以看出，它实际上是将它渲染到结束窗体标记之外，导致复选框不再是窗体的一部分。

我已经试过了诸如：

$("#dialog-form").parent().appendTo($("#ContactSpeakerForm:first"));

但还没有拿出一个很好的解决方案。

这里是我的JS：

$(function() { 

    var eventReg = $('#dialog-form').dialog({ 
     autoOpen: false, 
     modal: true, 
     buttons: { 
      Ok: function() { 
       $(this).dialog("close"); 
      } 
     } 
    }); 

    $('#Confirmed').click(function() { 
     if($('#Confirmed').attr('checked')) { 
      eventReg.dialog("open"); 
     } 
    }); 
});

下面是HTML：

<form id="ContactSpeakerForm" name="ContactSpeakerForm" action="/contacts/add-contact-speaker/id/3420" method="post"> 

    <input type="hidden" name="ID" value="" id="ID"> 
    <input type="hidden" name="Contact_ID" value="3420" id="Contact_ID">  

    <div class="page_panel_table"> 
    <table> 
     <tbody> 
      <tr> 
       <td align="right" class="form_label">Confirmed:</td> 
       <td> 
        <input type="checkbox" name="Confirmed" id="Confirmed" value="1"> 
       </td> 
      </tr> 
      <tr> 
       <td><input type="submit" name="submit" id="submit" value="Save"></td> 
      </tr> 
     </tbody> 
    </table>   
    </div> 

    <div id="dialog-form" style="display:none;" title="Speaker Event Registration"> 
     <input type="checkbox" name="RegisterForEvent" id="RegisterForEvent" value="1"> 
     <input type="checkbox" name="RegisterForDinner" id="RegisterForDinner" value="1"> 
    </div> 
</form>

任何人都知道一个好的解决方案？

来源

2012-03-26 Michael Irey

关键的问题是，一个对话框被附加到身体，使其更容易管理定位...所以它从您的表格中删除 – charlietfl 2012-03-26 19:00:46

@charlietfl：是这是问题。 – 2012-03-26 19:12:20

设置你的对话后，使用：

eventReg.closest('div.ui-dialog').appendTo('#ContactSpeakerForm');

这里有两个关键的东西。首先，在小部件有机会初始化并更改标记后执行此操作。其次，你消除了对直接父母/子女关系的依赖。

来源

2012-03-26 18:57:27 tvanfosson

谢谢你的作品！但仍有不良副作用。我设置了默认情况下要检查的对话框中的一个复选框，并且如果对话从不打开，则值不会在表单中提交。有任何想法吗？ – 2012-03-26 19:11:25

@MichaelIrey他们应该总是被提交，如果他们被检查。如果他们没有被检查，他们将不会被提交。我没有看到你在默认情况下设置了哪一个，所以如果对话框没有打开，那么也不会提交。 – tvanfosson 2012-03-26 19:20:58

@MichaelIrey - 看到这个http://jsfiddle.net/bezj8/2/ – tvanfosson 2012-03-26 19:32:32

我知道这是一个老问题，但任何人谁具有相同的问题，有一个新的和简单的解决方案：一个“appendTo”选项中的jQuery UI的1.10.0

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

被引入

$("#dialog").dialog({ 
    appendTo: "#ContactSpeakerForm" 
    .... 
});

来源

2013-12-14 22:52:58

里面有一个jQuery对话框的表单不提交

回答

相关问题