Jquery mobile checkbox not checked when value is retrieved from DB

Question

In my phonegap application i use jquery mobile . When retrieve the value from my DB the other fields are filled correctly( textbox values are filled correctly ) works except checkbox . My problem is when the DB returns true or false whatever it is there is no changes in my checkbox . I struggled this issue for two days anyone suggest the solution to solve this one..

My coding is like:

 if (results.rows.item(0).checkbox1 == true) 
     $("#checkbox1").attr('checked', 'checked');
 else $("#checkbox1").removeAttr('checked');

Tried this also:

//$('#checkbox1').prop('checked', true).checkboxradio('refresh');
 //$("input[id='checkbox1']").attr("checked",results.rows.item(0).checkbox1).checkboxradio("refresh");

solved: like

if (results.rows.item(0).checkbox1 === 'true') 
     $("#checkbox1").attr('checked', 'checked');
 else $("#checkbox1").removeAttr('checked');

Answer 1

Try this:

var dbValue = (results.rows.item(0).checkbox1 === true);
$('#checkbox1').prop('checked', dbValue);

Note the === in the first line. If your DB return value is something like 1 or the string "true", check for it explicitly.

Answer 2

You have to do a refresh once you set the values dynamically to the form elements in jQuery Mobile.

For your case the method it is :

document.addEventListener('deviceready', function() {
    var a= true;
    alert("hi");
    if(a == true) {
       $("#checkbox1").attr("checked",true);
       $("#checkbox2").attr("checked",true);
    } else {
      $("#checkbox1").removeAttr('checked');
      $("#checkbox2").removeAttr('checked');
    }

    $("#checkbox1").attr("checked",true).checkboxradio("refresh");
}, false);