2014-12-04 3 views
0

Использование - это случай, когда я хочу обрабатывать сортировку на стороне клиента и разбиение на страницы на стороне сервера, так как объем записей может быть большим. Я не хочу загружать сразу все записи. В настоящее время отображает ui, поэтому json ниже содержит их, а также метаданные. страница - текущая страница, всего - всего страниц и записей - общее количество записей.jqgrid localReader не работает

Я проверил с jqgrid, и я не понимаю, почему это не работает.

ui не отображает никаких записей, когда данные установлены как данные: ret и в localReader я указываю root как данные.

ui отображает запись, когда я указываю данные как данные: ret.data, но пейджер (отображение следующей картинки prev prev не работает).

мои данные JSON как это:

var ret={"data":[{"id":"1","firstName":"John","lastName":"Doe"},  
      {"id":"2","firstName":"John","lastName":"Burns"}, 
      {"id":"3","firstName":"John","lastName":"Newman"}, 
      {"id":"4","firstName":"Mike","lastName":"Vargas"},    
      {"id":"5","firstName":"David","lastName":"Taylor"}], 
    "page":1,"total":3,"records":24} 

мой JQuery, как показано ниже:

 grid.jqGrid({ 
      datatype: "local", 
      data: ret, 
      // root:"oldcontacts", 
      colNames:['ID', 'First Name','Last Name'], 
      colModel:[ 
       {name:'id',index:'id', key: true, width:70, sorttype:"int"}, 
       {name:'firstName',index:'firstName', width:90}, 
       {name:'lastName',index:'lastName', width:100} 

      ], 
      localReader : { 
       root :"data", 
       page: "page", 
       total: "total", 
       records :"records" 
      }, 
      search:true, 
      pager:'#pager', 
      //jsonReader: {cell:""}, 
      rowNum: 10, 
      rowList: [5, 10, 20, 50], 
      loadonce:false, 
      sortname: 'id', 
      sortorder: 'asc', 
      viewrecords: true, 
      sortable:false, 
      cmTemplate: {sortable:true},//change to false if want 
      multiselect:true, 
      multiboxonly: false, 
      height: "100%", 
      caption: "Multiple search with local data", 
      onSelectAll:function(aRowids,isSelected){ 
      // this is not used in this sample.. as I removed the check all button 
       var i, count, id; 
       for (i = 0, count = aRowids.length; i < count; i++) { 
        id = aRowids[i]; 
        if(isSelected) 
        {mysel.pushObject(id);} 
        else 
        { mysel.removeObject(id);} 

       } 

       that.set('selection',mysel); 
      }, 
      gridComplete: function(){ 

          },    

      onSelectRow: function (id,isSelected,e) { 
      //now lets tell jqgrid not to change to yellow on simple click 
       Ember.$('#'+id).attr("aria-selected","false");// override default selection 
       Ember.$('#'+id).removeClass("ui-state-highlight");// override default selection 

       if (e.ctrlKey){ 
       if (isSelected){ 
        mysel.pushObject(id); 
        Ember.$('#'+id).css('background','red'); 
        } 
        else 
        { 
        Ember.$('#'+id).css('background','white'); 
        mysel.removeObject(id); 
        } 
       that.set('selection',mysel); 
       } 




     }, 

     }); 

ответ

0

Возможно the answer решит проблему? Он использует datatype: "json" с опцией loadonce: true. Мне кажется, мне лучше сделать отдельный вызов Ajax. Основная проблема с пейджером может быть решена путем установки опций page, records и lastpage внутри loadComplete и явного вызова updatepager с соответствующими параметрами.

+0

благодарит за ваш ответ. Я извлекаю данные с помощью отдельного вызова ajax и формируя данные, как указано выше, прежде чем передавать его в jqgrid. как обновить пейджер на loadComplete? Я попробовал это, но он не работал. loadComplete: function() { страница: "page", всего: "total", записей: "records", grid.updatepager(); }, – user3630294

+0

@ user3630294: Добро пожаловать! Трюк с изменением 'page',' records' и 'lastpage' внутри' loadComplete' и вызова 'updatepager' работает в случае' datatype: "local" '. Вам нужно каким-либо образом реализовать перезагрузку сетки внутри 'onPaging'. Поэтому я думаю, что использование 'datatype:" json "' с 'loadonce: true' сделает ваш код короче. – Oleg

Смежные вопросы