problem after adding row in jqgrid

Question

I am using the below code to add row in jqGrid

Updated

I click on the checkbox to see id's by using your code below

 $(document).delegate('#list1 .jqgrow td input', 'click', function () 
{ 
    /*var grid = $("#list1 .jqgrow");
    var rowid = grid.jqGrid('getGridParam', 'selrow');*/
    var mydata = $("#list1").jqGrid('getGridParam','data');
    var idToDataIndex = $("#list1").jqGrid('getGridParam','_index');
    var id;
    for (id in idToDataIndex) {
        if (idToDataIndex.hasOwnProperty(id)) {
            console.info(id+", "+mydata[idToDataIndex[id]]['cfgName']);

        }
    }
    console.info("maxid "+id);

});

Here is my output in firebug

How i am getting jqg1 in place of id? may be this is creating the problem

function addRow(cfgid,cfgname,hostname,cfgDesc,productId,cfgType,updateDate,emailAddress,absolutePath)
{   
var myrow = {cfgid:cfgid, '':'', cfgName:cfgname, hostname:hostname, cfgDesc:cfgDesc, productId:productId,hostname:hostname,cfgType:cfgType,updateDate:updateDate,emailAddress:emailAddress,absolutePath:absolutePath};
$("#list1").addRowData(cfgid, myrow,"first");

$("#list1").trigger("reloadGrid");
$("#list1").sortGrid('updateDate', false, 'desc');
}

updateRow works fine as i used currentrow but how to use max id for adding a new row in addRow?

function    updateRow(cfgid,cfgname,hostname,cfgDesc,cfgType,updateDate,emailAddress,absolutePath)
{
      $("#list1").delRowData( currentrow );
  $("#list1").trigger("reloadGrid");

var myrow = {cfgid:cfgid, '':'', cfgName:cfgname, hostname:hostname, cfgDesc:cfgDesc, productId:updateproductid,hostname:hostname,cfgType:cfgType,updateDate:updateDate,emailAddress:emailAddress,absolutePath:absolutePath};
$("#list1").addRowData(currentrow , myrow);
$("#list1").sortGrid('updateDate', false, 'desc');
$("#list1").trigger("reloadGrid");
}

but is seems when the row is added it gets a duplicate id because when i try to select that row, 2 rows get selected.

My full jqGrid code

 var xmlDoc = $.parseXML(xml); 
         $('#configDiv').empty();
            $('<div width="100%">')
            .attr('id','configDetailsGrid')
            .html('<table id="list1" width="100%"></table>'+
                    '<div id="gridpager"></div>'+
                '</div>')       
            .appendTo('#configDiv');    

            var grid = jQuery("#list1");

            grid.jqGrid({

              datastr : xml,
              datatype: 'xmlstring',
              colNames:['cfgId','','Name', 'Host', 'Description','Product', 'Type', 'Last Updated Time','Last Updated By',''],
              colModel:[
                  {name:'cfgId',index:'cfgId', width:90, align:"right", hidden:true},
                  {name:'',index:'', width:15, align:"right",edittype:'checkbox',formatter: "checkbox",editoptions: { value:"True:False"},editable:true,formatoptions: {disabled : false}},
                  {name:'cfgName',index:'cfgName', width:90, align:"right"},
                  {name:'hostname',index:'hostname', width:90, align:"right"},
                  {name:'cfgDesc',index:'cfgDesc', width:90, align:"right"},
                  {name:'productId',index:'productId', width:60, align:"right"},
                  {name:'cfgType',index:'cfgType', width:60, align:"right"},
                  {name:'updateDate',index:'updateDate',sorttype:'Date', width:120, align:"right"},
                  {name:'emailAddress',index:'emailAddress', width:120, align:"right"},
                  {name:'absolutePath',index:'absolutePath', width:90, align:"right", hidden:true},
              ],
              pager : '#gridpager',
              rowNum:10,
              scrollOffset:0,
              height: 'auto',

              autowidth:true,
              viewrecords: true,
              gridview: true,
              xmlReader: {
                  root : "list",
                  row: "com\\.abc\\.db\\.ConfigInfo",
                  userdata: "userdata",
                  repeatitems: false
              },
              onSelectRow: function(id,status){
                  var rowData = jQuery(this).getRowData(id); 
                  configid = rowData['cfgId'];
                  configname=rowData['cfgName'];
                  configdesc=rowData['cfgDesc'];
                  configenv=rowData['cfgType'];

                  var ch =  jQuery(this).find('#'+id+' input[type=checkbox]').attr('checked');
                  if(ch) {
                            jQuery(this).find('#'+id+' input[type=checkbox]').attr('checked',false);
                  } else {
                            jQuery(this).find('#'+id+' input[type=checkbox]').attr('checked',true);                       
                  }

                  rowChecked=1;
                  currentrow=id;
                  },
              onCellSelect: function(rowid, index, contents, event) {
                  if(index==2)
                  {

                        $(xmlDoc).find('list com\\.abc\\.db\\.ConfigInfo').each(function()
                        {
                            //alert($(this).find('cfgId').text()+" "+configid);
                            if($(this).find('cfgId').text()==configid)  
                            {
                                configname=$(this).find('cfgName').text(); 
                                configdesc=$(this).find('cfgDesc').text();
                                configenv=$(this).find('cfgType').text();
                                filename=$(this).find('fileName').text();
                                updatedate=$(this).find('updateDate').text();
                                absolutepath=$(this).find('absolutePath').text();
                                productname=productMap[$(this).find('productId').text()];
                            }
                        });

                  }
               }

            });
            grid.jqGrid('navGrid','#gridpager',{edit:false,add:false,del:false});

Where am i going wrong?

Answer 1

You can't just use always the same id="1" as the first parameter of addRowData in the addRow. If you do this you will receive the id duplicates on the page which is not permitted on a HTML page.

It seems that the cfgId column are unique in the grid. So if you have only one grid with cfgId column on your page you can modify the addRowData in the addRow to the following:

$("#list1").addRowData(cfgid, myrow,"first");

Another way is to use $.jgrid.randId() method as the rowid parameter of addRowData

$("#list1").addRowData($.jgrid.randId(), myrow,"first");

or the undefined value:

$("#list1").addRowData(undefined, myrow,"first");

In the last case the jqGrid will call $.jgrid.randId() internally to generate the unique rowid.