如何自定义Bootbox.js提示框选项

13
我正在尝试自定义bootboxjs.prompt选项,但似乎不允许将选项对象作为参数。这是来自http://bootboxjs.com/index.html#api的示例。
bootbox.prompt("What is your name?", function(result) {                
  if (result === null) {                                             
    Example.show("Prompt dismissed");                              
  } else {
    Example.show("Hi <b>"+result+"</b>");                          
  }
});

这就是我想要传递的内容:

var promptOptions = {
  title: "Custom label",
  buttons: {
    confirm: {
      label: "Save"
    }
  }
};

bootbox.prompt(promptOptions, function(result) {                
  if (result === null) {                                             
    console.log("Prompt dismissed");                              
  } else {
    console.log("Hi "+result);                          
  }
});

如何自定义标题和按钮标签?

2个回答

25

你将能够使用自定义对话框创建自定义提示。 你需要知道的唯一一件事是,传递给bootbox的消息字符串不必是纯文本。它可以是HTML,因此您可以将自己的提示放在自定义的bootbox对话框中。

您想要做的是这样的(使用Bootbox 4.x):

bootbox.dialog({
  message: "First name:<input type='text' id='first_name'>",
  title: "Custom label",
  buttons: {
    main: {
      label: "Save",
      className: "btn-primary",
      callback: function() {
        console.log("Hi "+ $('#first_name').val());
      }
    }
  }
});

有没有办法在消息中使用JavaScript? - Suleman khan
这是我的问题,你能帮我解决吗?问题链接:http://stackoverflow.com/questions/35489040/how-to-select-images-from-a-dialog-and-embed-in-the-textarea - Suleman khan
如果没有输入,是否有办法让“确定”或“保存”按钮保持禁用状态? - mumair

21

bootbox.prompt 只接受一个参数,如果您想传递带有自定义标签的对象,那么您需要将回调函数放入您的配置对象中:

var promptOptions = {
  title: "Custom label",
  buttons: {
    confirm: {
      label: "Save"
    }
  },
  callback: function(result) {                
      if (result === null) {                                             
        console.log("Prompt dismissed");                              
      } else {
        console.log("Hi "+result);                          
      }
    }
};

bootbox.prompt(promptOptions);

1
我同意@mseo的观点。这是正确使用提示框的最佳方式。请查看此链接:https://github.com/makeusabrew/bootbox/issues/143(供未来访问者参考) - youssman
1
很遗憾,如果您想添加“message”选项,似乎需要使用.dialog - Ted Avery
@TedAvery 不是的,prompt 支持 message 选项。请查看最新文档:http://bootboxjs.com/documentation.html#bb-dialog-options - congusbongus
消息选项对我也不起作用,但文档说它可以?奇怪。 - Edward

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接