2011-12-29 27 views
5

Mã sau không tải lại lưới.tải lại không hoạt động đối với jqgrid

$("#myjqgrid").trigger('reloadGrid'); 

Nếu tôi hiểu chính xác, cần thực hiện cuộc gọi ajax và tải lại lưới ngay cả khi không có thay đổi dữ liệu.

HTML

<table id="myjqgrid"></table> 
<div id="Pager"></div> 

JSON

{ 
    "colModel": [ 
     { 
      "name": "ID", 
      "label": "ID", 
      "width": 60, 
      "align": "left", 
      "jsonmap": "cells.0.value", 
      "sortable": true  
     }, 
     { 
      "name": "FirstName", 
      "label": "FirstName", 
      "width": 100, 
      "align": "left", 
      "jsonmap": "cells.1.value", 
      "sortable": false  
     }, 
     { 
      "name": "LastName", 
      "label": "LastName", 
      "width": 100, 
      "align": "left", 
      "jsonmap": "cells.2.value", 
      "sortable": false  
     } 
    ], 
    "colNames": [ 
     "ID", 
     "FirstName", 
     "LastName" 
    ], 
    "mypage": { 
     "outerwrapper": { 
      "page":"1", 
      "total":"1", 
      "records":"20", 
      "innerwrapper": { 
       "rows":[ 
        { 
         "id":"1", 
         "cells": 
         [    
          { 
           "value":"12345", 
           "label": "ID"      
          }, 
          { 
           "value":"David", 
           "label": "FirstName"  
          }, 
          {       
           "value":"Smith", 
           "label": "LastName"       
          }                      
         ]  
        }, 
        { 
         "id":"2", 
         "cells": 
         [    
          { 
           "value":"37546", 
           "label": "ID"      
          }, 
          { 
           "value":"Willy", 
           "label": "FirstName"  
          }, 
          {       
           "value":"Peacock", 
           "label": "LastName"       
          }                      
         ]  
        }, 
        { 
         "id":"3", 
         "cells": 
         [    
          { 
           "value":"62345", 
           "label": "ID"      
          }, 
          { 
           "value":"Kim", 
           "label": "FirstName"  
          }, 
          {       
           "value":"Holmes", 
           "label": "LastName"       
          }                      
         ]  
        }, 
        { 
         "id":"4", 
         "cells": 
         [    
          { 
           "value":"186034", 
           "label": "ID"      
          }, 
          { 
           "value":"Andy", 
           "label": "FirstName"  
          }, 
          {       
           "value":"Wills", 
           "label": "LastName"       
          }                      
         ]  
        }, 
        { 
         "id":"5", 
         "cells": 
         [    
          { 
           "value":"67345", 
           "label": "ID"      
          }, 
          { 
           "value":"Paul", 
           "label": "FirstName"  
          }, 
          {       
           "value":"Lawrence", 
           "label": "LastName"       
          }                      
         ]  
        }, 
        { 
         "id":"6", 
         "cells": 
         [    
          { 
           "value":"12906", 
           "label": "ID"      
          }, 
          { 
           "value":"Andy", 
           "label": "FirstName"  
          }, 
          {       
           "value":"Charlery", 
           "label": "LastName"       
          }                      
         ]  
        }, 
        { 
         "id":"7", 
         "cells": 
         [    
          { 
           "value":"564565", 
           "label": "ID"      
          }, 
          { 
           "value":"Bets", 
           "label": "FirstName"  
          }, 
          {       
           "value":"Josilyn", 
           "label": "LastName"       
          }                      
         ]  
        }, 
        { 
         "id":"8", 
         "cells": 
         [    
          { 
           "value":"34345", 
           "label": "ID"      
          }, 
          { 
           "value":"Pink", 
           "label": "FirstName"  
          }, 
          {       
           "value":"Floyd", 
           "label": "LastName"       
          }                      
         ]  
        }, 
        { 
         "id":"9", 
         "cells": 
         [    
          { 
           "value":"3429", 
           "label": "ID"      
          }, 
          { 
           "value":"Rose", 
           "label": "FirstName"  
          }, 
          {       
           "value":"Ben", 
           "label": "LastName"       
          }                      
         ]  
        }, 
        { 
         "id":"10", 
         "cells": 
         [    
          { 
           "value":"6668", 
           "label": "ID"      
          }, 
          { 
           "value":"Amy", 
           "label": "FirstName"  
          }, 
          {       
           "value":"Wills", 
           "label": "LastName"       
          }                      
         ]  
        }, 
        { 
         "id":"11", 
         "cells": 
         [    
          { 
           "value":"22786", 
           "label": "ID"      
          }, 
          { 
           "value":"Zarine", 
           "label": "FirstName"  
          }, 
          {       
           "value":"Khan", 
           "label": "LastName"       
          }                      
         ]  
        }, 
        { 
         "id":"12", 
         "cells": 
         [    
          { 
           "value":"56444", 
           "label": "ID"      
          }, 
          { 
           "value":"Dolly", 
           "label": "FirstName"  
          }, 
          {       
           "value":"Mathews", 
           "label": "LastName"       
          }                      
         ]  
        }, 
        { 
         "id":"13", 
         "cells": 
         [    
          { 
           "value":"99453", 
           "label": "ID"      
          }, 
          { 
           "value":"Ginger", 
           "label": "FirstName"  
          }, 
          {       
           "value":"Wills", 
           "label": "LastName"       
          }                      
         ]  
        }, 
        { 
         "id":"14", 
         "cells": 
         [    
          { 
           "value":"1234", 
           "label": "ID"      
          }, 
          { 
           "value":"Fabrice", 
           "label": "FirstName"  
          }, 
          {       
           "value":"Papa", 
           "label": "LastName"       
          }                      
         ]  
        }, 
        { 
         "id":"15", 
         "cells": 
         [    
          { 
           "value":"45000", 
           "label": "ID"      
          }, 
          { 
           "value":"Helen", 
           "label": "FirstName"  
          }, 
          {       
           "value":"Kites", 
           "label": "LastName"       
          }                      
         ]  
        }, 
        { 
         "id":"16", 
         "cells": 
         [    
          { 
           "value":"1255", 
           "label": "ID"      
          }, 
          { 
           "value":"Barbara", 
           "label": "FirstName"  
          }, 
          {       
           "value":"Dorris", 
           "label": "LastName"       
          }                      
         ]  
        }, 
        { 
         "id":"17", 
         "cells": 
         [    
          { 
           "value":"5555", 
           "label": "ID"      
          }, 
          { 
           "value":"Eugene", 
           "label": "FirstName"  
          }, 
          {       
           "value":"Mark", 
           "label": "LastName"       
          }                      
         ]  
        }, 
        { 
         "id":"18", 
         "cells": 
         [    
          { 
           "value":"1867", 
           "label": "ID"      
          }, 
          { 
           "value":"Harry", 
           "label": "FirstName"  
          }, 
          {       
           "value":"King", 
           "label": "LastName"       
          }                      
         ]  
        }, 
        { 
         "id":"19", 
         "cells": 
         [    
          { 
           "value":"45888", 
           "label": "ID"      
          }, 
          { 
           "value":"Lorraine", 
           "label": "FirstName"  
          }, 
          {       
           "value":"Williams", 
           "label": "LastName"       
          }                      
         ]  
        }, 
        { 
         "id":"20", 
         "cells": 
         [    
          { 
           "value":"4567777", 
           "label": "ID"      
          }, 
          { 
           "value":"Mark", 
           "label": "FirstName"  
          }, 
          {       
           "value":"Sheppard", 
           "label": "LastName"       
          }                      
         ]  
        }, 
        { 
         "id":"21", 
         "cells": 
         [    
          { 
           "value":"7777", 
           "label": "ID"      
          }, 
          { 
           "value":"Davis", 
           "label": "FirstName"  
          }, 
          {       
           "value":"Sheppard", 
           "label": "LastName"       
          }                      
         ]  
        } 
       ] 
      } 
     } 
    } 
} 

