JQGRID can't get cell value for ajax parameter

Question

I try to inline update a specify cell's row of jQgrid. i send the parameter using ajax. i could get for id value, but i have difficulty to get cell value from a column named Status. My code below seems not working.

{name:'Status', index:'Status', width:50,search:true,align : 'center',
 editable: true,edittype:"checkbox",editoptions: {value:"OK:"}, 
 stype:'text',searchoption:{sopt:['cn']}}

loadComplete: function () {
   var iCol = getColumnIndexByName($(this),'Status'),rows = this.rows,i,c = rows.length;
   for (i = 1; i < c; i += 1) {
      $(rows[i].cells[iCol]).click(function (e) {
         var id = $(e.target).closest('tr')[0].id,isChecked = $(e.target).is(':checked');
         var rowData = jQuery("#list").getRowData(id);
         var colData = rowData['Status'];    

         $.ajax({
                 type   : "POST",
                 url    : "process1.php",
                 async  : false,
                 cache  : false,
                 data   : "id="+id+"&Status="+colData+"&action=cekmark",
                 success: function() {
                     $("#list").trigger("reloadGrid");
                     return this;
                     }
                 });
           return false;
           });
      }
  }

this is ajax result:

id:50831
Status:
action:cekmark

try to use the answer below

var rowData = jQuery("#list").getRowData(id);
var colData = rowData.Status;

found after click at selected cell (checkbox not yet show) but ajax directly send the parameter to server.why?

ANSWER

Based on oleg answer i change some script which suitable with my case :

onCellSelect: function () {
   var iCol = getColumnIndexByName($(this),'Status'),rows = this.rows,i,c = rows.length;
   for (i = 1; i < c; i += 1) {
      $(rows[i].cells[iCol]).click(function (e) {
          var id = $(e.target).closest('tr')[0].id,isChecked = $(e.target).is(':checked');
          var isChecked = isChecked? "OK" : "";
          $.ajax({
             type   : "POST",
             url    : "process1.php",
             async  : false,
             cache  : false,
             data   : "id="+id+"&Status="+isChecked+"&action=cekmark",
             success: function() {
                $("#list").setGridParam({datatype:'json', page:1}).trigger('reloadGrid'); //this make your grid reloaded without reload page
                //$("#list").trigger("reloadGrid"); 
                return this;
                }
             });
         return false;
         });
      }
    }

are you returning status from the server?? I mean have you assigned anything to the "Status" key in the json which you are returning from the server? — Krishna, Jan 19 '15 at 05:58
@Krishna Status value is "OK". i try the second way but value is `false` so ajax send wrong data. — nunu, Jan 19 '15 at 06:21
I think you should assign boolean value to the "Status" key! Can you post the server code to which you are making the ajax request? @nunu — Krishna, Jan 19 '15 at 08:04

score 0 · Accepted Answer · edited May 23 '17 at 12:06

0

I'm not sure why you use jQuery("#list").getRowData(id)['Status']. The value of isChecked variable get you the required results already. So to solve your main problem you can just use

data: "id="+id+"&Status="+isChecked+"&action=cekmark",

or, event better,

data: {id: id, Status: isChecked, action: "cekmark" },

One more advice. You register multiple click event handler inside of loadComplete. Every <input type="checkbox" ...> will get his own click event handler. I would recommend you to use one existing click handler registered by jqGrid in the whole body of the grid. It calls beforeSelectRow is you use the handle. The answer provides the demo which do very close to all what you need. You need just make small modifications and include $.ajax call to inform the server about changing of the checkbox state.

edited May 23 '17 at 12:06

Community

1
1

answered Jan 19 '15 at 07:40

Oleg

220,925
34
403
798

i try to remove formatter, cause for my case i need basic checkbox edit. after use your answer i found that after (single) click there is nothing happen(checkbox not show).but if double click (checkbox still not show) ajax send to server with `Status:false`. – nunu Jan 19 '15 at 08:09
@nunu: Sorry, but I don't understand what you mean. Do you tried to use `data: "id="+id+"&Status="+isChecked+"&action=cekmark"` instead of `data : "id="+id+"&Status="+colData+"&action=cekmark"` first of all? Do you tried [the demo](http://stackoverflow.com/a/24239416/315935), which do some actions (it implements local editing) on changing Status state? Do you really need to use `edittype:"checkbox"``and not `formatter:"checkbox"`? The `loadComplete` will be executed only after formatter fills the grid, but no row is in editing now, so the code `$(rows[i].cells[iCol]).click(.)` will not work. – Oleg Jan 19 '15 at 11:56
i have tried to change `colData into isChecked` the parameter can send. then i want to know what is the value of `isChecked`, i call `alert(isChecked);` and now i get isChecked value is `true` not `OK` . why? – nunu Jan 20 '15 at 07:16
1

@nunu: because `isChecked = $(e.target).is(':checked');`. So it have Boolean value. You can use `isChecked? "OK" : ""` instead if you want. – Oleg Jan 20 '15 at 07:51
for my case i change `beforeSelectRow` into `onCellSelect`. – nunu Jan 20 '15 at 08:20
@nunu: OK! The only advantage of `beforeSelectRow` is that can be used to prevent row selection. For example you can have selected one row and the user click on "button" or checkbox of another row. Inside of `beforeSelectRow` you can implement reaction on the "button" or checkbox *without* changing which row is selected. If selection of rows is not important then `onCellSelect` would be the best choice probably. – Oleg Jan 20 '15 at 16:09

JQGRID can't get cell value for ajax parameter

1 Answers1