Bootstrap buttons - className value is not overriding base value "btn btn-default"
Bootstrap buttons - className value is not overriding base value "btn btn-default"
Hello,
I'm using editor datatables with bootstrap.
I would like to define 2 buttons for my editor modals (a "cancel" button and a "submit" button, styled with 2 different classes).
In my editor initialization options i have
[...]
formOptions: {
main: {
buttons: [
{
text: 'Chiudi',
action: function () {
this.close();
}
},
{
text: 'Conferma',
className: 'btn btn-primary',
action: function () {
this.submit();
}
}
]
},
inline: {
onBlur: 'submit',
submit: 'allIfChanged'
}
}
[...]
All is working file, but in the rendered buttons I see something like this:
<div data-dte-e="form_buttons" class="DTE_Form_Buttons">
<button class="btn btn-default" tabindex="0">Chiudi</button>
<button class="btn btn-default btn btn-primary" tabindex="0">Conferma</button>
</div>
The "submit" (Conferma) button still have the btn-default class, and doesn't styles correctly.
Can anyone help me with this?
Thanks
Edited by Colin - Syntax highlighting. Details on how to highlight code using markdown can be found in this guide.
This question has an accepted answers - jump to answer
Answers
Yes, the way the
classNameproperty works is to combine the value of that property with that from$.fn.dataTable.Editor.classes.form.button- the reason for this is so that we can provide a base (e.g.btn) for the styling and then customise it usingclassName. We've got a bit of a mix up in our defaults there which I'll look at, but for the moment use:and then will ensure that
btn-defaultis not added by default.Allan
This solved my problem!
Thanks Allan