JQuery jqgrid not sorting on client side -

-

the data loads fine grid, won't sort.

when click in table header, sort arrows appear, data's not being sorted.

thanks.

    $("#comptable").jqgrid({              url:'bomexplosioninjsonobj.asp'         ,   datatype: 'json'         ,   mtype: 'get'         ,   height: 400         ,   colnames:['part','description','src','std usage','usage inc scrap','rate scrap','uom','item','unit cost','stock']         ,   colmodel:[  {name:'comp1_part',index:'part', width:120}                                 ,   {name:'wscompdesc',index:'desc', width:300}                                 ,   {name:'wscompsrc',index:'src', width:10}                                 ,   {name:'compusage',index:'usage', width:80, align:"right",sorttype:"float"}                                 ,   {name:'wsgrossqty',index:'totusage', width:80, align:"right",sorttype:"float"}                                 ,   {name:'comprate_scrap',index:'rate scrap', width:80, align:"right",sorttype:"float"}                                 ,   {name:'compbasic_unit',index:'uom', width:20}                                 ,   {name:'comp1_item',index:'item', width:20}                                 ,   {name:'wscompunitcost',index:'unitcost', width:80, align:"right",sorttype:"float"}                                 ,   {name:'wscompqtystock',index:'stock', width:80, align:"right",sorttype:"float"}                             ]         ,   jsonreader: {                 root:"rows"             ,   page: "page"             ,   total: "total"             ,   records: "records"             ,   repeatitems: false             ,   id: "0"             }         ,   multiselect: false         ,   caption: "bom detail"         ,   rownum: 10000         ,   autoencode: true         ,   loadonce: true         ,   sortable: true         ,   loadcomplete: function() {jquery("#comptable").trigger("reloadgrid");}// call fix client-side sorting     }); });

json data being returned (as read firebug).

    {      "total":"1"     ,"page":"1"     ,"records":"2"     , "rows":       [        {"id":1,"wscompdesc":"zytel e101l blk moul ","wscompunitcost":7.08,"wscompsrc":"p ","wscompqtystock":75,"compbasic_unit":"kg ","compusage":0.0034,"comprate_scrap":0,"wsgrossqty":0.0034,"comp1_part":"1180019 ","comp1_item":" "        },        {"id":2,"wscompdesc":"insert ","wscompunitcost":1.89,"wscompsrc":"p ","wscompqtystock":400,"compbasic_unit":"ea ","compusage":2,"comprate_scrap":0,"wsgrossqty":2,"comp1_part":"4owe195689\/iss 2 ","comp1_item":" "        }       ]     }

you code have many important errors:

  1. colmodel contains index properties different value of name same item. it's main bug. don't specified sortname option of jqgrid values of index properties never seen server. if use loadonce: true index properties must same values of name properties. i recommend don't include index properties @ all. in case index properties initialized values of name properties
  2. you use wrong value of id property in jsonreader: id: "0". 1 use such value sometime in case of repeatitems: true. in case row represented in json input array. 0 value correct because in can used index in array. in case of usage repeatitems: false items represented rows of data in json input objects named properties. should use id: "id" in case. don't need include in jsonreader properties value default (root:"rows", page: "page") , on.
  3. the next problem usage of unconditional reloadgrid inside of loadcomplete. should understand loadcomplete executed on every reloading of grid (event on local reloading). wrong making permanent reloading of grid. usage of reloadgrid inside of loadcomplete bad point of view. if trigger reloadgrid event executed * immediately*, grid not in processing of previous loading. more correct trigger reloading inside of settimeout small time interval 50 ms.
  4. the last recommendation usage of k&r (kernighan , ritchie's) style of writing of code. it's not important style of formatting of code use in computer language , it's not important 1 find nice read. javascript has it's own rights. 1 there automatic semicolon insertion (see here example). if follow k&r never have problems automatic semicolon insertion.
  5. i recommend use height: "auto" if need display not rows , use column templates reduce size of code , simplify management.

after described above changing below

var myfloattemplate = { width: 80, align: "right", sorttype: "float" };  $("#comptable").jqgrid({     url: "bomexplosioninjsonobj.asp",     datatype: "json",     height: "auto",     colnames: ["part", "description", "src", "std usage", "usage inc scrap", "rate scrap", "uom", "item", "unit cost", "stock"],     colmodel: [         {name: "comp1_part", width: 120},         {name: "wscompdesc", width: 300},         {name: "wscompsrc", width: 40},         {name: "compusage", template: myfloattemplate},         {name: "wsgrossqty", width: 120, template: myfloattemplate},         {name: "comprate_scrap", width: 90, template: myfloattemplate},         {name: "compbasic_unit", width: 60},         {name: "comp1_item", width: 60},         {name: "wscompunitcost", template: myfloattemplate},         {name: "wscompqtystock", template: myfloattemplate}     ],     jsonreader: {         repeatitems: false,         id: "id"     },     caption: "bom detail",     rownum: 10000,     autoencode: true,     loadonce: true,     sortable: true,     sortname: "comp1_part",     //sortorder: "desc",     loadcomplete: function () {         var $self = $(this);         if ($self.jqgrid("getgridparam", "datatype") === "json") {             settimeout(function () {                 $self.trigger("reloadgrid"); // call fix client-side sorting             }, 50);         }     } });

the corresponding demo here. local sorting works , displays following results

enter image description here

updated: starting version 4.12.0 free jqgrid fork of jqgrid, develop, support new forceclientsorting: true option. works in combination loadonce: true option , allows first load data server response, sort data locally , display page of data. makes trick reloading of grid inside of settimeout, started in loadcomplete, described in answer, not needed. 1 need replace above loadcomplete code 1 additional option forceclientsorting: true. option forceclientsorting: true have additional 2 benefits:

  1. one don't see flicker after displaying of first (unsorted) grid;
  2. the performance of grid better, if have many rows, because displaying grid sorting. trick described in old answer displays grid, delete content (which too) , 1 displays sorted grid once more.

Comments

Post a Comment

Popular posts from this blog

Perl - how to grep a block of text from a file -

-
it can in xml or text format. how in general grep block of text in perl? <track type="ws"> <range> <rangestart>0</rangestart> <rangeend>146.912</rangeend> <locationindex>0</locationindex> <propertyindex>0</propertyindex> </range> </track> <track type="ps" id="1"> <range> <rangestart>0</rangestart> <rangeend>146.912</rangeend> <locationindex>1</locationindex> <propertyindex>1</propertyindex> </range> </track> i want grep type="ps" , till </range> . one solution open file, read line line , match block. open(fh, "file.txt"); foreach $line (<fh>) { if ($line =~ m/type="cc"(.*?)<\/range>/) { print $1; } } but there more optimal solution without reading file line l
Read more

delphi - How to remove all the grips on a coolbar if I have several coolbands? -

-
Image
if set mycoolbar.fixedorder true,only grip on first band hidden. well,if use delphi 7 create vcl forms application,then put coolbar on , create 3 coolbans hold other controls,only grip , top coolbands can hidden setting mycoolbar.fixedorder:=true. i've uploaded picture make things clear. you got fixedorder property wrong. fixed property not allow bands rearranged if set true . setting property of coolbar true keep user changing bands order @ runtime, user can still move , resize bands. can give advice can do, actual solution problem, well, have wait answer. my advice use 3 coolbars in row , setting "fixedorder" property true , bandborderstyle bsnone . way grip hidden on of them. about property, it's not bug of ide, actual preference of property.
Read more

javascript - Animating array of divs; only the final element is modified -

-
this baffling me @ moment. i'm experienced programmer looking throw bit of surprise fiancee on countdown page our wedding. desired effect simulated confetti falling behind main page. setup follows: i have array of divs in javascript. each div absolutely positioned on page. have interval set updates every 50 or milliseconds. on each tick, run loop on array of divs, , calculations , update positions. problem problem having, however, though can see divs created, stored array, , modified (in case, each has slight randomized rotation) during initialization phase, once tick update position starts, div stored in whatever last slot of array gets position updated. tried hard-coding each div index testing purposes, strictly last element update position. upon printing current "left" , "top" style values each div before , after calculations shows value has been changed, no visible change noticeable. here's basic code: javascript var container;
Read more