Input type="checkbox" with buttons.buttons.text not working
Input type="checkbox" with buttons.buttons.text not working
___
Posts: 2Questions: 1Answers: 0
Link to test case: http://live.datatables.net/kucakixo/11/edit
Debugger code (debug.datatables.net): https://debug.datatables.net/ohilox
Error messages shown: None
Description of problem: I am trying to create a custom button with a checkbox. However, clicking the checkbox in a custom button doesn't seem to change the checked state of the checkbox. Even after using jquery to handle click events, it seems like the click event for the checkbox is being eaten somewhere. In the test case, you can see that clicking anywhere on the button will activate the checkbox, but clicking the actual checkbox itself will not do anything. You may try removing the custom click handler or try writing your own, but I have not found a way to change the state of the checkbox by DIRECTLY clicking on the checkbox. A workaround would be to write a custom element and inserting it using the dom option, however, I would like to try to use the buttons extension for easier extensibility.
Thank you!
This question has an accepted answers - jump to answer
Answers
Interesting issue. I would start by using the
buttons.buttons.actionfunction instead of the click event you used. See this example:http://live.datatables.net/kucakixo/14/edit
In the
buttons.buttons.actionfunction I found that the button text needed to be updated. I update the text and addcheckedif the checkbox is checked. My guess is buttons will update the button status when the function is complete and part of the is the button text. Maybe @allan or @colin can tell us more about this.I also copied the HTML that buttons built for your button and placed it separately in the page. The checkbox updates appropriately without doing anything.
Use the
buttons.buttons.actionfunction to execute any code needed to replace the checkbox click event.Kevin
Hi Kevin - thanks for the working and helpful response!
However, the solution does has some consequences, like when using a dropdown button with
extend: 'collection'. See this example:http://live.datatables.net/kucakixo/19/edit
Even with autoClose set to false, clicking the checkbox seems to close the dropdown. Any workaround for this?
EDIT: Actually, adding
e.stopPropagationseemed to fix it!http://live.datatables.net/kucakixo/20/edit