Notice: The Monaca & Onsen UI Community Forum is shutting down.

For Onsen UI bug reports, feature requests and questions, please use the Onsen UI GitHub issues page. For help with Monaca, please contact Monaca Support Team.

Thank you to all our community for your contributions to the forum. We look forward to hearing from you in the new communication channels.

How change checkbox's state programmatically ?

  • Hello,
    I spend all day to find solution ! none… So I deseperatly need help…

    I would like to change visual state of a checkbox with JS without reload the page.

    I have 4 ons-checkbox components in a page. When the user click to select or unselect a checkbox each click launches a function to check if at least 1 checkbox remains checked… if the user uncheck the last item an alert box is lauched and the function re done the state checked on the last item the user access

    All is good : the last item recover his state ‘checked’ but NO VISUAL CHANGE appears ! I have a ons-checkbox in ‘checked’ state but with an empty circle (not ticked blue!)

    So how could I make visulally the checkbox blue ticked ?

    Here is my function :

    if (bdd_used.length==1){
    AlertInfo2(“Choix des bases de données”, “Au moins une base de données doit être sélectionnée !<br>”);
    document.getElementById(‘bdd_’+bdd_cible).value=‘checked’; <---------- the ons-checkbox is set as ‘checked’ value but no visual change on page !

    Thank you very much for community help


  • administrators

    To change whether the checkbox is checked, you need to set the checked property, not value.

    Here’s an example:

    Does this solve your problem?


    Thank you very much emccorson ! All is solved.

    Best regards.