I have here a demo on validating if a class exist in a div. when there is no class another class is removed from a button. Basically what this does is when there are no disabled button the disable on add button will be removed.
This works fine if the last thing user will do is change but if the last thing he does is key up it does not work.
What is wrong here?
js
function toggleDisabled(target) { var $target = $(target); $target.toggleClass('disabled', !$target.val()); } var $notnull = $('.notnull'); $(document).on('keyup, change', '.notnull', function (e) { toggleDisabled(e.currentTarget); }); $notnull.each(function (i, el) { toggleDisabled(el); }); function toggleDisabledNavButton(target) { var $target = $(target); var basic = $target.find('input,select').hasClass('disabled'); console.log(basic); //console.log($target); if (basic) { $("#add").addClass('disabled'); } else { $("#add").removeClass('disabled'); } } var detailscontainer = $('.notnull'); $(document).on('keyup, change, click', 'input:button,input.notnull,select.notnull', function (e) { e.preventDefault(); toggleDisabledNavButton($(e.currentTarget).closest('.detailscontainer')); }); detailscontainer.each(function (i, el) { toggleDisabledNavButton(el.closest('.detailscontainer')); });
If you type last the class disabled is not removed from button but if you make selecting in option the last it will remove the class from button that is my question. Why is that?
Advertisement
Answer
remove the ,
in your selector:
$(document).on('keyup change', '.notnull', function (e) {
if you type last the class disabled is still not removed from button but if you make selecting in option the last it will remove the class from button that is my question. why is that
Because of the ,
again:-
$(document).on('keyup change click', 'input:button,input.notnull,select.notnull', function (e) {
Why
As the jQuery documentation:-
.on( events [, selector ] [, data ], handler )
events Type: String
One or more space-separated event types and optional namespaces, such as “click” or “keydown.myPlugin”.