javascript - 模态弹出窗口、更新面板和客户端更新

标签 javascript asp.net updatepanel c#-2.0 modalpopupextender

我试图在更新弹出控件的值后显示模式弹出窗口,所有这些都在客户端。

单击网格行中的链接按钮。使用该行中的一些数据,我调用 JavaScript 函数来填充模式弹出窗口的控件并显示它。模态弹出窗口弹出得很好,但控件都是空白的。 (删除 UpdateMode="Consitional"无效)。 我删除了所有格式行以保持代码简短。

<asp:UpdatePanel runat="server" ID="upnlNewIDS" RenderMode="Inline" UpdateMode="Conditional">
    <ContentTemplate>
        <asp:Panel runat="server" ID="divReassign" Width="350" Style="border:solid 2px navy;display:none;background: url(../assets/images/bg3.gif);"> 
            <asp:Label runat="server" ID="lblFacilityCount" />
            <asp:Label runat="server" ID="lblCurrIDSName_BK" />
            <asp:Label runat="server" ID="lblCurrSiteName" />
            <asp:Button runat="server" ID="btnSOK" Text="OK" Width="75" />
            <asp:Button runat="server" ID="btnCancel" Text="Cancel" Width="75" />
        </asp:Panel>
        <ajaxToolkit:ModalPopupExtender runat="server" 
            ID="mpeNewIDS" 
            TargetControlID="btnFake" 
            BackgroundCssClass="backgrondModal" 
            DropShadow="true" 
            BehaviorID="mpeNewIDS"
            PopupControlID="divReassign" 
            CancelControlID="btnCancel"  />
        <asp:Button runat="server" ID="btnFake" Style="display:none" />   
    </ContentTemplate>
</asp:UpdatePanel>

这是显示链接的行模板:

<a id='a_<%# Eval("IDSID") %>' href="javascript:void(0);" 
    onclick="PopulateView('<%# Eval("idsid") %>', '<%# Eval("cnt" %>', '<%# Eval("idsname") %>', '<%# Eval("sitename") %>')">Reassign</a>

Javascript: 我跟踪了代码,该函数具有所有正确的参数值。

function PopulateView(idsid, cnt, idsname, sitename) {
    lblCurrIDSName_BK = document.getElementById('<%=lblCurrIDSName_BK.ClientID %>');
    lblFacilityCount = document.getElementById('<%=lblFacilityCount.ClientID %>');
    lblCurrSiteName = document.getElementById('<%=lblCurrSiteName.ClientID %>');

    lblCurrIDSName_BK.value = idsname;
    lblCurrSiteName.value = sitename;
    lblFacilityCount.value = cnt;
    ShowNewIDSModalPopup();
}
function ShowNewIDSModalPopup() {
    $find("mpeNewIDS").show();
    return false;
}

function HideNewIDSModalPopup() {
    $find("mpeNewIDS").hide();
    return false;
}    

当单击网格行中的链接时,我调用“PopulateView('a', 'b', 'c', 'd')”,其中 a、b、c 和 d 来自该行的选择列.

最佳答案

在您的 .aspx 页面中使用它。当您的链接按钮单击事件时,它将打开弹出窗口。 配置链接按钮,如

<asp:TemplateField HeaderText="Verified Count">
  <ItemTemplate>
       <asp:LinkButton ID="verifycount" runat="server" OnClick="verifycount_Click"> <%# Eval("VerifiedCount")%> </asp:LinkButton>
  </ItemTemplate>
</asp:TemplateField>

这是您的弹出窗口。

<asp:Button ID="btn" runat="server" style="display:none" />
 <cc1:ModalPopupExtender ID="popup_verifyInventory" runat="server"                   PopupControlID="verifyInventory_popup" TargetControlID="btn">
</cc1:ModalPopupExtender>

<asp:panel runat="server"  ID="verifyInventory_popup" BorderStyle="solid"            BorderWidth="1px">
   <table width="100%" cellpadding="1" cellspacing="1" align="center">
       <tr>
          <td colspan="3"><strong> Verify Asset Details </strong></td>
            <td><asp:ImageButton id="close" TabIndex="1" runat="server" ImageAlign="Right" ImageUrl="~/Images/remove.gif" Height="30" Width="30" ToolTip="Close"  OnClientClick="HidePopUp_verifyInventory()"/></td>
       </tr>
       <tr>
          <td colspan="4">
             <asp:GridView ID="grdgrid" runat="server" 
                                    AutoGenerateColumns="true" Width="290px" >
             </asp:GridView>
          </td>
       </tr>
    </table>
</asp:panel>

并在.aspx.cs页面中编写链接按钮单击事件,例如

 protected void verifycount_Click(object sender, EventArgs e)
    {
      //your code place here
      //it will show your popup  
      popup_verifyInventory.Show();
    }

像这样编写Javascript

<script type="text/javascript">
        var ShowVerifyInventory = '<%=Your popup control ID %>';
         function ShowPopUp_verifyInventory() {
             $find(ShowVerifyInventory).show();
         }

         var HideVerifyInventory = '<%=Your popup control ID %>';
         function HidePopUp_verifyInventory() {
             $find(HideVerifyInventory).hide();
         }
</script>

弹出窗口将绑定(bind)gridview中的值。

关于javascript - 模态弹出窗口、更新面板和客户端更新,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20132021/

相关文章:

JavaScript 空指针异常 : Why is contentWindow and contentDocument of my dynamically created iFrame always null?

c# - 调试:Microsoft JScript 运行时错误

javascript - "Uncaught SyntaxError: Unexpected token"解析jsonp时

jquery - __dopostback 未按预期工作

jquery - ASP.NET从gridview中的多个控件更新触发器

javascript - 在示例中将 promise 与 Node.js 函数结合使用

javascript - 打开加载外部 HTML 的模态对话框后 CSS 覆盖

javascript - Promise 不会解析为 true 或 false

c# - 无法加载 asmx 文件?

c# - 为什么 javascript 警报未显示在 UpdatePanel 内