Checkbox state

[CarpeTempus]

Hi,

today I updated jQuery mobile in my app to 1.3.0 rc01. After some testing I noticed that the following does not work anymore:

This is my page:

        <div data-role="page" id="pageFirstStart" style="background: url('img/papier.png');">
    <div data-theme="a" data-role="header">
        <h3>Header</h3>
    </div>
    <div data-role="content" style="padding: 15px">
        <h3>My Title</h3>
        Blablabla...
        <div class="ui-grid-a">
            <div class="ui-block-a">
                <a data-shadow="false" id="button1" data-role="button"
                    data-transition="fade" href="#page1"
                    data-icon="check" data-iconpos="left">Yes.</a>
            </div>
            <div class="ui-block-b">
                <a data-shadow="false" id="button2" data-role="button"
                    data-transition="fade" href="#page2" data-icon="delete"
                    data-iconpos="left">No.</a>
            </div>
        </div>
        <fieldset data-role="controlgroup">
            <legend>Blablabla..</legend>
            <input name="rememberMe" id="rememberMe" type="checkbox" checked="checked"> <label for="rememberMe">Ok.</label>
        </fieldset>
    </div>
</div>

When the user clicks on button1 or button2 I need to react on the checkbox state. I'm doing it this way:

var checkboxstate = $("#rememberMe").attr("checked");
console.log("checkboxstate = "+$("#rememberMe").attr("checked")); // returns always (!) "checked"
if(checkboxstate != "checked")
{
     // reaction on unselected checkbox..
}

In the past this worked perfectly - today I noticed that checkboxstate ist always "checked" wether the checkbox is checked or not. I'm not sure but I think it might be a bug - what do you think?

Platforms/browsers (including version) and devices tested:

• Android 4.2.1 (Google Nexus 7)
• Android 4.1.2 (Samsung Galaxy S3)

jQuery Mobile and jQuery core version used:

• jQuery 1.9.0
• jQuery mobile 1.3.0 rc01

Other relevant information, e.g. using PhoneGap:

• Yep, I'm using Phonegap 2.3.0

Thanks for reading.

Kind regards CarpeTempus

[jaspermdegroot]

@CarpeTempus

I can confirm that this doesn't work anymore, something we have to look into. This still works: $( "#rememberMe" ).is( ":checked" ); Example: http://jsbin.com/izohig/29/edit

[CarpeTempus]

@uGoMobi Thanks for the information and the tip :-) :+1:

[gabrielschulhof]

When the checkbox becomes checked/unchecked it's not a good idea to modify the DOM by appending/removing the "checked" attribute, because that breaks form reset. The idea is to set the prop. So .prop( "checked" ) is the correct way to get/set the checked state, not .attr( "checked" ).

The presence/absence of the "checked" attribute determines what value the checkbox will get when someone resets the form, so we should not modify that particular part of a checkbox's DOM.