jQuery模态窗体对话框回发问题

Question

我已经创建了一个jQuery UI Modal表单,我希望该表单能够触发回发,但是我很难让它运行起来.

我知道有很多基于使用SimpleModal插件的文章,我试图改编这些并覆盖_doPostback函数,但没有任何乐趣.

我认为问题在于我的__doPostBack函数调用以及参数应该是什么.是这样的吗？

这是我的表格

<form id="summaryForm" runat="server">
    <div id="dialog" title="Quick Booking">
        <p>Select user from list or enter name in box</p>
        <fieldset>
            <p><label>Is machine going out of the office?</label></p>
            <asp:RadioButton  TextAlign="Left" GroupName="outOfOffice" Text="Yes" ID="optYes" class="radio" runat="server" />
            <asp:RadioButton  TextAlign="Left" GroupName="outOfOffice" Text="No" ID="optNo" class="radio" runat="server" Checked="true" />

            <label for="dropLstUser">User:</label>
            <asp:DropDownList ID="dropLstUser" runat="server" />
            <input type="text" name="txtUser" id="txtUser" value="" class="text" />
            <label for="txtStartDate">Start Date:</label>
            <input type="text" id="txtStartDate" name="txtStartDate" class="datepicker" />
            <asp:HiddenField ID="assetField" runat="server" />
            <%--<button onclick="performPostBack('summaryForm')">Postback</button>--%>
        </fieldset>
    </div>
    //--------------------------------

这是JavaScript代码:

<script type="text/javascript">
    $(function() {
        $("#dialog").dialog({
            bgiframe: true,
            height: 300,
            modal: true,
            buttons: {
                'Close': function() {
                             alert("closing");
                             $(this).dialog("close");
                             __doPostBack = newDoPostBack;
                             __doPostBack("aspnetForm",null);
                         }
            }
        });
    });

    function newDoPostBack(eventTarget, eventArgument)
    {
        alert("postingback");
        var theForm = document.forms[0];

        if (!theForm)
        {
            theForm = document.aspnetForm;
        }

        if (!theForm.onsubmit || (theForm.onsubmit() != false))
        {
            document.getElementById("__EVENTTARGET").value = eventTarget;
            document.getElementById("__EVENTARGUMENT").value = eventArgument;
            theForm.submit();
        }
    }
</script>

Answer 1

创建对话框后,只需将对话框移回表单即可.例:

 $("#divSaveAs").dialog({bgiframe:false,
                            autoOpen:false,
                            title:"Save As",
                            modal:true});
    $("#divSaveAs").parent().appendTo($("form:first"));

这对我有用.回发作品找到.

Answer 2

请注意,jQuery UI v1.10中还有一个附加设置.添加了一个appendTo设置,以解决您用于将元素重新添加到表单的ASP.NET变通方法.

尝试:

$("#dialog").dialog({ autoOpen: false, height: 280, width: 440, modal: true, appendTo:"form" });

Answer 3

'Close': function() {
             alert("closing"); 
             $(this).dialog("close"); 
             __doPostBack = newDoPostBack; 
             __doPostBack("aspnetForm", null); 
         }}});}); 

__doPostBack 函数获取导致回发的控制权和一个参数（如果需要）。您的 JavaScript 示例和标记似乎不匹配。例如，在我上面引用的地方，您引用 aspnetForm，将其更改为表单的 ID，然后重试。

确保用于客户端脚本的 ID 与运行时ASP.NET控件的客户端 ID 相同。如果控件驻留在 INamingContainer 中，那么它将具有基于其父容器的唯一 ID，因此 YourControlID 将变为 YourINaminContainerID_YourControlID。

让我们知道结果。