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

Mar*_*nce 12 bootbox

我试图自定义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>");                          
  }
});
Run Code Online (Sandbox Code Playgroud)

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

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);                          
  }
});
Run Code Online (Sandbox Code Playgroud)

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

har*_*ith 21

您将能够使用自定义对话框进行自定义提示.您唯一需要知道的是,您为bootbox提供的消息字符串不必是纯文本.它可以是HTML,因此您可以将自己的提示放在自定义引导框对话框中.

你要做的是这个(使用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());
      }
    }
  }
});
Run Code Online (Sandbox Code Playgroud)


mse*_*seo 20

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);
Run Code Online (Sandbox Code Playgroud)