jqGrid nét

$(document).ready(function() { 
    $.ajax({ 
     type: "GET", 
     url: "myjqgrid.json", 
     data: "", 
     dataType: "json", 
     success: function(response){ 
      var columnData = response.mypage.outerwrapper, 
       columnNames = response.colNames, 
       columnModel = response.colModel; 

      $("#myjqgrid").jqGrid({ 
       datatype: 'jsonstring', 
       datastr: columnData,     
       colNames: columnNames, 
       colModel: columnModel, 
       jsonReader: { 
        root: "innerwrapper.rows",    
        repeatitems: false 
       }, 
       gridview: true, 
       pager: "#Pager", 
       rowNum: 21, 
       rowList: [21], 
       viewrecords: true,    
       recordpos: 'left', 
       multiboxonly: true, 
       multiselect: true, 
       sortname: 'ID', 
       sortorder: "desc", 
       sorttype: "text", 
       sortable: true, 
       caption: "<h2>MY JQGRID</h2>", 
       width: "1406",  
       height: "100%", 
       scrolloffset: 0,  
       loadonce: true,  
       cache: true, 
       loadComplete: function(data){ 

       } 
      }); 
      $("#myjqgrid").jqGrid('navGrid','#Pager', {add:false, edit:false, del:false, position: 'right'}); 
      $("#myjqgrid").jqGrid('gridResize',{minWidth:800,maxWidth:1405,minHeight:350,maxHeight:680}); 
      $("#myjqgrid").trigger('reloadGrid'); 
     } 
    }); 
}); 

Trả lời

9

Dường như với tôi rằng bạn có chỉ có vấn đề với loadonce: true thay đổi datatype thành 'cục bộ' sau lần tải dữ liệu đầu tiên. Vì vậy, phân trang, sắp xếp và lọc dữ liệu hoạt động cục bộ.

Nếu bạn xem chính xác nội dung phân trang, sắp xếp và lọc, bạn sẽ thấy rằng đó là một thay đổi của một số tham số của jqGrid và tải lại lưới tại địa phương. Vì vậy, phân trang, phân loại và lọc hoạt động cục bộ chỉ vì việc tải lại lưới hoạt động cục bộ.

Nếu bạn cần làm mới dữ liệu của lưới từ máy chủ, bạn chỉ cần đặt lại giá trị ban đầu là '232 'hoặc' xml ') rồi tải lại lưới.

Xem herehere để biết các ví dụ về mã.

+0

Bây giờ tôi hiểu. Tôi đã cố gắng để tải lại lưới điện trong khi trên trang 1 và nó dường như không làm bất cứ điều gì. Vì vậy, tôi đã bối rối. Tôi đã thử chơi với nhiều dữ liệu hơn. Ở trang 3, nhấp vào tải lại thực sự tải lại lưới và chuyển đến trang 1. Tuyệt vời. Cảm ơn bạn! – techlead

+0

bạn có thể vui lòng giúp tôi với điều này không - http://stackoverflow.com/questions/8681058/jqgrid-setting-caption-dynamically – techlead

+0

cảm ơn bạn rất nhiều vì đã đăng –

Các vấn đề liên quan