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

c++ - Function signature as a function template parameter -

-
i'd use function signature template argument. works great classes, when try same trick function templates, msvc throws error: error c2768: 'func' : illegal use of explicit template arguments here's code: template <typename signature> void func(); template <typename r, typename a1> void func<r(a1)>(); what should make work? you cannot partially specialize function template, not supported language. can create partially specialized class template static member function, , possibly trampoline function instantiate class template , invoke static function. something this: namespace detail { template<typename signature> struct helper; template<typename r, typename a1> struct helper<r(a1)> { static void call() { // stuff r , a1... } }; } template<typename signature> void func() { detail::helper<signature>::call(); }
Read more

algorithm - What are some ways to combine a number of (potentially incompatible) sorted sub-sets of a total set into a (partial) ordering of the total set? -

-
i have sorting problem i'm pretty sure doesn't have canonical "answer" - has number of different approaches, each pros/cons. i'm interested in hearing different approaches. suppose bunch of people {p_i | i=1,...,m} ranking favorite ice cream flavors. in total there n different flavors, single person p_i ranks n_i << n flavors or familiar with. i'm interested in combining these sub-rankings plausible overall ranking of n flavors. for concrete situation: m , n both 1000 (by coincidence), , each n_i 20 . can assume there's enough overlap in flavors people rank such no flavor "isolated". again, i'm interested in hearing different ways approach this, if there isn't single clear answer. thanks! one way approach problem construct directed cyclic graph representing of constraints on ordering of elements. nodes in graph represent different elements compared , have edge first node second node if had ranked first e...
Read more

How to call a javascript function after the page loads with a chrome extension? -

-
there's function on page want call after loads. not own page, can't insert html it. can please provide specific examples how chrome extension or greasemonkey? (function submitaction() ). both chrome extensions , greasemonkey offer ways specify when script inject if executed. in chrome extension, you set in manifest : "content_scripts": [ { "run_at" : "document_idle", in greasemonkey compatible userscripts, set in metadata // @run-at document-end in both cases, have add script if want ensure resources loaded when function executed : document.addeventlistener('load', submitaction);
Read more