NEJ & Spring MVC 前后端数据交互

下面分别介绍了NEJ使用GET方式下的请求和POST传对象、对象组、数组、单个参数传的方法。

GET方式：

假设后台接口是这样接受参数的

@RequestMapping(value = "/searchinnercat", method = RequestMethod.GET)
@ResponseBody
public JsonResponse innerCat(
@RequestParam(value="page", required=false, defaultValue="1")int page,
@RequestParam(value="name", required=false, defaultValue="")String name,
@RequestParam(value="partner_id")long partnerId) {

JsonResponse jsonResponse = new JsonResponse();
Map<String, Object> data = new HashMap<String, Object>();

return jsonResponse.setSuccessful().setData(data);
}

通用写法的请求:

_pro.__listContent = function(data){
var _data = {};
_data.partner_id = 1;

_j._$request('/brand/searchinnercat.json',{
method:'GET',
type:'json',
query:_ut._$object2query(_data),
timeout:1000,
onload:function(_cdata){
if(_cdata.code === 0){
this.__content.innerHTML = JSON.stringify(_cdata.data);
}else{   //
alert(' 出错！')
return;
}
}._$bind(this)
})
};

另一种简便的写法如下:

_pro.__initClassifies = function(_index){
var _wrap = this.__list;
_j._$request('/getcategory?categoryType=1&page='+_index,{
method:'GET',
type:'json',
onload:function(_cdata){
_wrap.innerHTML = _jt._$get('jst-template-1',{data:_cdata});
this.__onPage();
this.__rewriteClassify();
}._$bind(this)
});
};

POST方式：

传对象

假设后台接口如下：

@RequestMapping(value = "/addinnercat", method = RequestMethod.POST) //method可有可无
@ResponseBody
public JsonResponse addInnerCat(@RequestBody PartnerInnerCat pic) { //不加@RequestBody接受的会是一个空对象
JsonResponse jsonResponse = new JsonResponse();

System.out.println("finally~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~" + pic.toString());

return jsonResponse.setSuccessful().setData(1);
}

那么前端nej对应的传值如下：

_pro.__onAdd = function(_event){
_v._$stop(_event);

var _data = {};
_data.name = "test";
_data.description = "test";
_data.weight = 2;
_data.partnerId = 2;
_data.type = 2;

console.log(_data);
_j._$request('/brand/addinnercat.json',{
method:'POST',
type:'json',
data:JSON.stringify(_data),
headers:{'Content-Type':'application/json'}, //少了这个报 415 错误"Request Method Not Support Method 'GET' "
onload:function(_cdata){
if(_cdata.code === 0){
this.__listContent();
}else{   //填写出错，弹出出错信息
alert('出错！')
return;
}
}._$bind(this)
})
};

传Json字符串化的对象组

假设后台接口接手如下：

@RequestMapping(value = "/savepartnercatsmanage", method = RequestMethod.POST)
@ResponseBody
public JsonResponse savePartnerCatsManage(@RequestBody String partnerCatsJson) { //不加注解 传过来为null
JsonResponse jsonResponse = new JsonResponse();

return jsonResponse;
}

相应nej写法：

_pro.__onUpdate = function(_event){
_v._$stop(_event);

var _data = [];
var _item = {};
for(var i = 0; i < 2; i++) {
_item.id = i;
_item.productId = i;
_item.skuId = i;
_item.buyCount = i;
_data.push(JSON.stringify(_item));
}

_j._$request('/brand/savepartnercatsmanage',{
method:'POST',
type:'json',
data: "[" + _data + "]",  //[{"id":0,"productId":0,"skuId":0,"buyCount":0},{"id":1,"productId
be0f
":1,"skuId":1,"buyCount":1}]
timeout:1000,
headers:{'Content-Type':'text/plain'},
onload:function(_cdata){
if(_cdata.code === 0){
this.__listContent();
}else{
return;
}
}._$bind(this)
})
};

传对应单个参数

@RequestMapping(value = "/updatepartnercategory", method = RequestMethod.POST)
@ResponseBody
public JsonResponse updatePartnerCategory(@RequestParam(value="category_id")Long categoryId, @RequestParam(value="partner_id")Long partnerId) {

JsonResponse jsonResponse = new JsonResponse();

ResultCode code = partnerCategoryServiceImpl.updatePartnerCategory(categoryId, partnerId);
return jsonResponse.setSuccessful().setData(code);
}

_pro.__onAddParam = function(_event){
_v._$stopDefault(_event);
var _data = {};
_data.category_id = 1;
_data.partner_id = 1;

_j._$request('/brand/updatepartnercategory.json',{   //有时候会报404错误，这并不是ajax传输错误，而是后台报错了
method:'POST',
type:'json',
data:_ut._$object2query(_data),
timeout:1000,
onload:function(_cdata) {
if(_cdata.code == 0) {
}
else {
}
}._$bind(this)
})
};

传数组

@RequestMapping(value="/rmpartnercats", method=RequestMethod.POST)
@ResponseBody
public JsonResponse removePartnerCats(@RequestParam(value="ids")Long[] ids) {
JsonResponse jsonResponse = new JsonResponse();

ResultCode code = pACategoryServiceImpl.removePartnerCats(ids);

return jsonResponse.setSuccessful().setData(code.getIntValue());
}

_pro.__onDelArray = function(_event){
var productIds = [];
productIds.push(1);
productIds.push(2);

_j._$request('/brand/rmpartnercats.json',{
method:'POST',
type:'json',
data:"ids="+productIds,
onload:function(_cdata){
this.__content.innerHTML = JSON.stringify(_cdata);
}._$bind(this)
})
};