2012-02-10 2 views
1

스프링 컨트롤러가 있습니다.ExtJA.request 이후 ExtJS로드 그리드

@RequestMapping("/showreport") 
@ResponseBody 
public Map<String, ? extends Object> showreport 
     (parameters) 
{ 
    List<Object> listOne = ...; 
    Object objectOne = ...; 


    Map<String,Object> modelMap = new HashMap<String,Object>(3); 
    modelMap.put("total", listOne.size()); 
    modelMap.put("data", listOne); 
    modelMap.put("summary", objectOne); 
    modelMap.put("success", true); 
    return modelMap; 
} 

내가 모달 창에 격자를 표시하려면이 같은 ExtJS로 코드가

Ext.Ajax.request({     
     url: 'url', 
     params: 
     { 
      // parameters 
     }, 
     success: function (response) 
     {      
      var jsonData = Ext.util.JSON.decode(response.responseText); 

      store.proxy = new Ext.ux.data.BufferedPagingMemoryProxy(jsonData.data); 
      /* what will I do */ 

      new Ext.Window({ 
       title: 'title', 
       plain: true, 
       border: false, 
       modal: true, 
       items: [grid], 
       height:Ext.getBody().getViewSize().height - 100, 
       width:Ext.getBody().getViewSize().width*0.8 //80% 
      }).show(); 

     }, 
     failure: function(){}, 
    }); 

내 그리드, 저장 및 독자는 다음과 같이이다;

var Report = Ext.data.Record.create([ 
    {name: 'a'}, 
    {name: 'b', type: 'string'}, 
    {name: 'c', type: 'string'}, 
    {name: 'd', type: 'string'}, 
    {name: 'e', type: 'string'}, 
    {name: 'f', type: 'string'}, 
    {name: 'g'}, 
    {name: 'h'}, 
    {name: 'i', type: 'string'}, 
    {name: 'j'}, 
    {name: 'k', type: 'string'}, 
    {name: 'l', type: 'string'} 
]); 


var reader = new Ext.data.JsonReader({ 
    totalProperty: 'total', 
    successProperty: 'success', 
    idProperty: 'id', 
    root: 'data' 
}, 
Report); 

store = new Ext.data.JsonStore({ 
    id: 'reportID', 
    reader: reader 
}); 

var grid = new Ext.grid.GridPanel({ 
    id: 'tripDailyReportList', 
    store: store, 
    autoHeight : true, 
    loadMask: true, 
    autoHeight: true, 
    columns:[ 
      new Ext.grid.RowNumberer(), 
      {header: 'headerA', dataIndex: 'a'}, 
      {header: 'headerB', dataIndex: 'b'}, 
      {header: 'headerC', dataIndex: 'c', sortable: true}, 
      {header: 'headerD', dataIndex: 'd', sortable: true}, 
      {header: 'headerE', dataIndex: 'e', sortable: true}, 
      {header: 'headerF', dataIndex: 'f'}, 
      {header: 'headerG', dataIndex: 'g'}, 
      {header: 'headerH', dataIndex: 'h'}, 
      {header: 'headerI', dataIndex: 'i'}, 
      {header: 'headerJ', dataIndex: 'j'}, 
      {header: 'headerK', dataIndex: 'k'} 
      ] 
}); 

아약스 요청 후 창에 그리드를로드하고 싶습니다. 창문을 열었지 만 상점에 데이터를로드 할 수 없습니다. 내 아들은 이것과 같습니다.

{ "total": 56, "data": [{ "a": "1", "b": "2", "c": "3", "d" , "e": "5", "f": "6", "g": "7", .....} "요약": { "a": "1", "b" "2", "c": "3", "d": "4", "e": "5", "f": "6"} "성공": true}

can 이걸 고치는 거 도와 줄 수있어?

답변

1

컨트롤러에 json 메타 태그를 포함해야합니다. 리더의 idProperty은 json의 idProperty과 동일해야합니다. 우리가 사용할 수있는 것보다 var jsonData = Ext.util.JSON.decode(response.responseText); grid.store.loadData(jsonData);

0

이 플러그인의 기능을 모르지만 데이터가 상점에로드되지 않은 것으로 보입니다. 아마도 store.load()으로 전화하면 충분할 것입니다.

+0

답장을 보내 주셔서 감사합니다. 제 문제를 해결했습니다. 컨트롤러에 json 메타 태그를 포함해야합니다. 독자의 idProperty는 json의 idProperty와 동일해야합니다. 우리가 사용할 수있는 것보다'var jsonData = Ext.util.JSON.decode (response.responseText); grid.store.loadData (jsonData);' – vtokmak