Question

I need to implement custom sorting in jqGrid, in column we have html markup, which brakes proper sorting, example:

<a href="/Templates/Article.aspx?id=12884945915" class="link" title="Article  123">Article </a>

Now is there a way to set jqGrid to sort this column ignoring html markup.

update
This is colmodel for this column

{"sortable":true,"name":"Title","index":"Title","hidden":false,"sorttype":null,"formatter":null,"formatoptions":null,"datefmt":null,"typeName":null},

And this is one example of column:

"Title":"<a href='/Templates/Article.aspx?id=4294967489' class='link' title='Sensor'>Sensor</a>"

Answer 1

I suppose that you will don’t have the described problem if you would construct contain of the column with respect of predefined formatter: "showlink" or with respect of your custom formatter. In case of usage custom formatter you should don’t forget to define unformat function which get the text from the cells of the column.

I suppose that your problem will be solved if you just define unformat property for the column.

One more alternative option which one has is the usage of custom sorting. It’s nothing more as specifying of sorttype as function. The answer and this one provide examples of such implementation. It’s important to understand that sorttype will be used only in case of local sorting. If you use server side sorting then you should search for the origin of described problem in your server side code.

UPDATED: It’s not recommended to use HTML fragments inside of data. In the way you mix the data with markup which makes sorting more difficult. Instead of that you could for example replace the input data

"Title":"<a href='/Templates/Article.aspx?id=4294967489' class='link' title='Sensor'>Sensor</a>"

to

"ArticleId":4294967489, "Title":"Sensor"

The <a> element inside of the cell you can construct with respect of custom formatter. In the case you could use column definition like

{name: "Title", width: 100,
    formatter: function (cellvalue, options, rowObject) {
        return "<a href='/Templates/Article.aspx?id=" + rowObject.refid +
            "' class='link' title='" + $.jgrid.stripHtml(cellvalue) + "'>" +
            $.jgrid.htmlEncode(cellvalue) + "</a>";
    }}

If the rowid which you use in the grid (the column with the name id or the column having the property key: true and which values are unique) is the same as ArticleId then you can use options.rowId instead of rowObject.refid.

You can read more about custom formatter for example in the answer.