javascript - 从嵌套的 jquery 对话框运行服务器端方法

Question

试图在嵌套的 jquery 对话框中调用服务器端函数

设计是这样的:

[第一个对话]

• 点击一个按钮打开第二个对话框
• 点击另一个按钮运行服务器端方法。 (工作正常)
• gridview 通过服务器端方法更新。

[第二个对话]

• 点击按钮运行服务器端方法 var btnConfirm = document.getElementById("<%= BtnAvailEmpAccept.ClientID %>"); btnConfirm.click();

[第一个对话框] 按预期工作正常，但在 [第二个对话框] 中没有任何反应。[第二个对话框] javascript 代码被执行但从未命中服务器端方法。

每个对话框的两个“div”包含在一个更新面板中，因为我有要通过按钮单击事件更新的 GridView 。

这是[第二个对话]

 $confirmWindow = jQuery("#empConfirmDiv");
                            $confirmWindow.show();
                            $confirmWindow.dialog("open");
                            //instantiate the dialog
                            $confirmWindow.dialog({
                                dialogClass: "empConfirmDialog",
                                maxHeight: 600,
                                width: 1200,
                                resizable: false,
                                modal: true,
                                position: 'center',
                                autoOpen: false,
                                title: 'Exception - Confirmation',
                                overlay: { opacity: 0.5, background: 'black' },
                                buttons: {
                                    "Decline": function () {
                                        var btnDecline = document.getElementById("<%= BtnAvailEmpReject.ClientID %>");
                                        btnDecline.click();

                                    },
                                    "Left Message": function () {
                                        var btnMsg = document.getElementById("<%= BtnAvailEmpMsg.ClientID %>");
                                        btnMsg.click();
                                    },
                                    "Confirm": function () {
                                        var btnConfirm = document.getElementById("<%= BtnAvailEmpAccept.ClientID %>");
                                        btnConfirm.click();
                                    },
                                    "Cancel": function () {
                                        $(this).dialog("close");
                                    }

                                }
                            });

asp:button 运行服务器端方法:

<asp:Button ID="BtnAvailEmpAccept" runat="server" Width="10px" Height="10px" OnClientClick="return SetValidateTrue()"
                            OnClick="BtnAvailEmpAccept_Click" />

有没有人知道为什么 button.Click() 不调用服务器端方法？

> 已编辑:这是我的答案!

    var showDialogConfirmEmp = function () {
        $confirmWindow = jQuery("#empConfirmDiv");
        $confirmWindow.show();
        $confirmWindow.dialog("open");
    }

    var myWindowConfirmEmp =          
        jQuery("#empConfirmDiv").dialog({
            dialogClass: "empConfirmDialog",
            maxHeight: 600,
            width: 1200,
            resizable: false,
            modal: true,
            position: 'center',
            autoOpen: false,
            title: 'Exception - Confirmation',
            overlay: { opacity: 0.5, background: 'black' },
            buttons: {
                "Decline": function () {
                    var btnDecline = document.getElementById("<%= BtnAvailEmpReject.ClientID %>");
                    btnDecline.click();
                },
                "Left Message": function () {
                    var btnMsg = document.getElementById("<%= BtnAvailEmpMsg.ClientID %>");
                    btnMsg.click();
                },
                "Confirm": function () {
                    var btnConfirm = document.getElementById("<%= BtnAvailEmpAccept.ClientID %>");
                    btnConfirm.click();
                },
                "Cancel": function () {
                    $(this).dialog("close");
                }

            }
        });

    var showDialogAvailEmp = function () {
        SetValidateTrue();
        if (IsScheduleWorkChecked()) {
            var button = document.getElementById("<%= btnListEmp.ClientID %>");
            button.click();
            $myWindowAssign = jQuery("#availEmpDiv");
            $myWindowAssign.show();
            $myWindowAssign.dialog("open");
            $myWindowAssign.parent().appendTo(jQuery("form:first"))
        }
        else {
            alert("Please select a work to assign!");
        }

    }
    var myWindowAvailEmp = jQuery("#availEmpDiv").dialog({ maxHeight: 600,
        width: 700,
        resizable: false,
        modal: true,
        position: 'center',
        autoOpen: false,
        title: 'Exception - Available Employees',
        overlay: { opacity: 0.5, background: 'black' },
        buttons: [{
            text: "Proceed",
            "id": "btnProceed",
            click: function () {                        
                Page_IsValid = true;
                if (Page_IsValid) {
                    var btnProceed = document.getElementById("<%= btnProceed.ClientID %>");
                    btnProceed.click();
                }
                $confirmWindow = jQuery("#empConfirmDiv");
                $confirmWindow.show();
                $confirmWindow.dialog("open");
                myWindowConfirmEmp.parent().appendTo(jQuery("form:first"));

            }
        },
            {
                text: "Cancel",
                "id": "btnAvailCancel",
                click: function () {
                    $(this).dialog("close");
                }
            }]
    }); // myWindow


    // JQuery UI: Diaglog
    jQuery(document).ready(function () {

        jQuery("#BtnAssign").click(showDialogAvailEmp);
        //variable to reference window
        myWindowAvailEmp.parent().appendTo(jQuery("form:first"));
        ...

Answer 1

我必须添加“form:first”:“这样做的原因是对话框函数拉取您的元素并将其放入放置在 Form 标记外部的窗口容器中”

喜欢:

myDialog.parent().appendTo(jQuery("form:first"));

http://labs.kaliko.com/2011/08/jquery-ui-dialog-aspnet-postback.html帮助过我!