Take the 2-minute tour ×

Is it possible have a html link in a column with jqGrid, I can't find any example in the documentation?

share|improve this question
@djangofan jQuery and ExtJs are two different frameworks and have nothing to do with grids. I don't understand what your comment has to do with this question. –  Charles Boyung May 11 '12 at 20:37

6 Answers 6

up vote 19 down vote accepted

Yes, use a formatter, either a custom formatter or Predefined Formatter.

share|improve this answer
link with the answer is broken –  IT ppl Nov 10 '12 at 10:51

Here's the sample colModel configuration from Craig's link to jqGrid formatting help. It specifies the formatter as showLink and the url and params are specified with formatoptions.

colModel: [ {name:'myname', 
             formatoptions:{baseLinkUrl:'someurl.php', addParam: '&action=edit'}
share|improve this answer
Thanks for posting the sample. Always helpful :) –  Dan May 7 '10 at 8:57
It appends id=bla to base url, can I change the id to something else like data_id or record_id? I found how to do this formatoptions:{baseLinkUrl:'someurl.php', addParam: '&action=edit', idName='record_id'} –  digz6666 Feb 15 '11 at 4:11

Sorry to post to an old question, but here is another option that worked for me: simply create a custom formatter and return an anchor tag (a good option if you need really granular control of the link):

function returnMyLink(cellValue, options, rowdata, action) 
    return "<a href='/Controller/Action/" + options.rowId + "' >Click here</a>";

Look in the rowdata for the data returned by your query. Hope this helps someone!

share|improve this answer
Use this one where you want the id part of the link and not a parameter. eg. you want /mylink/123/ not /mylink?id=123 –  PhoebeB Sep 20 '11 at 11:16
this approach with custom formater will require further work in editoptions cause full output will be put in there as value. –  Email Feb 20 '12 at 0:24

within the json data i am using for the grid, i just send html code back with a href tag in, that works for me

share|improve this answer
Worked for me. In MVC controller action something like this when creating the json object worked for me: @"<a href=""" + Url.Content("~/People/Details/" + p.PeopleKey.ToString()) + @""">" + p.Name + "</a>" This however breaks the sorting as it encounter PeopleKey before Name. But I'm sure there is another work around for this. –  AaronLS Apr 19 '12 at 17:30
Managed to fix the sorting. Have to add another column that is just the text to sort on which is hidden { name: 'Name', index: 'Name', hidden: true}, and then reference that column name in the visible column's index: {width: 190, name: 'NameUrl', index: 'Name'}, –  AaronLS Apr 27 '12 at 21:33

If you use xml data, you can add a dummy column in your query to display it in the grid


colModel :[{name:'EDIT',edittype:'select',formatter:'showlink', width:5,xmlmap:"Edit",formatoptions:{baseLinkUrl:'someurl.php', addParam: '&action=edit'}},


select f1,f2,f3, 'Edit' as Edit FROM table
share|improve this answer

in xml I use entity &lt; instead of < in the a tag like this &lt;a href="dest">my link&lt;/a> and works fine with jqgrid 3.6

share|improve this answer

Your Answer


