0

I an using jqGrid, and I'm having a heck of a time inserting a new row in a specific location. I have the rowId, but when I make a call to determine what the position (the index of the row) I get a null back. I'm working with the table:

var grid = jQuery("#myTable");
grid.jqGrid({
    datatype: "local",
    colNames:['id','Type', 'Name', 'Total','In','Out'],
    colModel:[
            { name: 'id', index: 'id', hidden: true, align:"center"},     
            {name:'type',index:'type', width:10, sortable:true, align:"center"},
            {name:'name',index:'name', width:40, sortable:true, align:"center"},
            {name:'total',index:'total', width: 10, sortable:false, align:"center"},
            {name:'in',index:'in', width:10, sortable:true, align:"center"},
            {name:'out',index:'out', width:10, sortable:true, align:"center"}
    ],
    width: "600",
    height: "900"
  });

But when I call:

var dataIds = jQuery("#myTable").getDataIDs();

I get back the following:

Level 3.xpusdscdw,Level 3.scoach3,Level 3.xpusdscvs,Level 3.xpusdscah,Level 3.xpusdsctotem,Level 3.xpusdscsc

But when I try to get the row index of any of those, the result comes back null. This is what I'm trying to do:

var position = jQuery("#myTable").getInd(rowId,false);
alert("Position is: "+position+" for "+rowId);

And then I check and see what I got back (with the alert), I see this:

Position is: false for Level 03.xpusdscvs

?

What gives? getInd is supposed to return the row index of the rowId when you pass in false as the second parameter. A little help?

Thanks

JMecham
  • 291
  • 5
  • 17

1 Answers1

0

I have to start with remark what restrictions has id in HTML. It can't be any string. First of all it have to be unique on the page. Next it should follow requirements of CSS and HTML to identifiers. The requirements are a little different in different versions of CSS and different versions of HTML. For example in the specification of CSS 2.1 you can read the following (see here):

In CSS, identifiers (including element names, classes, and IDs in selectors) can contain only the characters [a-zA-Z0-9] and ISO 10646 characters U+00A0 and higher, plus the hyphen (-) and the underscore (_); they cannot start with a digit, two hyphens, or a hyphen followed by a digit. Identifiers can also contain escaped characters and any ISO 10646 character as a numeric code (see next item). For instance, the identifier "B&W?" may be written as "B\&W\?" or "B\26 W\3F".

In HTML5 specification you can read (see here)

The id attribute specifies its element's unique identifier (ID).

The value must be unique amongst all the IDs in the element's home subtree and must contain at least one character. The value must not contain any space characters.

Additionally if you use special characters like . or other meta-characters inside of jQuery selectorsyou must escape the character with two backslashes: \\. See here for more details.

jqGrid uses internally the method $.jgrid.jqID to escape the possible meta-characters:

var myElement = $('#' + $.jgrid.jqID(someId));

If you want to make his live easier I would recommend you to use only characters [A-Za-z], digits [0-9] or _ or - inside of ids. Additionally I would recommend you don't use ids which distinguished only in case. HTML is in most cases case insensitive, so it's better to use either [a-z] or [A-Z]. Additionally you should (but not must) to use the letter as the first character of id. The simple rule can save your time in the future.

In your case the ids like xpusdscdw, scoach3, xpusdscvs, xpusdscah, xpusdsctotem, xpusdscsc without the prefix "Level 3" are perfect.

Now come back to your main question. If you have id of a row in a variable rowid which is inside of the HTML table you can use the following code to get row index if the row:

var rowid = "xpusdscdw";
var myRow = $("#" + rowid);
alert("row index: " + myRow[0].rowIndex);

In the code I use the fact that rowid is the id of <tr> element of a <table>. See description of rowIndex here.

Oleg
  • 220,925
  • 34
  • 403
  • 798