Question

我在我的c＃asp.net项目中使用bootstrap，我想显示从后面的代码中显示模态弹出窗口。

在我的页面标题中我有一个javascript函数如下：

function LoginFail() {
        $('#windowTitleDialog').modal('show');
    }

点击我的按钮，我按如下方式调用javascript

ScriptManager.RegisterClientScriptBlock(this, typeof(System.Web.UI.Page), "LoginFail", "LoginFail();", true);

这不会显示模态弹出窗口。但是，如果我使用像alert('login failed')这样的东西，它可以正常工作。

任何人都可以帮忙吗？

Answer 1

默认情况下，Bootstrap javascript文件包含在关闭正文标记

之前

    <script src="vendors/jquery-1.9.1.min.js"></script>
    <script src="bootstrap/js/bootstrap.min.js"></script>
    <script src="vendors/easypiechart/jquery.easy-pie-chart.js"></script>
    <script src="assets/scripts.js"></script>
 </body>

我把这些javascript文件放到body标签前的head部分，我写了一个小函数来调用模态弹出窗口：

<script src="vendors/jquery-1.9.1.min.js"></script>
<script src="bootstrap/js/bootstrap.min.js"></script>
<script src="vendors/easypiechart/jquery.easy-pie-chart.js"></script>
<script src="assets/scripts.js"></script>

<script type="text/javascript">
function openModal() {
    $('#myModal').modal('show');
}
</script>
</head>
<body>

然后我可以使用以下代码从代码隐藏调用模式弹出窗口：

protected void lbEdit_Click(object sender, EventArgs e) {   
  ScriptManager.RegisterStartupScript(this,this.GetType(),"Pop", "openModal();", true);
}

Answer 2

这就是我解决的问题：

脚本功能

<script type="text/javascript">
    function LoginFail() {
        $('#windowTitleDialog').modal();
    }        
</script>

按钮声明

<asp:Button ID="LaunchModal" runat="server" Text="Launch Modal" CssClass="btn" onclick="LaunchModal_Click"/>

请注意，未设置属性data-togle =“modal”。

LaunchModal_Click事件中的服务器端代码是：

ScriptManager.RegisterStartupScript(this, this.GetType(), "LaunchServerSide", "$(function() { LoginFail(); });", true);

我希望这对你有所帮助。

Answer 3

我假设您正在使用jQuery模式插件之一。在这种情况下，我怀疑，插件代码在被调用时没有被初始化（这将在它被渲染到页面之后立即）。执行插件代码后，您必须推迟调用该函数。您案例的实施可能如下所示：

ScriptManager.RegisterClientScriptBlock(this, typeof(System.Web.UI.Page), "LoginFail", "$(function() { LoginFail(); });", true);

Answer 4

我有同样的问题，试图找到在线解决方案，但我无法这样做。我可以通过后面的代码调用其他javascript函数，但是当我添加模态js函数时，模态不显示。

我的猜测是模态。（'show'）函数没有被调用，因为当我在crhome中插入模态元素时，类是模态隐藏淡入淡出而不是模态隐藏淡入淡出IN和其他属性保持不变。

一个可能的解决方案是从后面的代码中更改这些属性，我的意思是你可以从后面的代码中执行js所做的事情，可能不是最好的解决方案，但我没有做其他事情。通过这样做，我得到的模式显示背景灰色但无法使效果工作。

Answer 5

我在aspx页面中这样做：

<asp:Panel ID="MessagePanel" runat="server" CssClass="hide"  EnableViewState="false">
<div class="modal-header">
<asp:Button type="button" ID="btnClose" runat="server" data-dismiss="modal" Text="x" />
</div>
<div class="modal-body">
<h4>What's new in this version</h4>
... rest of bootstrap modal stuff....
</div>
</asp:Panel>

然后在代码隐藏中显示任何事件（如page.load或按钮单击）上的模式弹出窗口我只需更改Panel的CssClass：

MessagePanel.CssClass = "modal fade in"

不需要js或ScriptManager。

bootstrap模式弹出c＃代码背后

5 个答案: