PDA

View Full Version : help with extjs grid + spring mvc!!!



vgovind23
8 Apr 2011, 11:43 AM
hi, i am trying to fetch data from db and display it in grid and then export it to excel. But i am getting empty grid with no data. Firebug doesnt show any error. Everything works fine with static data.

/*extjs code*/
var eformdata = Ext.data.Record.create([
{name: 'id'},
{name: 'label', type: 'string'},
{name: 'value1',type: 'string'},
{name: 'value2',type: 'string'},
{name: 'value3', type: 'string'},
{name: 'value4', type: 'string'},
{name: 'value5', type: 'string'},
{name: 'value6', type: 'string'},
{name: 'value7', type: 'string'},
{name: 'value8', type: 'string'},
{name: 'value9', type: 'string'},
{name: 'value10', type: 'string'}
]);

var proxy = new Ext.data.HttpProxy({
api: {read : '/eformdata/view.action?request_id=' + request_id} //mapped to controller
/*url: '/eformdata/view.action?request_id=' + request_id*/
});

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

var store = new Ext.data.Store({
id: 'user',
proxy: proxy,
reader: reader
});

var grid = new Ext.grid.GridPanel({
store: store,
columns: [ {header: "LABEL",
width: 100,
sortable: true,
dataIndex: 'label'},
{header: "value1",
width: 75,
sortable: true,
dataIndex: 'value1'},
{header: "value2",
width: 75,
sortable: true,
dataIndex: 'value2'},
{header: "value3",
width: 75,
sortable: true,
dataIndex: 'value3'},
{header: "value4",
width: 75,
sortable: true,
dataIndex: 'value4'},
{header: "value5",
width: 75,
sortable: true,
dataIndex: 'value5'},
{header: "value6",
width: 75,
sortable: true,
dataIndex: 'value6'},
{header: "value7",
width: 75,
sortable: true,
dataIndex: 'value7'},
{header: "value8",
width: 75,
sortable: true,
dataIndex: 'value8'},
{header: "value9",
width: 75,
sortable: true,
dataIndex: 'value9'},
{header: "value10",
width: 75,
sortable: true,
dataIndex: 'value10'}
],
title: 'E-Form',
width: 850,
frame:true,
tbar: []
});

grid.render('eform_info'); // (eform_info)div tag in my jsp

var exportButton = new Ext.ux.Exporter.Button({
component: grid,
text : "Download as .xls"
});

grid.getTopToolbar().add(exportButton);

/*code in controller*/
@RequestMapping(value="/eformdata/view.action")
public Map<String, Object> view(
@RequestParam("request_id") Integer requestId,
ModelMap model, HttpServletRequest request, HttpServletResponse response)
{
try
{
List<EformData> eformData = operationService.findEformforDisplay(requestId);
return getMap(eformData);
}
catch (Exception e)
{
return getModelMapError("Error");
}
}
private Map<String,Object> getMap(List<EformData> eformData){
Map<String,Object> modelMap = new HashMap<String,Object>(3);
modelMap.put("total", eformData.size());
modelMap.put("data", eformData);
modelMap.put("success", true);
return modelMap;
}
private Map<String,Object> getModelMapError(String msg){
Map<String,Object> modelMap = new HashMap<String,Object>(2);
modelMap.put("message", msg);
modelMap.put("success", false);
return modelMap;
}


is there any problem with the url mapping?? thanks for help. :)

mankz
8 Apr 2011, 12:27 PM
I don't see any line actually loading your store...?

vgovind23
9 Apr 2011, 4:24 AM
i should be using store.load() right? but still its not working.

var eformdata = Ext.data.Record.create([
{name: 'id'},
{name: 'label', type: 'string'},
{name: 'value1',type: 'string'},
{name: 'value2',type: 'string'},
{name: 'value3', type: 'string'},
{name: 'value4', type: 'string'},
{name: 'value5', type: 'string'},
{name: 'value6', type: 'string'},
{name: 'value7', type: 'string'},
{name: 'value8', type: 'string'},
{name: 'value9', type: 'string'},
{name: 'value10', type: 'string'}
]);

var proxy = new Ext.data.HttpProxy({
api: {read : '/eformdata/view.action?request_id=' + request_id}
/*url: '/eformdata/view.action?request_id=' + request_id*/
});

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

var store = new Ext.data.Store({
id: 'user',
proxy: proxy,
reader: reader
});

store.load(); //loading store?

var grid = new Ext.grid.GridPanel({
store: store,
columns: [ {header: "LABEL",
width: 100,
sortable: true,
dataIndex: 'label'},
{header: "value1",
width: 75,
sortable: true,
dataIndex: 'value1'},
{header: "value2",
width: 75,
sortable: true,
dataIndex: 'value2'},
{header: "value3",
width: 75,
sortable: true,
dataIndex: 'value3'},
{header: "value4",
width: 75,
sortable: true,
dataIndex: 'value4'},
{header: "value5",
width: 75,
sortable: true,
dataIndex: 'value5'},
{header: "value6",
width: 75,
sortable: true,
dataIndex: 'value6'},
{header: "value7",
width: 75,
sortable: true,
dataIndex: 'value7'},
{header: "value8",
width: 75,
sortable: true,
dataIndex: 'value8'},
{header: "value9",
width: 75,
sortable: true,
dataIndex: 'value9'},
{header: "value10",
width: 75,
sortable: true,
dataIndex: 'value10'}
],
title: 'E-Form',
width: 850,
frame:true,
tbar: []
});

grid.render('eform_info');

var exportButton = new Ext.ux.Exporter.Button({
component: grid,
text : "Download as .xls"
});

grid.getTopToolbar().add(exportButton);

vgovind23
12 Apr 2011, 5:22 AM
hi, i could display the data from DB on to grid and i am able to export it to excel now. but i am facing a problem. If a field is blank in grid, when i export it a value of "&#160;" is being shown in excel. how can i solve this problem?? plz help.