"alerts" 在 Bootstrap4 阻塞?如果没有,有没有办法这样做?
Are "alerts" in Bootstrap4 blocking? If not , is there a way to do so?
如果用户在 table 中检查了不止一行,我会尝试 "alert" 用户。如果长度不等于 1,我会显示一个可以解除的警报。在用户解除警报之前,我不想继续使用另一个模板。但是,它似乎是非阻塞的。
我查找了警报行为的描述,但没有看到阻塞与非阻塞的描述。
<div class="alert alert-warning alert-dismissible collapse" id="selectonlyone"
roll="alert">
<button type="button" class="close" data-dismiss="alert">×</button>
<strong>Warning!</strong> Select only one row to edit!
</div>
document.getElementById("btn3").onclick = function() {
var rowids = mytable.rows('.selected').data();
var pkids = [];
var arrayLength = rowids.length;
if(arrayLength==1){
...some code
}
else {
$('#selectonlyone').show();
document.location.href = "{% url 'show_template' %}" ;
}
};
不,他们不阻止。在 Tim 的建议下,我改用了模态。模态也不会阻塞。也就是说,"else" 子句的执行将继续,但模式将出现并且用户将无法继续,直到他们关闭模式。当他们关闭它时,用户仍停留在原始页面。无论如何,模式可能更容易被用户注意到。再次感谢蒂姆。
<div class="modal fade" tabindex="-1" id="myModal" role="dialog" data-backdrop="static" data-keyboard="false" aria-labelledby="exampleModalLabel" data-toggle="modal" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title">Warning!</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<p>Select only one row to edit!</p>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
document.getElementById("btn3").onclick = function() {
var rowids = mytable.rows('.selected').data();
var pkids = [];
var arrayLength = rowids.length;
if(arrayLength==1){
some code...
}
else {
$('#myModal').modal("show")
}
};
如果用户在 table 中检查了不止一行,我会尝试 "alert" 用户。如果长度不等于 1,我会显示一个可以解除的警报。在用户解除警报之前,我不想继续使用另一个模板。但是,它似乎是非阻塞的。
我查找了警报行为的描述,但没有看到阻塞与非阻塞的描述。
<div class="alert alert-warning alert-dismissible collapse" id="selectonlyone"
roll="alert">
<button type="button" class="close" data-dismiss="alert">×</button>
<strong>Warning!</strong> Select only one row to edit!
</div>
document.getElementById("btn3").onclick = function() {
var rowids = mytable.rows('.selected').data();
var pkids = [];
var arrayLength = rowids.length;
if(arrayLength==1){
...some code
}
else {
$('#selectonlyone').show();
document.location.href = "{% url 'show_template' %}" ;
}
};
不,他们不阻止。在 Tim 的建议下,我改用了模态。模态也不会阻塞。也就是说,"else" 子句的执行将继续,但模式将出现并且用户将无法继续,直到他们关闭模式。当他们关闭它时,用户仍停留在原始页面。无论如何,模式可能更容易被用户注意到。再次感谢蒂姆。
<div class="modal fade" tabindex="-1" id="myModal" role="dialog" data-backdrop="static" data-keyboard="false" aria-labelledby="exampleModalLabel" data-toggle="modal" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title">Warning!</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<p>Select only one row to edit!</p>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
document.getElementById("btn3").onclick = function() {
var rowids = mytable.rows('.selected').data();
var pkids = [];
var arrayLength = rowids.length;
if(arrayLength==1){
some code...
}
else {
$('#myModal').modal("show")
}
};