Bootbox 对话框不会在循环中打开
Bootbox dialog doesn't open within a loop
这是我的objective:
自定义引导框对话框打开以指定一个值。用户指定一个值,单击“保存”,该值通过 Ajax 调用传递到 Web 应用程序。
Web 应用程序验证该值,如果验证通过并且数据库已更新,则发回 "success" 消息,或者发回 "failure" 消息并说明验证原因失败。
如果收到 "success" 消息对话框关闭,否则它会再次打开并在用户输入下方显示验证消息。用户可以更改输入并再次单击“保存”或按“取消”关闭对话框。
MCVE(注意 while(bContinue == true) 被注释掉以表明它在没有循环的情况下工作并且任何地方都没有验证消息但它将成为一部分消息变量(此变量将在 Ajax 调用后在保存回调函数中更新):
$(document).on("click", ".alert", function(e) {
var Message = "<label class='control-label col-sm-1' style='width:30px;' for='assignmentname'>"+"Assignment "+"</label>"
+ "<input type='text' id='assignmentname' class='form-control' style='float: left; max-width:800px;' value='Initial value'>"
var bContinue = true;
//while(bContinue == true)
{
bootbox.dialog({
size: "large",
message: Message,
title: "Edit Assignment",
buttons: {
save:
{
label: "Save",
className: "btn btn-success",
callback: function() {
// perform Ajax call to the web application
// and set bContinue to true or false depending on
// return value
bContinue = true;
}
},
cancel:
{
label: "Cancel",
className: "btn btn-default",
callback: function() {
// exit out of the loop
bContinue = false;
}
}
}
});
}
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.0/jquery.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css" rel="stylesheet"/>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/js/bootstrap.min.js"></script>
<script src="https://github.com/makeusabrew/bootbox/releases/download/v4.4.0/bootbox.min.js"></script>
<p><a class="alert" href=#>Click here</a></p>
问题是 - 一旦 while(bContinue == true) 取消注释,对话框就永远不会打开。
预期的 MCVE 行为:对话框打开,如果单击“保存”,它将关闭并重新打开。如果单击取消 - 对话框关闭。
问题不在 Bootbox 中,问题出在 while 循环中,它在不等待 Bootbox 加载的情况下一直非常快速地循环,它使整个浏览器挂起:)
因此您需要更改您的逻辑,可以将 Bootbox 对话框放入一个函数中,并使其在保存时再次调用该函数。
或者可能正在使用承诺:
这是我的objective:
自定义引导框对话框打开以指定一个值。用户指定一个值,单击“保存”,该值通过 Ajax 调用传递到 Web 应用程序。
Web 应用程序验证该值,如果验证通过并且数据库已更新,则发回 "success" 消息,或者发回 "failure" 消息并说明验证原因失败。
如果收到 "success" 消息对话框关闭,否则它会再次打开并在用户输入下方显示验证消息。用户可以更改输入并再次单击“保存”或按“取消”关闭对话框。
MCVE(注意 while(bContinue == true) 被注释掉以表明它在没有循环的情况下工作并且任何地方都没有验证消息但它将成为一部分消息变量(此变量将在 Ajax 调用后在保存回调函数中更新):
$(document).on("click", ".alert", function(e) {
var Message = "<label class='control-label col-sm-1' style='width:30px;' for='assignmentname'>"+"Assignment "+"</label>"
+ "<input type='text' id='assignmentname' class='form-control' style='float: left; max-width:800px;' value='Initial value'>"
var bContinue = true;
//while(bContinue == true)
{
bootbox.dialog({
size: "large",
message: Message,
title: "Edit Assignment",
buttons: {
save:
{
label: "Save",
className: "btn btn-success",
callback: function() {
// perform Ajax call to the web application
// and set bContinue to true or false depending on
// return value
bContinue = true;
}
},
cancel:
{
label: "Cancel",
className: "btn btn-default",
callback: function() {
// exit out of the loop
bContinue = false;
}
}
}
});
}
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.0/jquery.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css" rel="stylesheet"/>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/js/bootstrap.min.js"></script>
<script src="https://github.com/makeusabrew/bootbox/releases/download/v4.4.0/bootbox.min.js"></script>
<p><a class="alert" href=#>Click here</a></p>
问题是 - 一旦 while(bContinue == true) 取消注释,对话框就永远不会打开。
预期的 MCVE 行为:对话框打开,如果单击“保存”,它将关闭并重新打开。如果单击取消 - 对话框关闭。
问题不在 Bootbox 中,问题出在 while 循环中,它在不等待 Bootbox 加载的情况下一直非常快速地循环,它使整个浏览器挂起:)
因此您需要更改您的逻辑,可以将 Bootbox 对话框放入一个函数中,并使其在保存时再次调用该函数。
或者可能正在使用承诺: