CODEWITHSUNDEEP
javascriptjqueryjqgrid
early
early

Reputation: 543

jqGrid - checkbox not getting correct input value?

The following is the sample code to test my problem. A local array, mydata, adding into the grid with a checkbox at the last column. You can simple copy and paste to run it immediately to see my problem.

<!doctype html>
<html>
<head>
    <link rel="stylesheet" type="text/css" href="css/style.css"/>
    <link rel="stylesheet" type="text/css" href="css/ui-lightness/jquery-ui-1.8.16.custom.css"/>
    <link rel="stylesheet" type="text/css" media="screen" href="css/ui.jqgrid.css" />

    <script type="text/javascript" src="js/jquery.js"></script>
    <script type="text/javascript" src="js/jquery-ui.js"></script>
    <script type="text/javascript" src="js/grid.locale-en.js" ></script>
    <script type="text/javascript" src="js/jquery.jqGrid.min.js" ></script>     
</head>
<body>
    <table id="list4"></table>

    <script type="text/javascript">
        jQuery("#list4").jqGrid({ 
        datatype: "local", 
        height: 250, 
        colNames:['Inv No', 'Client','Notes','Checked?' ], 
        colModel:[ 
        {name:'id',index:'id', width:60, sorttype:"int"}, 
        {name:'name',index:'name', width:100}, 
        {name:'note',index:'note', width:150, sortable:false}, 
        {name:'ind_checked',index:'ind_checked', width:100, sortable:false, align:'center', editable:true, 
            edittype:'checkbox', editoptions: { value:"Y:N" },  formatter:'checkbox'}
        ],
        caption: "Testing Check Option" }
        ); 
        var mydata = [ 
        {id:"1",name:"test1",note:"note1",ind_checked:"N"}, 
        {id:"2",name:"test2",note:"note2",ind_checked:"N"}, 
        {id:"3",name:"test3",note:"note3",ind_checked:"N"}, 
        {id:"4",name:"test4",note:"note4",ind_checked:"N"}, 
        {id:"5",name:"test5",note:"note5",ind_checked:"N"}, 
        {id:"6",name:"test6",note:"note6",ind_checked:"N"}, 
        {id:"7",name:"test7",note:"note7",ind_checked:"N"}, 
        {id:"8",name:"test8",note:"note8",ind_checked:"N"}, 
        {id:"9",name:"test9",note:"note9",ind_checked:"N"} ]
        ; 

        for(var i=0;i<=mydata.length;i++) {
            jQuery("#list4").jqGrid('addRowData',i+1,mydata[i]);
            var data = jQuery("#list4").jqGrid('getRowData',mydata[i].id);
            alert('Row ID:'+data.id+'; My data:'+mydata[i].ind_checked+'; Data stored in Grid:'+data.ind_checked);
        }
    </script>
</body>
</html>

The problem is

I've set all the field, 'ind_checked', to 'N' in mydata initially; after I added mydata into the grid, I tried to get the content back from the grid, and found that they are all 'Y' and stored up incorrectly.

I don't know why and have no any idea. can someone tell my what I'm missing, please? Thank you.

p.s. my version of jqGrid is 4.3.1

Upvotes: 1

Views: 3543

Answers (2)

Visruth
Visruth

Reputation: 3450

Here is an alternative solution to verify whether the checkbox is checked or not.

function customFormatter(cellvalue, options, rowObject) {
    var checkBoxValue = "N" ;
    var cell = jQuery('#' + options.rowId + '_' + 'ind_checked');        
    var val = cell.prop("checked");

    if(val == true) {
        checkBoxValue = "Y";
    }
    return checkBoxValue;
}

Upvotes: 0

proyeksi
proyeksi

Reputation: 21

May be U can try this

loadComplete: function (data) {
   var rowCount  = grid.getGridParam("reccount");
   if ( rowCount > 0 ) {
      for (var i = 0; i < data.rows.length; i++) {
          if (data.rows[i].cell[4] == 'Y') { // 4 cell ind_checked//
              $("tr#"+(data.rows[i].id)+".jqgrow > td > input.cbox:checked", grid[0]);
           }
      }
   }
}

Upvotes: 1

Related Questions