如何解决动态 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 举报,一经查实,本站将立刻删除。