Skip to content

Radio button does not function properly #3670

Azuo opened this Issue Feb 29, 2012 · 4 comments

6 participants

Azuo commented Feb 29, 2012

Consider the following simple HTML:

<!DOCTYPE html>
        <meta charset="UTF-8" />
        <meta name="viewport" content="width=device-width, initial-scale=1" />
        <title>JQM Radio Test</title>
        <link type="text/css" rel="stylesheet" href="" />
        <script type="text/javascript" src=""></script>
        <script type="text/javascript" src=""></script>
        <link type="text/css" rel="stylesheet" href="" />
        <script type="text/javascript" src=""></script>
        <script type="text/javascript" src=""></script>
        <script type="text/javascript">
            $(document).delegate("#form", "submit", function(e) {
                var checked = $(this).find("input:checked");
                if (checked.length)
                    alert("Radio with value \"" + checked.val() + "\" is checked.");
                    alert("None of radio is checked.");
                return false;
        <style type="text/css">
            .ui-radio .ui-btn {
                z-index: 0!important;
        <div id="page" data-role="page">
            <div data-role="content">
                <form id="form" data-ajax="false">
                    <fieldset data-role="controlgroup" data-type="horizontal">
                        <legend>Check one:</legend>
                        <input type="radio" id="radio1" name="radio" value="1" />
                        <label for="radio1">Radio1</label>
                        <input type="radio" id="radio2" name="radio" value="2" />
                        <label for="radio2">Radio2</label>
                        <input type="radio" id="radio3" name="radio" value="3" />
                        <label for="radio3">Radio3</label>
                    <input type="submit" value="Submit" data-inline="true" />

When you click any decorated radio button, the native radio button does not get checked at all. If you click submit button, you will be informed that no radio button is checked.

This problem does not occur if using JQM 1.0.1.

I don't know whether this is a jQuery bug or a JQM bug, but if I move the following line (in radiocheck.js)

self._getInputSet().not( input ).removeAttr( "checked" );

just before the line:

input.attr( "checked", inputtype === "radio" && true || !input.attr( "checked" ) );

the problem will be fixed.

@Wilto Wilto was assigned Feb 29, 2012

Commented on this issue in #2553, which I believe introduced the regression.


Looks like this is related to #3482.

mnhjofi commented Feb 29, 2012

was just about to point to where "radio-choice-b" is missing from the parameters when clicking on submit...

@johnbender johnbender was assigned Feb 29, 2012

should be fixed, with tests. c1e230f

@johnbender johnbender closed this Mar 1, 2012
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Something went wrong with that request. Please try again.