What event should be hung up on input c checkbox to track its changes?

Question

What event to hang on the input box with the checkbox to track its changes?

Hanged the event 'change':

var settingsDisableGroupButton = document.getElementById('disable-group-titles'); function disableGroupTitles(event) { console.log('changed'); var typeGroupTitles = $('.type-titles'); typeGroupTitles.toggleClass('type-titles_disabled'); } settingsDisableGroupButton.addEventListener('change', disableGroupTitles);

But it does not work when we change the checked attribute of this object from a third-party function:

 settingsDisableGroupButton.checked = !settingsDisableGroupButton.checked;

A check mark is put in the checkbox, but the code that should be executed when changing the state does not work.

Michael Vaysman Michael Vaysman 1,300 four sixteen · Accepted Answer · 2016-12-04T12:45:43

Onchange is an event that occurred after the user changed the state of an item.
In your case there should be something like:

  settingsDisableGroupButton.checked = !settingsDisableGroupButton.checked; settingsDisableGroupButton.onchange.apply(settingsDisableGroupButton);

Or you can simply use the function that you call when an event is triggered ( disableGroupTitles )

Grigoryants Artem Grigoryants Artem 219 one one · Answer 2 · 2016-12-04T12:42:24

You need to trigger an event from a third-party function, you can do it like this:

 settingsDisableGroupButton.checked = !settingsDisableGroupButton.checked; $('#disable-group-titles').trigger('change');

In this case, I apologize, I did not notice the hashtag #vanillajs in the question, but #jquery oddly present there
The solution on jquery is also fine, I have mixed code anyway

What event should be hung up on input c checkbox to track its changes?

2 answers 2

More articles: