我正在使用bootbox制作带有表单的弹出窗口,如果表单字段有问题,我必须验证它们并向用户抛出错误.但在用户点击Send"按钮"后,我无法阻止启动箱窗口关闭.我需要向用户显示错误通知,因此可以纠正错误并再次发送表单.
return false 工作正常,但在它之后我找不到方法,恢复通常的bootbox方法关闭窗口.
有人遇到同样的问题,你是如何摆脱这种情况的？
如上所述,fsFiddle:
<button id="test">Bootbox</button>
码:
$(document).ready(function() {
$("#test").on('click', function() {
bootbox.dialog({
title: "This is a form in a modal.",
message: '<div class="row"> ' +
'<div class="col-md-12"> ' +
'<form class="form-horizontal"> ' +
'<div class="form-group"> ' +
'<label class="col-md-4 control-label" for="name">Name</label> ' +
'<div class="col-md-4"> ' +
'<input id="name" name="name" type="text" placeholder="Your name" class="form-control input-md"> ' +
'<span class="help-block">Here goes your name</span> </div> ' +
'</div> ' +
'<div class="form-group"> ' +
'<label …我正在使用一个名为的jQuery库 bootbox
bootbox.dialog({
title: "Group",
buttons: {
success: {
label: "OK",
className: "btn-success",
callback: function () {
postForm();
}
}
}
});
function postForm() {
$.ajax({
type: "POST",
url: $("#add-group").val(),
data: $("#form").serialize(),
success: function (data) {
return true;
},
error: function (XMLHttpRequest, textStatus, errorThrown) {
return false;
}
});
}
当我点击"确定"按钮时,除非我返回如下的假值:
callback: function () {
return false;
}
对话框将关闭.
在回调函数中,我正在调用postForm哪个函数对我的服务器端进行AJAX调用以执行某些操作.根据该操作的结果,我想保持对话框仍然打开.
但是因为它是一个AJAX调用,并且结果需要一段时间才能返回,所以postForm()无论我的结果如何,对话框都会立即关闭.
如何告诉javascript等待ajax调用的结果？
如果我能做到这样的话会很棒:
callback: function () {
var result = await postForm();
return result;
}
以下代码段允许我在单击的按钮的回调函数中执行操作.但是,如何获得回调函数或类似的解决方法,以便在用户单击"X"按钮/解除对话框时执行某些代码？
bootbox.dialog({
title: "Woah this acts like an alert",
message: "Cool info for you. You MUST click Ok.",
buttons: {
sucess:{
label: "Ok",
callback: callback
}
}
});
callback(){//stuff that happens when they click Ok.}
我不想禁用/隐藏关闭按钮
closeButton: false,
我正在一个动态的在线表单网站上工作.在主窗体中,我有多个子窗体,可以动态添加和删除.
<div class='subform'>
//form fields
<input ...>
...
<button class='subform_submit'>
</div>
对于每个子表单,我在子表单的提交按钮上绑定一个AJAX调用,如下所示:
$('#main').on('click', '.subform_submit', function(){
// Get this subform's user input
...
$.ajax({
url: ..,
type: ..,
data: /* this subform's data */
});
});
因此,在该页面中,根据用户的选择,我可能有0到10个子表单.我还在页面底部有一个主提交按钮,可以将这些子表单和主表单的数据一起提交.
$('#main').on('click', '#submit', function(e){
$('.subform_submit').click(); // Submit each subform
bootbox.confirm({ });
})
单击主提交按钮后,我想显示加载图片,然后显示一个对话框(我bootbox.confirm()在这里使用),直到所有AJAX调用完成.此对话框告诉用户已提交包含子表单的整个表单.但问题是每个AJAX调用可能需要2秒钟才能完成,我不知道调用可能有待完成.如何编写此主提交按钮,以便:
我想用这个:
$('#delete').live('click',function(){
var result;
bootbox.confirm("Are you sure?", function(response){
result=response;
});
alert(result);
return result;
});
但是当点击按钮时:
警报首先显示,并且仅在该引导框显示确认对话框后显示.
我想返回响应,但是如果我在回调中执行它不起作用,因为它返回来自回调的响应而不是$('#devicedelete').live('click',function(){});
顺便说一下,我正在尝试根据回复提交表格.因此,如果我返回'true'表单将被提交,否则如果它返回'false',表单将不会被提交.
请查看:http://pastebin.com/9H3mxE9Y
我有一个大表,每行有复选框,用户选择复选框,然后点击任何按钮'删除','复制'等,应提交表格.
谢谢
如何将数据从ajax设置为bootbox对话框？或者我需要使用jquery ui对话框,何时需要设置一些数据？
这段代码不起作用
bootbox.dialog({
message: data,
title: "Custom title",
buttons: {
success: {
label: "Success!",
className: "btn-success",
},
}
});
我在IE(IE 8/IE 9)上使用Bootbox 4和Bootstrap 3,一切都按预期工作.
它看起来像在Bootstrap 3中你可以在CSS中设置模态宽度,但是,这样的任何东西都会改变我的所有模态:
.modal-dialog {
width:70% !important;
}
在CSS,jQuery或Bootbox设置中是否有一种方法可以仅针对一个特定模式更改Bootbox警报模式的宽度？Bootbox页面只有很短的文档,我无法在其他任何地方找到相关信息.
更新 - 创建特定模式的JS(带有示例数据):
bootbox.dialog({
message: " \
<table class='table table-hover'> \
<thead> \
<tr> \
<th>Item Name</th> \
<th>Location</th> \
<th>Path</th> \
<th>Last Update</th> \
</tr> \
</thead> \
<tbody> \
<tr> \
<td>Item 1</td> \
<td>Navbar - Level 2</td> \
<td>Products - blabla</td> \
<td>Added by xxx on 05 Aug 2014</td> \
</tr> \
</tbody> \
</table>",
title: …在我的第一个活动中,我将打开一个mbox对话框.mbox是bootbox的一种扩展,用于显示模态.我需要mbox使用另一个模板作为模态内容.
因此在模态中将加载createElement-Template的内容.如果用户已完成某些输入更改,则应关闭模态.因此有功能modal("hide").但是正如bbox在第一个模板事件中设置的那样,模态的关闭将在第二个模板事件中完成,我在关闭模态时遇到了问题.
事件
Template.main.events({
'submit form': function(event, template) {
event.preventDefault();
var bbox = mbox.dialog({
title: 'title',
message: Template.createElement
});
}
});
Template.createElement.events({
'change input': function(event, template) {
bbox.modal('hide');
}
});
UPDATE
上述问题适用于全局变量.感谢Adam为此.
但不是我想破坏流星包中的模态,这是由另一个包创建的.我试图使用全局变量,我试图使用api.export().但它仍然无效.我也尝试过Sessions.
包图表/ LIB /客户端/ graph.js
var bbox;
CanvasManager = {
onShowAddToolTip (element) {
bbox = mbox.dialog({ // <-- Create Modal
title: "Title",
message: Template.search, // <-- Loading Template search with just one input field with typeahead
});
},
}
CanvasManger.create(...); …在bootbox.js中,默认情况下Ok按钮显示在Cancel按钮之后.我希望它先成为然后取消.这是当前情况的情况,
http://paynedigital.com/img/confirm-simple.png
我先需要Ok按钮.我有场景的文档,但没有找到办法.
按下删除用户链接时,以下代码会弹出确认窗口:
<a href="delete_user.php?id=123" onclick="return confirm('Are you sure?');">Delete user</a>
在这种情况下,当按下OK按钮时,将执行链接delete_user.php？id = 123.按下取消按钮时,不会发生任何事情.
我想用Bootbox做同样的事情.
<a class="alert" href="list_users.php?id=123">Delete user</a>
<script src="bootbox.min.js"></script>
<script>
$(document).on("click", ".alert", function(e) {
e.preventDefault();
bootbox.confirm("Are you sure?", function(result) {
if (result) {
// What to do here?
} else {
// What to do here?
}
});
});
</script>
在if(result)和else语句下做什么？