javascript - onSelectRow in a JQGrid - Stack Overflow

admin管理员组

文章数量:1401593

I have gone through the solutions given for not working onSelectRow but they could not worked for me.

I have following code :

$("#myActions_gridTable").jqGrid({
        datatype:'local',
        data: myActionsData,
        cellsubmit: 'clientArray',
        cellEdit: true,
        rowNum: noOfLinesToDisplay,
        pager: $("#myActions_pager"),
        sortname: 'contract_Name',
        viewrecords: true,
        sortorder: 'asc',
        autoWidth:true,
        loadonce: true,
        cmTemplate: { title: false },
        height:'auto',
        scrollrows: true,
        colNames:["id","Status"],
        colModel:[
            {
                name:'id',index:'id', jsonmap:'id', width:1,hidden:true,key:true, editable:true
            },

            {name:'status',index:'status', align:'center', sortable: false,
                editable: true,
                edittype: "select",
                width: 150,
                editoptions: {
                    value: "1:Done;2:Running"
                }

            }
        ],


        onSelectRow : function(id){ 
            console.log('inside onSelectRow');
            if (id && id !== lastsel) {
                $('#myActions_gridTable').restoreRow(lastsel);
                $('#myActions_gridTable').editRow(id, true);
                lastsel = id;
            }

        }
    });

Here OnSelectRow does not get fired, no console.log is printed. Please help.

I have gone through the solutions given for not working onSelectRow but they could not worked for me.

I have following code :

$("#myActions_gridTable").jqGrid({
        datatype:'local',
        data: myActionsData,
        cellsubmit: 'clientArray',
        cellEdit: true,
        rowNum: noOfLinesToDisplay,
        pager: $("#myActions_pager"),
        sortname: 'contract_Name',
        viewrecords: true,
        sortorder: 'asc',
        autoWidth:true,
        loadonce: true,
        cmTemplate: { title: false },
        height:'auto',
        scrollrows: true,
        colNames:["id","Status"],
        colModel:[
            {
                name:'id',index:'id', jsonmap:'id', width:1,hidden:true,key:true, editable:true
            },

            {name:'status',index:'status', align:'center', sortable: false,
                editable: true,
                edittype: "select",
                width: 150,
                editoptions: {
                    value: "1:Done;2:Running"
                }

            }
        ],


        onSelectRow : function(id){ 
            console.log('inside onSelectRow');
            if (id && id !== lastsel) {
                $('#myActions_gridTable').restoreRow(lastsel);
                $('#myActions_gridTable').editRow(id, true);
                lastsel = id;
            }

        }
    });

Here OnSelectRow does not get fired, no console.log is printed. Please help.

• javascript
• jquery
• jqgrid
• jquery-events
• jqgrid-formatter

Share Improve this question Follow edited Sep 6, 2019 at 9:19 Brian Tompsett - 汤莱恩 5,8937272 gold badges6161 silver badges133133 bronze badges asked Jun 4, 2014 at 4:51 p.pradnyap.pradnya 1,08911 gold badge99 silver badges1010 bronze badges 5

• It's strange that you use both cellEdit: true and editRow (inside of onSelectRow). Which editing mode you want to implement: cell editing or row editing? Do you defined lastsel variable? – Oleg Commented Jun 4, 2014 at 5:10
• trirand./jqgridwiki/doku.php?id=wiki:events here 'S' is in capital for variable name 'lastSel', that might be a cause. Do you find any browser console error? – Bhushan Kawadkar Commented Jun 4, 2014 at 5:23
• i don't think it is about the variable name issue .. @BhushanKawadkar – Runcorn Commented Jun 4, 2014 at 5:29
• @Oleg Nothing was working for me so I just tried adding cellEdit also true. – p.pradnya Commented Jun 4, 2014 at 5:48
• @p.pradnya: Could you include the input data which you use. I find strange that you use edittype: "select" with editoptions: {value: "1:Done;2:Running"} without usage of formatter: "select". Do you use "Done" and "Running" strings in the input data or 1 or 2? – Oleg Commented Jun 4, 2014 at 7:31

Add a ment  | 

3 Answers 3

Sorted by: Reset to default 1

You need to define the variable lastsel as

 var lastsel;

In the above code you need to do :

var lastsel;
$("#myActions_gridTable").jqGrid({
..............
..............
..............,
  onSelectRow : function(id){ 
                        console.log('inside onSelectRow');
                        if (id && id !== lastsel) {
                            $('#myActions_gridTable').restoreRow(lastsel);
                            $('#myActions_gridTable').editRow(id, true);
                            lastsel = id;
                        }

                    }

Here is the working JsFiddle Demo

And could get further info here http://www.trirand./jqgridwiki/doku.php?id=wiki:events.

One possible problem could be the usage of edittype: "select" without usage of formatter: "select". In any way the property editoptions: { value: "1:Done;2:Running" } seems me very suspected if you don't use formatter: "select".

How looks the input data for the column "status"? Do you use 1 and 2 or "Done" and "Running"? If you want to hold 1 and 2 values in the data, but you want to display the values as "Done" and "Running" then you should use

formatter: "select", edittype: "select", editoptions: {value: "1:Done;2:Running"}

The demo demonstrates it. It uses

var myActionsData = [
        { id: 10, status: 1 },
        { id: 20, status: 2 }
    ];

as the input.

Alternatively one can use

var myActionsData = [
        { id: 10, status: "Done" },
        { id: 20, status: "Running" }
    ];

but one should use

edittype: "select", editoptions: {value: "Done:Done;Running:Running"}

in the case. No formatter: "select" are required in the last case: see another demo.

OnSelectrow is not working when cellEdit is true.

You can use onCellSelect instead of OnSelectrow.

本文标签： javascriptonSelectRow in a JQGridStack Overflow