Posting list of json objects from Extjs to Spring MVC by using extjs editable grid
var premedCompletedCourseworkGrid = new Ext.extend(
Ext.grid.EditorGridPanel,
{
// plugins: [editor],
stripeRows : true,
columnLines : true,
enableHdMenu : false,
autoHeight : false,
disableSelection : false,
width : '100%',
clicksToEdit : 1,
viewConfig : {
overflow : 'auto',
autoScroll : true
},
baseCls : 'user-premed-grid',
store : premedCompletedCourseworkStore,
title : "My Premedical Coursework ",
columns : [ {
header : 'Course',
width : 240,
sortable : true,
dataIndex : 'course',
renderer : COMMON.renderCourse,
name : 'course'
}, {
header : 'Lab?',
width : 150,
sortable : true,
dataIndex : 'lab',
name : 'lab',
align : 'center',
renderer : COMMON.renderLabDesc,
editor : new Ext.form.ComboBox({
typeAhead : true,
triggerAction : 'all',
transform : 'labExamOption',
lazyRender : true,
listClass : 'x-combo-list-small'
})
}, {
header : 'Unit',
width : 150,
sortable : true,
dataIndex : 'units',
name : 'units',
renderer : COMMON.renderUnits,
align : 'center',
editor : new Ext.form.TextField()
} , {
header : 'Unit Type',
width : 155,
sortable : true,
renderer : COMMON.renderUnitTypeDesc,
dataIndex : 'unitType',
name : 'unitType',
align : 'center',
editor : new Ext.form.ComboBox({
typeAhead : true,
triggerAction : 'all',
transform : 'unitTypeOption',
lazyRender : true,
listClass : 'x-combo-list-small'
})
}
],
tbar : [ {
xtype : 'common.saveImgButton', //extjs button defined below
handler : function() {
try {
var store = new premedCompletedCourseworkGrid().getStore();
if (store != null){
// give only the modified rows data
var changedRecs = store.getModifiedRecords();
var resultStatus = true;
var data = [];
if (changedRecs != null && changedRecs.length > 0) {
for ( var i = 0; i < changedRecs.length; i++) {
var wamID = changedRecs[i].data.wamId;
var course = changedRecs[i].data.course;
var units = changedRecs[i].data.units;
var unitType = changedRecs[i].data.unitType;
var lab = changedRecs[i].data.lab;
if (units != null && units >0){
data.push({
wamId:wamID,
course:course,
lab:lab,
units:units,
unitType:unitType
});
}
}
var courseList = {preMedCourseList:data};
// json structure is {"preMedCourseList":[{"wamId":1312,
"course":course,"lab":'asd' ....},{}]}
Ext.Ajax.request({
url:'saveUserPreMedCourseWork1',
method: "POST",
headers: { 'Content-Type': 'application/json;charset=utf-8' },
jsonData:courseList,
success: function(response, opts) {
try {
//alert('reload');
premedCompletedCourseworkStore.reload();
var return_obj = Ext.decode(response.responseText);
resultStatus = return_obj.success;
} catch (e) {
resultStatus = false;
Ext.MessageBox.alert('Save premed course', "There was a problem
saving pre med course. Please refresh your browser." + e.message);
}
}
});
} else {
return Ext.MessageBox.alert('Confirm Save',
'Course details not modified');
}
}
} catch (e){
return Ext.MessageBox.alert('Confirm Save',
'Course details not modified' + e.message);
}
}
} ]
});
//save image button
COMMON.SaveImgButton = Ext.extend(Ext.Button, {
text : 'Save',
iconCls : 'edit',
scale : 'medium'
});
Ext.reg('common.saveImgButton', COMMON.SaveImgButton);
DTO Classes:
public class UserPreMedCourseList implements Serializable{
/**
*
*/
private static final long serialVersionUID = 7948048144505511239L;
List<UserPremedCourseworkDto> preMedCourseList;
public List<UserPremedCourseworkDto> getPreMedCourseList() {
return preMedCourseList;
}
public void setPreMedCourseList(List<UserPremedCourseworkDto> preMedCourseList) {
this.preMedCourseList = preMedCourseList;
}
}
public class UserPremedCourseworkDto extends PremedCourseworkDto{
private long wamId;
private String schoolUnits;
private String schoolUnitType;
private String schoolLab;
public long getWamId() {
return wamId;
}
public void setWamId(long wamId) {
this.wamId = wamId;
}
public String getSchoolUnitType() {
return schoolUnitType;
}
public void setSchoolUnitType(String schoolUnitType) {
this.schoolUnitType = schoolUnitType;
}
public String getSchoolUnits() {
return schoolUnits;
}
public void setSchoolUnits(String schoolUnits) {
this.schoolUnits = schoolUnits;
}
public String getSchoolLab() {
return schoolLab;
}
public void setSchoolLab(String schoolLab) {
this.schoolLab = schoolLab;
}
}
public class PremedCourseworkDto {
private String course;
private String required;
private String recommended;
private String lab;
private String unitType;
private String units;
private String ap;
private String online;
private String comm;
..
}
MVC Controller :
@RequestMapping(value = "{schoolId}/saveUserPreMedCourseWork1", method = RequestMethod.POST)
public @ResponseBody
ExtResponse saveUserPreMedCourseWork1(
@PathVariable("schoolId") Long schoolId,
@RequestBody UserPreMedCourseList preMedCourseList ) {
try {
List<UserPremedCourseworkDto> courseList = preMedCourseList.getPreMedCourseList();
for (UserPremedCourseworkDto workDto : courseList) {
workDto.setWamId(securityService.getCurrentWamId());
/// business logic goes here
}
}
} catch (Exception e) {
Logger.getLogger(SchoolDetailsController.class).error("Error on User pre medical course work details save",e);
return failure();
}
return success();
}
var premedCompletedCourseworkGrid = new Ext.extend(
Ext.grid.EditorGridPanel,
{
// plugins: [editor],
stripeRows : true,
columnLines : true,
enableHdMenu : false,
autoHeight : false,
disableSelection : false,
width : '100%',
clicksToEdit : 1,
viewConfig : {
overflow : 'auto',
autoScroll : true
},
baseCls : 'user-premed-grid',
store : premedCompletedCourseworkStore,
title : "My Premedical Coursework ",
columns : [ {
header : 'Course',
width : 240,
sortable : true,
dataIndex : 'course',
renderer : COMMON.renderCourse,
name : 'course'
}, {
header : 'Lab?',
width : 150,
sortable : true,
dataIndex : 'lab',
name : 'lab',
align : 'center',
renderer : COMMON.renderLabDesc,
editor : new Ext.form.ComboBox({
typeAhead : true,
triggerAction : 'all',
transform : 'labExamOption',
lazyRender : true,
listClass : 'x-combo-list-small'
})
}, {
header : 'Unit',
width : 150,
sortable : true,
dataIndex : 'units',
name : 'units',
renderer : COMMON.renderUnits,
align : 'center',
editor : new Ext.form.TextField()
} , {
header : 'Unit Type',
width : 155,
sortable : true,
renderer : COMMON.renderUnitTypeDesc,
dataIndex : 'unitType',
name : 'unitType',
align : 'center',
editor : new Ext.form.ComboBox({
typeAhead : true,
triggerAction : 'all',
transform : 'unitTypeOption',
lazyRender : true,
listClass : 'x-combo-list-small'
})
}
],
tbar : [ {
xtype : 'common.saveImgButton', //extjs button defined below
handler : function() {
try {
var store = new premedCompletedCourseworkGrid().getStore();
if (store != null){
// give only the modified rows data
var changedRecs = store.getModifiedRecords();
var resultStatus = true;
var data = [];
if (changedRecs != null && changedRecs.length > 0) {
for ( var i = 0; i < changedRecs.length; i++) {
var wamID = changedRecs[i].data.wamId;
var course = changedRecs[i].data.course;
var units = changedRecs[i].data.units;
var unitType = changedRecs[i].data.unitType;
var lab = changedRecs[i].data.lab;
if (units != null && units >0){
data.push({
wamId:wamID,
course:course,
lab:lab,
units:units,
unitType:unitType
});
}
}
var courseList = {preMedCourseList:data};
// json structure is {"preMedCourseList":[{"wamId":1312,
"course":course,"lab":'asd' ....},{}]}
Ext.Ajax.request({
url:'saveUserPreMedCourseWork1',
method: "POST",
headers: { 'Content-Type': 'application/json;charset=utf-8' },
jsonData:courseList,
success: function(response, opts) {
try {
//alert('reload');
premedCompletedCourseworkStore.reload();
var return_obj = Ext.decode(response.responseText);
resultStatus = return_obj.success;
} catch (e) {
resultStatus = false;
Ext.MessageBox.alert('Save premed course', "There was a problem
saving pre med course. Please refresh your browser." + e.message);
}
}
});
} else {
return Ext.MessageBox.alert('Confirm Save',
'Course details not modified');
}
}
} catch (e){
return Ext.MessageBox.alert('Confirm Save',
'Course details not modified' + e.message);
}
}
} ]
});
//save image button
COMMON.SaveImgButton = Ext.extend(Ext.Button, {
text : 'Save',
iconCls : 'edit',
scale : 'medium'
});
Ext.reg('common.saveImgButton', COMMON.SaveImgButton);
DTO Classes:
public class UserPreMedCourseList implements Serializable{
/**
*
*/
private static final long serialVersionUID = 7948048144505511239L;
List<UserPremedCourseworkDto> preMedCourseList;
public List<UserPremedCourseworkDto> getPreMedCourseList() {
return preMedCourseList;
}
public void setPreMedCourseList(List<UserPremedCourseworkDto> preMedCourseList) {
this.preMedCourseList = preMedCourseList;
}
}
public class UserPremedCourseworkDto extends PremedCourseworkDto{
private long wamId;
private String schoolUnits;
private String schoolUnitType;
private String schoolLab;
public long getWamId() {
return wamId;
}
public void setWamId(long wamId) {
this.wamId = wamId;
}
public String getSchoolUnitType() {
return schoolUnitType;
}
public void setSchoolUnitType(String schoolUnitType) {
this.schoolUnitType = schoolUnitType;
}
public String getSchoolUnits() {
return schoolUnits;
}
public void setSchoolUnits(String schoolUnits) {
this.schoolUnits = schoolUnits;
}
public String getSchoolLab() {
return schoolLab;
}
public void setSchoolLab(String schoolLab) {
this.schoolLab = schoolLab;
}
}
public class PremedCourseworkDto {
private String course;
private String required;
private String recommended;
private String lab;
private String unitType;
private String units;
private String ap;
private String online;
private String comm;
..
}
MVC Controller :
@RequestMapping(value = "{schoolId}/saveUserPreMedCourseWork1", method = RequestMethod.POST)
public @ResponseBody
ExtResponse saveUserPreMedCourseWork1(
@PathVariable("schoolId") Long schoolId,
@RequestBody UserPreMedCourseList preMedCourseList ) {
try {
List<UserPremedCourseworkDto> courseList = preMedCourseList.getPreMedCourseList();
for (UserPremedCourseworkDto workDto : courseList) {
workDto.setWamId(securityService.getCurrentWamId());
/// business logic goes here
}
}
} catch (Exception e) {
Logger.getLogger(SchoolDetailsController.class).error("Error on User pre medical course work details save",e);
return failure();
}
return success();
}
No comments:
Post a Comment