loading columns dynamically for JQGrid using AjaxCall - asp.net-mvc

Question

I need to load columns to Jqgrid Dynamically and am trying to follow jqGrid and dynamic column binding
Am trying in MVC. for Column name am fetching from Table(Which has a list of Columns to be displayed in GRID) and returning the Json data which is straightforward.
How do i implement for ColModel. For ex: i need to send JSon object like this dynamically
{name: 'Airport', formatter: UrlFmatter, width: 95, align: "center", index: 'AIRPORT', searchoptions: { sopt: ['eq', 'ne', 'cn']} }
{name: 'Country', width: 100, align: "center", index: 'Country', searchoptions: { sopt: ['eq', 'ne', 'cn']} }
How my design should be to send json to set the colModel ?
My UrlFmatter code
function UrlFmatter(cellvalue, options, rowObject) {
return "<a href='DetailResult?airportname=" + options.rowId + "' >" + cellvalue + "</a>";
}
How do i write as per your answer for formatting and unformatting ?
Thanks

Answer 1

I suppose that you have the problem with sending information about the formatter (formatter: UrlFmatter) inside of JSON. JSON strings don't support functions as the type of data. The most easy way to solve the problem seems me registering your formatter in the same way as standard formatters. For example is you want that your formatter have the name "myUrlFormatter" you can use the following
(function ($) {
'use strict';
/*jslint unparam: true */
$.extend($.fn.fmatter, {
myUrlFormatter: function (cellValue, options) {
// you should place here the code of
// your custom formatter UrlFmatter
}
});
$.extend($.fn.fmatter.myUrlFormatter, {
unformat: function (cellValue, options, elem) {
// you should place here the code of
// your custom unformatter
}
});
}(jQuery));
You should include the code after jquery.jqGrid.min.js (or after jquery.jqGrid.src.js). After such registration of the formatter you can use it in colModel as
{name: "Airport", index: "AIRPORT", formatter: "myUrlFormatter", width: 95,
align: "center", searchoptions: { sopt: ["eq", "ne", "cn"]} }
So the value of formatter property will be string (formatter: "myUrlFormatter") instead of the function (formatter: UrlFmatter).