Ser*_*gio 31 modal-dialog twitter-bootstrap
任何人都知道如何从代码后面打开一个Twitter bootstrap模式？
我想在保存时基于一些requeriment打开模态.像"嘿没有股票,拿起以下选项之一继续(丢弃,保留...)并按下该按钮(可能会继续回发)"
我正在使用ASP.NET Web表单.
wal*_*740 44
默认情况下,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);
}
Ser*_*gio 22
最后我发现了阻止我从代码隐藏中显示模态的问题.人们必须认为这就像注册开放的客户端一样容易,例如:
ScriptManager.RegisterClientScriptBlock(this, this.GetType(),"none",
"<script>$('#mymodal').modal('show');</script>", false);
但这从来没有对我有用.
问题是,当模式在asp:Updatepanel,period期间时,Twitter Bootstrap Modals脚本根本不起作用.模态的行为从每一方都失败,代码隐藏到客户端和客户端到代码隐藏(回发).它甚至可以防止在执行模式的任何js时回发,就像关闭按钮一样,你还需要处理一些服务器对象(对于一个肮脏的例子)
我已经通知了bootstrap工作人员,但他们回复了一个方便的"请给我们一个只有简单的html而不是asp的失败场景." 在我的城镇,这被称为......好吧,Bootstrap不支持任何更简单的HTML.没关系,在asp上使用它.
我认为他们至少看看他们在背景管理方面做了哪些不同的事情,我发现导致问题的主要部分,但......(只是提示那里)
所以有问题的人,请放下updatepanel试一试.
也许这个答案太晚了,但它很有用.
要做到这一点,我们有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">×</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";
}
这个解决方案是我使用它的任何解决方案之一.
| 归档时间： |
|
| 查看次数： |
97636 次 |
| 最近记录： |