ASP.Net AJAX 模态弹窗答案

【问题标题】：ASP.Net AJAX modal popup windowASP.Net AJAX 模态弹窗
【发布时间】：2011-12-13 20:25:41
【问题描述】：

首先我将描述网络表单布局：

该表单包含一个带有“详细信息”按钮的 GridView1，该按钮可打开第二个 GridView2，其目的当然是显示从父 GridView1 中选择的项目的详细信息。所有控件都在服务器端代码隐藏中动态呈现。

挑战：

我需要创建一个模式弹出窗口，当用户单击子 GridView2 中的图标作为 TemplateField 中的图像控件时显示该窗口。这样用户就可以将 cmets 添加到子 GridView2 中的详细信息中。

我的做法：

我试图在 PreRender 阶段将 AJAXToolKit 的模式弹出扩展器 (ID = "mpe") 连接到 TemplateField 中的图标。由于 TargetControlID 不能为空或为空，我正在做的是创建一个虚拟 Button 控件并将模态弹出扩展器的 TargetControlID 属性设置为调用的虚拟按钮的 ID，然后将 TemplateField 添加到 GridView2 后，我将 TargetControlID 属性设置为图标的 ID，即“icon_addComment”。

问题：

当我尝试将 TargetControlID 属性设置为图标的 ID 时，代码会抛出错误“‘mpe’的 TargetControlID 无效。找不到 ID 为‘icon_addComment’的控件。”。我对如何让它正常工作感到困惑，似乎没有办法绕过必须在模态弹出扩展器之前创建目标控件的条件。我想要的只是让子 GridView2 图标的 ID 成为模式弹出扩展器的 TargetControlID

【问题讨论】：

标签： asp.net ajax web-applications

【解决方案1】：

使用虚拟隐藏按钮作为模态弹出扩展器的目标控件 ID，然后使用 java-script 在实际图标单击时显示/隐藏模态弹出窗口。例如，

<asp:ModalPopupExtender runat="server" ID="MyPopup" ... />

<script type="text/javascript" />

function showPopup() {
  $find('<%= MyPopup.ClientID ').show();
}

function hidePopup() {
  $find('<%= MyPopup.ClientID ').hide();
}

</script>

就个人而言，我不是 ajax 控制工具包的粉丝。对于这个要求，我会使用jquery UI Dialog。

【讨论】：