CODEWITHSUNDEEP
javascripteventsinputradio-button
MagTun
MagTun

Reputation: 6185

Radio input checked with keyboard shortcut doesn't trigger event change

I have added a keyboard shortcut to my script so that when I press ctrl + 1 the first "source" radio input is checked : 

    if (e.key == "1" && e.ctrlKey) {
        document.getElementsByName("source")[0].checked = true;

    }

So far everythin is good. I have added an event listener so that when the state of my radio input are changed, then several things happen. But this event listener isn't triggered when I press ctrl+1 even thought the state of the radio input is changed (I can see the color of the input changing). If click manually on the radio input then the event listener is working: 

var radiosource = document.getElementsByName("source");
for (var i = 0; i < radiosource.length; i++) {
    radiosource[i].addEventListener('change', function (e) {
        var input_changed_id = e.target.id;
        if (input_changed_id.includes("en")) {
            document.getElementById("fr_target").checked = true;
            current_target = "fr";
        }
        if (input_changed_id.includes("fr")) {
            document.getElementById("en_target").checked = true;
            current_target = "en";
        }
        translate();
    });
}

Here is the full script (cf lines 119 and lines 49 and 322)

Upvotes: 0

Views: 186

Answers (1)

Furkan Poyraz
Furkan Poyraz

Reputation: 692

It won't trigger if you change the checked value manually but your event will trigger if you simulate the click on the radio button using .click().

So just update your keyboard shortcut script to this:

if (e.key == "1" && e.ctrlKey) {
  document.getElementsByName("source")[0].click();
}

Upvotes: 1

Related Questions