javascript - jqGrid - 使用 setSelection 始终选择第一行不起作用

Question

我正在使用页面加载时的数据填充 jqgrid 并尝试设置始终选择第一行，但由于某种原因它不起作用。

fiddle :https://jsfiddle.net/99x50s2s/116/

var customGrid = jQuery("#sg1");

customGrid.jqGrid({
    datatype: "local",
    gridview: true,
    loadonce: true,
    shrinkToFit: false,
    autoencode: true,
    height: 'auto',
    viewrecords: true,
    sortorder: "desc",
    scrollrows: true,
    loadui: 'disable',
    idPrefix: "cg_",
    colNames:['Inv No','Date', 'Client', 'Amount','Tax','Total','Notes'],
    colModel:[
        {name:'id',index:'id', width:60, sorttype:"int"},
        {name:'invdate',index:'invdate', width:90, sorttype:"date"},
        {name:'name',index:'name', width:80},
        {name:'amount',index:'amount', width:80, align:"right",sorttype:"float"},
        {name:'tax',index:'tax', width:80, align:"right",sorttype:"float"},     
        {name:'total',index:'total', width:80,align:"right",sorttype:"float"},      
        {name:'note',index:'note', width:150, sortable:false}       
    ],
    caption: "Test Grid"
});

var mydata = [
        {id:"1",invdate:"2007-10-01",name:"test 1234567890123456789",note:"note",amount:"200.00",tax:"10.00",total:"210.00"},
        {id:"2",invdate:"2007-10-02",name:"test2",note:"note2",amount:"300.00",tax:"20.00",total:"320.00"}
        ];

customGrid[0].addJSONData(mydata);

//set the first row always selected on initial load
customGrid.jqGrid('setSelection', 1);

期望:

应选择第一行。

我错过了什么吗？如有任何建议，我们将不胜感激。

Answer 1

请删除以下设置:

idPrefix: "cg_",

你可以试试我的版本。请确保您已正确加载 jquery-ui 库。设置idPrefix后，它无法仅使用ID将名为ui-state-highlight的类设置到该行。

var jgrid = $("#jqGrid").jqGrid({
    datatype: "json",
    gridview: true,
    loadonce: true,
    shrinkToFit: false,
    autoencode: true,
    viewrecords: true,
    sortorder: "desc",
    scrollrows: true,
    loadui: 'disable',
    colNames:['Inv No','Date', 'Client', 'Amount','Tax','Total','Notes'],
    colModel:[
       {name:'id',index:'id', width:60, sorttype:"int"},
       {name:'invdate',index:'invdate', width:90, sorttype:"date"},
       {name:'name',index:'name', width:80},
       {name:'amount',index:'amount', width:80, align:"right",sorttype:"float"},
       {name:'tax',index:'tax', width:80, align:"right",sorttype:"float"},
       {name:'total',index:'total', width:80,align:"right",sorttype:"float"},
       {name:'note',index:'note', width:150, sortable:false}
    ],
    width: 1280,
    height: 'auto',
    rowNum: 150,
    caption: "Test Grid"
});
var mydata = [
    {id:"1",invdate:"2007-10-01",name:"test 1234567890123456789",note:"note",amount:"200.00",tax:"10.00",total:"210.00"},
    {id:"2",invdate:"2007-10-02",name:"test2",note:"note2",amount:"300.00",tax:"20.00",total:"320.00"}
    ];
    jgrid[0].addJSONData(mydata);
    jgrid.jqGrid('setSelection', 1);