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.
Button disabled not functioning as expected
-
Ok, I think I am losing my marbles on this one (Onsen 2.0):
<ons-button id="myButton" onclick="document.getElementById('myButton').disabled=true;">Click Me</ons-button>
http://codepen.io/anon/pen/WwQJOR
So this doesn’t work. The documented methods
setDisabled
, are only for Angular1. As many of you know, I only work in vanilla JS, so is there a way to set an Onsen button disabled? When I log the same value, it shows true, but I think it is reading it as a variable in a structure and not the actual method which is bound to functionality. Does this make sense or am I missing something super basic here?
-
@munsterlander What’s more Vanilla than
myElement.setAttribute('disabled', '')
? :)The old
setDisabled
was just settingdisabled
attribute as well. Docs here.This is the actual
disabled
“code”:.button[disabled] opacity 0.3 cursor default pointer-events none
-
@Fran-Diox I guess we can add a
disabled
setter to the elements that can be disabled. :)
-
@Fran-Diox Arggggg. I think this is twice you have pointed out
setAttribute
to me! I always forget this method for some reason. Such a waste of everyone’s time!! My fault. :scream: :grinning:Horrible, horrible edit (insert my walk of shame here): So, yeah, @Fran-Diox did answer this EXACT question for ME on SO. Oh, I am so embarrassed right now.
http://stackoverflow.com/questions/35112288/pure-js-disable-button-in-onsen-2-0-monaca
-
@argelius Please add this just to spare @Fran-Diox from having to answer this anymore for me. :stuck_out_tongue_closed_eyes:
-
@munsterlander Hahah, I didn’t even remember. Don’t worry, we needed a reference to that question in the forum as well :sweat_smile:
@argelius I guess we can add it if it’s easier for users :)
-
@Fran-Diox What’s sad is, I think everyone else gets it. It’s just poor me over here who seems to forget this method. :smile:
Honestly though, I would much rather you guys spend your time on other things because the current behavior is correct to javascript. Adding a disabled method, when in reality we are setting a css class as an attribute, goes against (in my opinion) what we are actually coding.
I should just be more mindful of what we are doing and at a minimum the docs could be updated to show that modifier and disabled are CSS classes / attributes. I just spent so much time with other platforms docs that I confuse myself with the verbiage. Totally my fault and not the platform (or the docs to be honest).
-
I think we can add a
disabled
method since the native elements have one. All it does it set the attribute though.