Using idPrefix in jqGrid

An option was introduced idPrefix

to store IDs in the HTML page, even if you have IDs on the page such as strings downloaded from the server. A typical example is two grids with data downloaded from the server. You have two tables in your database where you use IDENTITY or AUTOINCREMENT in your definition PRIMARY KEY

. In case the primary key will be generated automatically in the table and will be unique within the table, but there are no unique tables. Therefore, if you use primary keys as grid IDs and place two grids on the same page, you may have duplicate IDs.

To solve the problem, you can use idPrefix: "a"

as an additional option in the first grid and use idPrefix: "b"

in the second grid. In case of local jqGrid will use ids with a prefix everywhere, but the prefix will be stripped if the ids are sent to the server .

Thus, you will see locally at all callbacks (events) and all the methods (eg setRowData

, addRowData

etc.) IDs with the prefix, but on the side of the Ides server prefix will be removed immediately before sending it to the server.

I recommend that you additionally read another answer on identifier restrictions that I posted today.

UPDATED . I went through the code you put on the jsfiddle and found some glaring bugs in your code. Current code

1) use wrong algorithm to generate newline id. For example the following code

// generic way to create an animal    
function newAnimal(collection, defaults) {
    var next = collection.length + 1;
    var newpet = {
        id : next,
        name: defaults.name + next,
        breed: defaults.breed
    };
    return newpet;
}

      

        
        
        
      

    

use collection.length + 1

for new id. It is wrong if you are deleting items. By adding two elements, removing one of them and adding a new element, the id is duplicated again. Instead, it is safer to use some variable that will only increase. You can use $. Jgrid.randId () for example the code is very simple.

2) you call addRowData

with the addition of manually prefix (cm. dogsPrefix+newdog.id

Below). This is wrong because jqGrid prefixes the strings once more.

// add dog button actions    
$('#dogAddAtEnd').click(function() {
    var newdog = newAnimal(dogs, dogDefaults);
    dogs.push(newdog);
    dogAdded();        
    dogsTable.jqGrid('addRowData', dogsPrefix+newdog.id, newdog);
});

      

        
        
        
      

    

There are probably more problems, but at least these problems might explain the problems you described.

UPDATED 2 . I've reviewed the new demo you posted. He still has lines

grid.jqGrid('addRowData', newanimal.id, newanimal,
            "after", prefix+ followingId);

      

        
        
        
      

    

and

dogsTable.jqGrid('addRowData', dogsPrefix+newdog.id, newdog);

      

        
        
        
      

    

which should be fixed to

grid.jqGrid('addRowData', newanimal.id, newanimal,
            "after", followingId);

      

        
        
        
      

    

and

dogsTable.jqGrid('addRowData', newdog.id, newdog);

      

        
        
        
      

    

However, I tested the demo after the changes and found errors in the code addRowData

, delRowData

and setRowData

. The problem is the line delRowData

and the same line setRowData

var pos = $t.p._index[rowid];

      

        
        
        
      

    

can be fixed at the next

var id = $.jgrid.stripPref($t.p.idPrefix, rowid), pos = $t.p._index[id];

      

        
        
        
      

    

Inside I addRowData

suggest including the line

var id = rowid; // pure id without prefix

      

        
        
        
      

    

before the line

rowid  = t.p.idPrefix + rowid;

      

        
        
        
      

    

of addRowData

. Other towing lines addRowData

lcdata[t.p.localReader.id] = rowid;
t.p._index[rowid] = t.p.data.length;

      

        
        
        
      

    

should be changed to

lcdata[t.p.localReader.id] = id;
t.p._index[id] = t.p.data.length;

      

        
        
        
      

    

where the unprefixed id will be used.

The modified demo code, which uses the fixed version of jquery.jqGrid.src.js , you can test here .

I will post a bug to trirand later to inform the jqGrid developer. I hope that a bug fix will be included in the main jqGrid code soon.

Also, I recommend using the method $.jgrid.stripPref

to remove prefixes from strings. For example, the function

//general delete selected 
function deleteSelectedAnimal(list, grid, prefix)
{
    var sel = grid.jqGrid('getGridParam', 'selrow');
    if (sel.length)
    {
        var gridrow = sel;  

        //get the unprefixed model id
        var modelid = gridrow; 
        if (prefix.length !== 0)
        {
           modelid = modelid.split(prefix)[1];     
        }                
        // make it a numeric
        modelid = Number(modelid);

        //delete the row in the collection  
        list = RemoveAnimal(list, modelid);

        //delete the row in the grid
        grid.jqGrid('delRowData', gridrow);
    }
}

      

        
        
        
      

    

from your demo can be rewritten to the following

//general delete selected
function deleteSelectedAnimal(list, grid)
{
    var sel = grid.jqGrid('getGridParam', 'selrow'),
        gridPrefix = grid.jqGrid('getGridParam', 'idPrefix');
    if (sel !== null)
    {
        //delete the row in the collection
        // ??? the gogs list will be not modified in the way !!!
        list = RemoveAnimal(list, $.jgrid.stripPref(gridPrefix, sel));

        //delete the row in the grid
        grid.jqGrid('delRowData', sel);
    }
}

      

        
        
        
      

    

I'm not sure if the row list = RemoveAnimal(list, $.jgrid.stripPref(gridPrefix, sel));

or function RemoveAnimal

does what you want, but this is not a jqGrid related issue.

One more small note about your code. You are already using the objects that you add to the grid, property id

. This is the same name as defined in localReader.id . In case the data from the property id

will be used as an attribute id

for the grid lines ( <tr>

). The local parameter will be data

saved in id

addition to other properties that are built from the properties of the name

elements colModel

. So I see no point in defining a hidden column

{ key: true, name: 'id', align: 'left', hidden: true }

      

        
        
        
      

    

As you can see in the demo, everything else works exactly the same as before if you remove the column id

from the grids you are using.

UPDATED 3 . As promised, I've submitted a relevant bug report here .