I am using Bootbox jquery plugin to show modals.
this is a simple usage of that to show alert dialogs :
bootbox.alert({
title: 'Message Title',
message: "this is message Body"
});
This plugin has a className
option to add custom Classes to apply to the dialog wrapper created by dialog()
method but we can not use it for alert()
method.
a way to add custom classes to alert()
is use dialog()
to create those. but in this case we must create buttons like OK (or Cancel inprompt()
method) manually every time that we want an simple Alert that is Is time consuming, like this:
bootbox.dialog({
message: "I am a custom dialog",
title: "Custom title",
buttons: {
success: {
label: "Success!",
className: "btn-success",
callback: function() {
Example.show("great success");
}
}
});
is there any way to add custom classes to alert boxes via alert()
method?
I am using Bootbox jquery plugin to show modals.
this is a simple usage of that to show alert dialogs :
bootbox.alert({
title: 'Message Title',
message: "this is message Body"
});
This plugin has a className
option to add custom Classes to apply to the dialog wrapper created by dialog()
method but we can not use it for alert()
method.
a way to add custom classes to alert()
is use dialog()
to create those. but in this case we must create buttons like OK (or Cancel inprompt()
method) manually every time that we want an simple Alert that is Is time consuming, like this:
bootbox.dialog({
message: "I am a custom dialog",
title: "Custom title",
buttons: {
success: {
label: "Success!",
className: "btn-success",
callback: function() {
Example.show("great success");
}
}
});
is there any way to add custom classes to alert boxes via alert()
method?
-
2
mate i tried
className
in alert box initialization and it worked fine, here – Siddharth Commented Jan 14, 2016 at 10:25
1 Answer
Reset to default 14Good news! You can set className
also with alert (check the snippet).
$(window).ready(function(){
bootbox.alert({
title: 'Message Title',
message: "this is message Body",
className: "my-popup"
});
});
$(window).ready(function(){
bootbox.alert({
title: 'Message Title',
message: "this is message Body",
className: "my-popup"
});
});
.my-popup .modal-content {
background: #FAEBD7;
}
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn./bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">
<script src="https://ajax.googleapis./ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn./bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"></script>
<script src="https://github./makeusabrew/bootbox/releases/download/v4.4.0/bootbox.min.js"></script>