javascript - Custom formater calling in jqgrid not worked -

i trying call formatter function jqgrid.i put alert inside formatter function .but not worked.i followed http://www.trirand.com/jqgridwiki/doku.php?id=wiki:custom_formatter tutorial.

here code

function jqgridmethod() {     var jsondata = {         "model" : [ {             "name" : "code",             "index" : "code",             "width" : "100",             "sortable" : false,             "editable" : false,             formatter : "showlink",             formatoptions : {                 baselinkurl : 'javascript:',                 showaction : "seasonedit('",                 addparam : "');"             }         }, {             "name" : "name",             "index" : "name",             "width" : 100         },{             "name" : "colorcode",             "index" :"colorcode" ,             "width" : 100,             formatter:colorformatter          },{             "name" : "startday",             "index" : "startday",             "width" : 100         }, {             "name" : "startmonth",             "index" : "startmonth",             "width" : 100         },{             "name" : "endday",             "index" : "endday",             "width" : 100         },{             "name" : "endmonth",             "index" : "endmonth",             "width" : 100         },{             "name" : "encryption",             "index" : "encryption",             "width" : "100",             "hidden" : true,         } ],         "sort" : {             "sortcount" : "2",             "sortcolumn1" : "#jqgh_jqgrid_list_grid_code",             "sortcolumn2" : "#jqgh_jqgrid_list_grid_name"         },         "column" : [ "code", "name","color","start day","start month","end day","end month", "encryption" ],         "url" : {             "serverurl" : "/pms/season/list"         },     };     jqgriddata(jsondata); } /////////////////////////////////      function colorformatter(cellvalue, options, rowobject) {     //return '<img src="'+cellvalue+'" />';      alert("cellvalue"+cellvalue); // format cellvalue new format     var mygrid = $('#jqgrid_list_grid'),     selrowid = mygrid.jqgrid ('getgridparam', 'selrow'),     celvalue = mygrid.jqgrid ('getcell', selrowid, 'color'); return cellvalue; } 

is there thing wrong code.why dont alert gets worked?

i checked inside browser console.no errors shown there,it indicated function called,but alert , following code not gets worked??

you posted small part of code, 1 can see many problems inside.

the first one: should careful in type of properties used. example value of width property of colmodel items should number instead of string ("width" : 100 instead of "width" : "100"). more important value of formatter property should function instead of string contains name of function. javascript parses javascript code , sees variables defined in same scope (for example can define colorformatter function directly inside of function jqgridmethod) or in outer scope. if colmodel from server using ajax call can't specify function directly because json don't support fuction type. in case should use jqgrid version 4.7 or higher (i recommend use free jqgrid 4.9.2). allows define common templates uses custom formatter , use string value of formatter property. see here details. alternatively can defined custom formatters setting colorformatter property of $.fn.fmatter object. see the code or another one defines formatter: "dynamiclink" , formatter: "checkboxfontawesome4".

the second important problem understanding goal of formatter. problem following. jqgrid needs fill content (the body) of grid. web browser provides interface manipulate content of html page dynamically, it's important understand, modification of 1 element on page follow modification of other elements. if insert row in table example position of rows below , position of other elements below of table can changed. in same way css style of other elements can changed too. web browser have recalculate many properties of existing elements of page after modification of html page. process have name reflow (see here). improve performance of filling of large grid jqgrid use following scenario. collect content of body of grid as html string fragments , place innerhtml property of <tbody> element of grid one operation. improves performance of filling of large grid dramatically. should clear formatter have return html fragment of cell string. in same way can't use mygrid.jqgrid ('getcell', selrowid, 'color') value grid body because custom formatter called before body filled.

if custom formatter need access value column of same row should use options or rowobject parameters. in case of usage free jqgrid can remove rowobject parameter because information need in options already. rowid of current filling row in options.rowid. values input data current row can found in options.rowdata. value color column can use options.rowdata.color.

if have use old versions of jqgrid should use rowobject parameter. format of data of rowobject object depends on many factors. during initial filling of grid rowobject object contains data in same format input data returned server. if loads data server in format

{      "total": "xxx",      "page": "yyy",      "records": "zzz",     "rows": [         {"id":"12", "cell":["cell11", "cell12", "cell13"]},         {"id":"34", "cell":["cell21", "cell22", "cell23"]},           ...     ] } 

then should use rowobject[i] access color column , have use i corresponds number of color column in colmodel array. options.pos index should use instead of i, value can distinguish on 1 till 3 depends whether use or not options multiselect: true, subgrid: true or rownumbers: true.

if use format of input data

{      "total": "xxx",      "page": "yyy",      "records": "zzz",     "rows": [         {"id":"12", "colname1":"cell11", "color":"cell12", ...},         {"id":"34", "colname1":"cell21", "color":"cell22", ...},           ...     ] } 

then rowobject.color required data.

in case of usage first (array) format of input data and using loadonce: true additionally have more complex situation. during initial loading of data have use rowobject[2] access color, during later filling of grid format of rowobject changed , have use rowobject.color instead. have test whether rowobject array or not , use corresponding format. usage of rowobject.color || rowobject[2] can have results.

i described format of rowobject detailed understand benefit of using free jqgrid 4.9.2 simplify code. can use options.rowdata.color access color independent format of input data , independent usage of loadonce: true option.