jQueryUI radio button visible

Question

jQuery mobile leaves the radio button visible. Is this possible with jQueryUI without too much effort? Users understand the functionality of a radio button, so I'd prefer to keep that visual recognition.

jQuery Mobile Radio Button

gene · Accepted Answer · 2013-11-11 17:21:39Z

1

jQuery

$("#radioSet").buttonset();
$("#radio1").button("option", "icons", { primary: 'ui-icon-check' });
$("#radio2").button("option", "icons", { primary: 'ui-icon-check' });

$("#radioSet input[type=radio]").on("click", function () {
    $("#radioSet input[type=radio]").each(function () {
        if ($(this).is(":checked")) {
            $(this).button("option", "icons", { primary: 'ui-icon-check' });
        } else {
            $(this).button("option", "icons", { primary: 'ui-icon-cancel' });
        }
    });
});

Html

<div id="radioSet">
    <input type="radio" id="radio1" name="radio" checked="checked" />
    <label for="radio1">Radio 1</label>

    <input type="radio" id="radio2" name="radio" />
    <label for="radio2">Radio 2</label>
</div>

answered Nov 11, 2013 at 17:21

gene

3381 gold badge2 silver badges10 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

jQueryUI radio button visible

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related