微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

动态 ModalPopupExtender 不触发 OK Click 事件

如何解决动态 ModalPopupExtender 不触发 OK Click 事件

ASP.NET 4.7.2 Web 窗体 c# VS 2019

我正在尝试使用 modalpopupextender提示输入外键字段的新数据。与表单本身一样,MPE 是在代码中即时构建的——在这种情况下,隐藏按钮的点击处理程序被 Javascript 触发以构建和显示 MPE。

我阅读了关于 SO 和 ASP 论坛的每一篇文章,并尝试了我在那里看到的所有内容。没有喜悦。我完美地得到了弹出窗口。点击 OK 关闭弹出窗口,但永远不会触发 OK 事件。

代码如下:

    //Building the form,we do this in OnInit:
    // AJAX Update Panel
    UpdatePanel PUP = new UpdatePanel()
    {
        ID = "PUP",};
    PlaceHolder.Controls.Add(PUP);                
    // HiddenField containing the field name to permit 
    // creating the correct modalpopup.
    HiddenField HFPopupField = new HiddenField()
    {
        ID = "HF_POPUP"
    };
    PUP.ContentTemplateContainer.Controls.Add(HFPopupField);
    // Create Hidden button to track the popup
    Button BPopup = new Button()
    {
        ID = "BPOPUP",UseSubmitBehavior = false  
    };
    BPopup.Click += BPopup_Click;
    BPopup.Attributes.Add("style","display: none;");
    PUP.ContentTemplateContainer.Controls.Add(BPopup);
    // And create the background panel for the popup.
    Panel PnlPopup = new Panel()
    {
        ID = "PNLPOPUP",CssClass = "MpeBackground"
    };
    PnlPopup.Attributes.Add("style","display: none;");
    PUP.ContentTemplateContainer.Controls.Add(PnlPopup);


    /// Event handler for hidden button.
    protected void BPopup_Click(object sender,EventArgs e)
    {
        [snip -- code to get the dataset that is being filled]
        UpdatePanel PUP = Placeholder.FindControlRecursive("PUP");
        Table T = new Table()
        {
            CssClass = "PopupTbl"
        };
        TableRow TRTitle = new TableRow();
        TableCell TCTitle = new TableCell()
        {
            CssClass = "PopupTitle",ColumnSpan = 2
        };
        Label LPopTitle = new Label()
        {
            Text = [title of the popup]
        };
        TCTitle.Controls.Add(LPopTitle);
        TRTitle.Cells.Add(TCTitle);
        DaTarow drData = null;
        // Add Fields,and also the cancel and Add buttons
        foreach (DataColumn DC in dsColumns.Tables[0].Columns)
        {
            TableRow TRColumn = [create a tablerow with 2 columns,a prompt and the input field]
            if (TRColumn != null) 
            { 
                T.Rows.Add(TRColumn);
                [snip]
            }
        }   // end of foreach(DataColumn DC in dsColumns.Tables[0].Columns)  
        PnlWindow.Controls.Add(T);
        TableRow TRButtons = new TableRow();
        TableCell TCButtons = new TableCell()
        {
            ColumnSpan = 2,CssClass="PopupButtons"
        };
        Button MPEBOK = new Button()
        {
            ID = "MPE" + sFieldName + "_MPEBOK",Text = "OK",CausesValidation = false,UseSubmitBehavior = false
        };
        MPEBOK.Click += MPEBOK_Clicked;
        TCButtons.Controls.Add(MPEBOK);
        LiteralControl LCB = new LiteralControl()
        {
            Text = "  "
        };
        TCButtons.Controls.Add(LCB);
        //************************************************************
        //*** Postback Trigger                                     ***
        //************************************************************
        AsyncPostBackTrigger trigger = new AsyncPostBackTrigger()
        {
            ControlID = MPEBOK.ID,EventName = "click"
        };
        PUP.Triggers.Add(trigger);
        //************************************************************
        //*** Cancel Button                                        ***
        //************************************************************
        Button MPEBuhBye = new Button()
        {
            ID = "MPE" + sFieldName + "_BUHBYE",Text = "Cancel",UseSubmitBehavior = false
        };
        TCButtons.Controls.Add(MPEBuhBye);
        TRButtons.Cells.Add(TCButtons);
        T.Rows.Add(TRButtons);
        PnlPopup.Controls.Add(PnlWindow);
        AjaxControlToolkit.ModalPopupExtender MPE = new AjaxControlToolkit.ModalPopupExtender()
        {
            ID = "MPE" + sFieldName,PopupControlID = "PNLPOPUP",TargetControlID = "BPOPUP",BackgroundCssClass = "MpeBackground"
        };
        // Add the MPE to the UpdatePanel.
        PUP.ContentTemplateContainer.Controls.Add(MPE);
        // Show the modal popup extender.
        MPE.Show();
    }

    protected void MPEBOK_Clicked(object sender,EventArgs e)
    {
        [snip - this never fires]
    }

