使用javascript在UpdatePanel上打开ModalPopupXtender
我试图用JavaScript打开一个ModalPopup,我在这里搜索了stackoverflow,一般的建议是使用如下内容:使用javascript在UpdatePanel上打开ModalPopupXtender,javascript,jquery,asp.net,ajaxcontroltoolkit,webforms,Javascript,Jquery,Asp.net,Ajaxcontroltoolkit,Webforms,我试图用JavaScript打开一个ModalPopup,我在这里搜索了stackoverflow,一般的建议是使用如下内容: $('#inputAdd').live("click", function () { $('#addRow').show(); $find('<%=mpeIndications.BehaviorID %>').show(); }); 其中inputAdd是我在ModalPopup中拥有的一个html输入图像,它的目标是在显示文本框的地方显示
$('#inputAdd').live("click", function () {
$('#addRow').show();
$find('<%=mpeIndications.BehaviorID %>').show();
});
其中inputAdd是我在ModalPopup中拥有的一个html输入图像,它的目标是在显示文本框的地方显示一行addRow。然而,当我点击inputAdd按钮时,它显示了行,但是ModalPopup隐藏了,我想原因可能是因为有一个包含ModalPopup的UpdatePanel,对吗?在这种情况下,哪一种可能是解决方案?我已经将一些代码放在了.ascx中。谢谢
<table class="content-box">
<tr>
<td valign="top">
<asp:UpdatePanel runat="server" ID="upAppointments">
<ContentTemplate>
<table>
<tr>
<td>
<asp:Button runat="server" ID="btnIndicationsHidden" Style="display: none;" />
<asp:Panel runat="server" ID="pnlIndications" CssClass="modalPanel" Style="display: none;">
<table class="content-box">
<tr>
<td>
<table style="width: 100%;">
<tr>
<td>
<asp:Panel runat="server" ID="pnlShowCurrentIndication" Style="padding: 13px 8px 8px 8px">
<table style="width: 100%; border: 0;">
<tr>
<td style="width: 30%; vertical-align: top;" rowspan="2">
<asp:RadioButtonList runat="server" ID="gvProfiles" OnDataBound="gvProfiles_DataBound"
DataTextField="Name" DataValueField="Id" Style="white-space: nowrap;" />
</td>
<td style="padding-left: 10px;" class="contentBox">
<table style="width: 100%;">
<tbody id="showTable">
<tr>
<td id="indicacionestd" runat="server">
Indicaciones:
</td>
</tr>
<tr>
<td>
<asp:BulletedList ID="blIndicaciones" DataTextField="Valor" runat="server">
</asp:BulletedList>
</td>
</tr>
<tr>
<td id="contraindicacionestd" runat="server">
Contraindicaciones:
</td>
</tr>
<tr>
<td>
<asp:BulletedList ID="blContraindicaciones" DataTextField="Valor" runat="server">
</asp:BulletedList>
</td>
</tr>
</tbody>
<tbody style="display: none;" id="addRow">
<tr>
<td style="text-align: left; white-space: nowrap;" class="colSepGran">
Nombre:
</td>
</tr>
<tr class="filSepGranRA">
<td class="colSepGran">
<asp:TextBox runat="server" ID="txbName" CssClass="txtNoWidth" Width="150px" ToolTip="Especifique el nombre del perfil"></asp:TextBox>
<act:FilteredTextBoxExtender runat="server" ID="ftbeName" FilterMode="ValidChars"
FilterType="UppercaseLetters, LowercaseLetters, Custom" TargetControlID="txbName"
ValidChars="ñ Ñ ' á é í ó ú Á É Í Ó Ú ü Ü ." />
</td>
</tr>
</tbody>
</table>
</td>
</tr>
<tr>
<td style="text-align: center; vertical-align: middle;">
<table style="width: 100%;">
<tr>
<td>
</td>
<td>
<input type="image" src="../../App_Themes/Theme/Images/AppIcons/add.png/" id="inputAdd"
title="Adicionar perfil">
</td>
<td>
<input type="image" src="../../App_Themes/Theme/Images/AppIcons/add_document.png"
id="inputAddSimple" title="Adicionar indicación" />
</td>
<td>
<input type="image" src="../../App_Themes/Theme/Images/AppIcons/edit.png" id="inputEdit"
title="Editar perfil" />
</td>
<td>
<asp:ImageButton runat="server" ID="imbRemoveProfile" ToolTip="Eliminar perfil" ImageUrl="~/App_Themes/Theme/Images/AppIcons/delete.png" />
</td>
<td>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td colspan="2">
</td>
</tr>
</table>
</asp:Panel>
</td>
</tr>
</table>
</td>
</tr>
</table>
</asp:Panel>
<act:ModalPopupExtender ID="mpeIndications" runat="server" PopupControlID="pnlIndications"
BackgroundCssClass="modalBackground" TargetControlID="btnIndicationsHidden" CancelControlID="imbCloseIndications"
BehaviorID="mpeIndications">
</act:ModalPopupExtender>
</td>
</tr>
</table>
</ContentTemplate>
</asp:UpdatePanel>
</td>
</tr>
</table>
然后尝试这种方法: 为ModalPopup Extender添加一个隐藏链接,以连接到永远不会使用的链接
<a href="#" style="display:none;visibility:hidden;"
onclick="return false" ID="dummyLink" runat="server">dummy</a>
显示模式弹出窗口
$find('MyMPE').show();
不,它也隐藏了,我为您发布的元素更改了名为btnIndicationsHidden的ASP.NET按钮控件,以查看是否存在这种情况,但事实并非如此。在我看来,我提到的按钮的功能与您发布的dummyLink元素相同。无论如何,感谢您的回答。ModalPopupXtender不正是他们所使用的,但我一直在评估将jQueryUI用于modals,也许是时候试一试了。让我看看是否有人能更清楚地了解这里发生了什么,但有一个备份计划很好,谢谢。
$find('MyMPE').show();