Search code examples
javascriptonsen-uimonaca

Pure JS - Disable button in Onsen 2.0 / Monaca

Using Onsen 2.0 with Monaca, I am having an issue setting the disable property to true via JavaScript and not Angular. I am aware of how to do this with AngularJS and binding to a variable, but I just need to set the property via straight JS as this project is not using AngularJS at all. I fear this may not be possible.

Here is the code which does not work:

<ons-button id="btn">Stop</ons-button>
<ons-button onclick="document.getElementById('myBtn').disabled = true;">Go</ons-button>

Edit: Huge thank you to Fran again for solving my issue. For others, since this is simply setting the CSS, to disable the button:

document.getElementById("myButton").setAttribute('disabled', '');

and to re-enable it after using setAttribute:

document.getElementById("myButton").removeAttribute('disabled', '');
Solution

  • disabled is not an internal variable, it's just an attribute used to apply some CSS. Try with document.getElementById('myBtn').setAttribute('disabled', '').