我不知道这里发生了什么。任何人都可以看到一些奇怪的东西吗?

谢谢 约翰。

解决方法

您不能添加服务器端按钮或将服务器端按钮注入页面 DOM。

当您将 asp.net 按钮拖到表单上时,“mypage.cs”和 mypage.desinger.cs 都会更新。按钮的连接发生在设计时,您还必须修改 mypage.desinger.cs 并添加按钮事件存根。

所以你不能这样做。

妥协是还添加一些 js 并让该 HTML 按钮执行一个隐藏的 asp.net 按钮的 .click() 方法放入该页面(这将使您返回帖子,并在后面运行一个单独的按钮事件代码存根。

此事件解决发生在编译时 - 而不是在页面呈现时。您必须将该按钮拖放到页面上。

我想你可以采用一个标准,你总是把按钮放在页面上的“div”正下方(用 style=none 隐藏。然后如上所述,让你注入的代码和一些 js 执行点击隐藏按钮。或者只是让 js 按钮代码执行一个 __doPostback("some value") 并在页面加载事件中选择它,然后从页面加载事件调用例程(函数)。

我认为最好使用 jQuery.UI 对话框,因为该对话框可以说加载 + 使用另一个不同的网页到现有页面上的“div”中。因此,您可以将漂亮的弹出表单作为单独的网页进行布局、制作和创建。 jQuery 能够从该页面加载中删除“表单”和附加标签,然后将其注入现有页面。 (该代码很难重新生成)。所以 jQuery.UI 能够弹出那个单独的页面。但是,该加载页面(到该 div 中)上的按钮当然不能真正运行当前页面中的任何代码。但是,按钮可以在当前页面中运行本地js。因此,这个注入页面的操作对于每个页面都是本地的。但是弹出窗口不会直接调用存根后面的代码。

现在,要采用 jQuery.UI,那么您当然也必须采用 jQuery。所以这是你需要的两个额外的库。 (但是,您可能已经拥有 jQuery)。

但是,我认为使用 ajax 工具包的全部目的是首先避免使用 jQuery.ui。公平地说,在 jQuery.ui 出现之前,该工具包确实令人印象深刻,并且让 asp.net 的人们在竞争中占据了真正的优势。 (而且它往往比使用 jQuery.UI 的布线少得多

因此,鼎盛时期的 AjaxToolkit 令人印象深刻。现在,它当然显示了它的年龄,但我仍然使用该工具包,尤其是 AjaxFileUploader 的情况。是的,我确实使用弹出窗口 - 直到今天。但是,我现在发现 jQuery.UI 对话框更灵活,在这种情况下会更好(因为您需要即时设置)。

此外,即使在 jQuery.UI 对话框中的按钮后面也有代码,或者在这种情况下是 ajax 弹出窗口?好吧,只有操作按钮才能在后面运行代码。取消按钮当然只会关闭对话框。但是,对话框中的任何按钮都会在后面运行代码?好吧,没关系,因为你有一个页面回发,而且它实际上是页面回发,无论如何都会炸毁对话框。

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。