【问题标题】:Bootstrap Modal Not Correctly Loading Dynamic Content引导模式未正确加载动态内容
【发布时间】:2014-08-08 11:52:58
【问题描述】:

我正在开发一个最终用于联系人目录的测试模式。单击按钮时,一个变量(电子邮件地址)将被传递给 AccountsDB 对象中的子 GetSpecificAccount。在测试模式中,我硬编码了要传递的电子邮件地址以使其更容易;但是,当我单击按钮时,内容不会加载。

    <center><asp:Button ID="btnTestButton" CssClass="btn btn-primary" runat="server" OnClick="UpdateModal" OnClientClick="ShowModal(); return false" Text="Test Modal" /></center>
</div>

<div id="myModal" class="modal fade">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
        <h3><asp:Label runat="server" ID="lblName" Text="Name Placeholder" /></h3>
      </div>
      <div class="modal-body">
        <p><b>Name:  </b>&nbsp<asp:Label runat="server" ID="lblName2" Text="Name Placeholder" /></p>
        <p><b>Email: </b>&nbsp<asp:Label runat="server" ID="lblEmail" Text="Email Placeholder" /></p>
        <p><b>Info:  </b>&nbsp<asp:Label runat="server" ID="lblInfo" Text="Info Placeholder" /></p>
      </div>
      <div class="modal-footer">
        <asp:HyperLink runat="server" cssclass="btn btn-primary" URL="">Contact</asp:HyperLink>
      </div>
    </div><!-- /.modal-content -->
  </div><!-- /.modal-dialog -->
</div><!-- /.modal -->

<script>
    function ShowModal() {
        $(document).ready(function () {
            $('#myModal').modal('show');
        });
    }
</script>

Protected Sub UpdateModal()
    AccountsDB.GetSpecificAccount("test@test.com")
    lblName.Text = AccountsDB.AccountsDataset.Tables("Accounts").Rows(0).Item("FirstName").ToString
    lblEmail.Text = AccountsDB.AccountsDataset.Tables("Accounts").Rows(0).Item("email").ToString
    lblName2.Text = AccountsDB.AccountsDataset.Tables("Accounts").Rows(0).Item("FirstName").ToString & " " & AccountsDB.AccountsDataset.Tables("Accounts").Rows(0).Item("LastName").ToString
    lblInfo.Text = "Test info hardcode"
End Sub

【问题讨论】:

  • 您正在执行完整的 PostBack。如果您想部分刷新您的页面(在按钮上单击仅更新模态 div),那么您需要实现某种 ajax:例如 UpdatePanel

标签: javascript asp.net vb.net twitter-bootstrap


【解决方案1】:

当你点击按钮时,数据不会发送到服务器上(因为'return false;')。

【讨论】:

  • 当我取出“return false”时,模态会正确加载数据,但会在几秒钟内自动关闭
  • 因为javaScript函数完成后,你的页面被重新加载。您需要将您的 div 包含在 updatePanel 中,取出 OnClientClick 按钮。在 Sub UpdateModal() 中的服务器端调用 js 函数,如下所示:ScriptManager.RegisterStartupScript(Me, GetType(String), "ShowPanel", "ShowModal();", True)
  • 如何实现一个updatepanel,我以前没用过
  • ..
  • 我怀疑我的 ScriptManager.RegisterStartupScript 行有一些问题。我在 Visual Studio 中收到语法错误,指出 System.Web.UI.IScriptManager 在此上下文中不可访问,因为它是“朋友”。我还在 aspx 文件中插入了一个 控件
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多