Uncheck a Radio Button

[PropKittyParticipant]

Hello! I wanted to have a simple script that made it so that radio buttons could be easily unchecked without an uncheck button, just the same as normal checkmark – you click an already filled radio button, the ‘check’ (fill) goes away.

$("div.radio").on('click', function () {
        console.log($(this).jqxRadioButton('checked'));
        if ($(this).jqxRadioButton('checked') == true) {
            $(this).jqxRadioButton('uncheck');
        }
        else {
            $(this).jqxRadioButton({ checked: true });
        }
    });

However…

As it turns out, if I’m clicking a radio button NOT filled, by the time the above script runs, it already thinks the ‘checked’ is true (because I just clicked it to select it) and is making the radio immediately uncheck again. The console.log shows that it is equaling true immediately.

Any thoughts on how to prevent this problem and make this work? I actually can’t believe this isn’t already an option built into jqwidgets that can be turned on. Thank you!

[ivailoParticipant]

Hi PropKitty,

In this case when you click radio button you checked it. Your verification is executed after checking evenet and this turns the button to unchecked.
You can try to use another independent event to get the checked value.

Here is an example with mouseover event.

Best Regards,
Ivailo Ivanov

jQWidgets Team
http://www.jqwidgets.com

[Author]

Posts