打开引导模态,从代码隐藏(Open Bootstrap Modal from code-behind

2019-07-21 15:21发布

任何人都知道如何打开一个Twitter的引导模式,从后面的代码?

我想基于在保存的那一刻有些requeriment打开模式。 像“嘿,有没有股票,拿起下列选项之一继续(丢弃,储备...),然后按下该按钮(可以做继续回发)”

我使用ASP.NET Web表单。

Answer 1:

默认情况下引导的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文件上传到头部的体tag之前,我写了一个小函数调用模式弹出:

    <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:

最后,我发现了阻止我显示了从代码隐藏的模式的问题。 人们必须认为作为注册clientscript即形成的开口,就像是一样容易:

ScriptManager.RegisterClientScriptBlock(this, this.GetType(),"none",
    "<script>$('#mymodal').modal('show');</script>", false);

但是,这从来没有为我工作。

问题是, 当模式是一个ASP内部Twitter的引导情态动词的脚本不会在所有的工作:UpdatePanel中 ,期。 该模态的行为从每一侧失败,代码隐藏到客户端和客户端代码隐藏(回发)。 它甚至可以防止回发时的模态的任何JS已经执行,就像一个关闭按钮,你也需要做一些服务器物体配置(对于一个肮脏的例子)

我已经通知了引导人员,但他们回答一个方便的“请给我们的只有普通的HTML,而不是ASP故障的情况。” 在我的家乡,这就是所谓的......嗯,引导不支持任何更多的纯HTML。 没关系,用它在ASP。

我想他们至少可以寻找他们的背景下,管理层在做什么不同,我发现原因的问题的主要部分,但是......(胡斯塔暗示有)

因此,有问题的人,跌落在UpdatePanel一试。



Answer 3:

也许这个答案是这么晚了,但它是有用的。
要做到这一点,我们有3个步骤:
1-创建HTML中的模态结构。
2 -创建一个按钮来调用Java脚本的功能,打开模式,并设置display:none在CSS。
3-呼叫该按钮通过功能在后面的代码。
你可以看到在下面摘录下列步骤操作:

HTML模式:

<div class="modal fade" id="myModal">
                <div class="modal-dialog">
                    <div class="modal-content">
                        <div class="modal-header">
                            <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                <span aria-hidden="true">&times;</span></button>
                            <h4 class="modal-title">
                                Registration done Successfully</h4>
                        </div>
                        <div class="modal-body">
                            <asp:Label ID="lblMessage" runat="server" />
                        </div>
                        <div class="modal-footer">
                            <button type="button" class="btn btn-default" data-dismiss="modal">
                                Close</button>
                            <button type="button" class="btn btn-primary">
                                Save changes</button>
                        </div>
                    </div>
                    <!-- /.modal-content -->
                </div>
                <!-- /.modal-dialog -->
            </div>
            <!-- /.modal -->  

隐藏按钮:

<button type="button" style="display: none;" id="btnShowPopup" class="btn btn-primary btn-lg"
                data-toggle="modal" data-target="#myModal">
                Launch demo modal
            </button>    

脚本代码:

<script type="text/javascript">
        function ShowPopup() {
            $("#btnShowPopup").click();
        }
    </script>  

后面的代码:

protected void Page_Load(object sender, EventArgs e)
{
    ClientScript.RegisterStartupScript(this.GetType(), "alert", "ShowPopup();", true);
    this.lblMessage.Text = "Your Registration is done successfully. Our team will contact you shotly";
}  

该解决方案,我用任何解决方案之一。



Answer 4:

如何做这样的:

1)与形式显示弹出

2)使用AJAX提交表单

3)在AJAX服务器端代码,呈现响应该将:

  • 显示出与形式弹出与验证,或只是一个消息
  • 关闭弹出(也许您重定向到新的页面)


Answer 5:

仅供参考,

我已经看到了jQuery的小部件这种奇怪的行为之前。 关键的部分是把UpdatePanel的模态中。 这使得在UpdatePanel的DOM为“留”的模式(但它与引导工作)。



Answer 6:

打开模态不会为我展示了模态的这种方法。 我发现这是一个角落找寻工作。

我删除了:

 ScriptManager.RegisterStartupScript(this,this.GetType(),"Pop", "openModal();", true);

比我补充一个asp:标签名为lblJavaScript并在后面的呼叫代码:

lblJavaScript.Text = "<script language=\"JavaScript\">openModal()</script>";

现在,模态显示。



文章来源: Open Bootstrap Modal from code-behind