jquery+axios

axios使用起來比較方便

這個函數要本身添加,serializeObject這個函數比較坑

$.prototype.serializeObject=function(){  
    var obj=new Object();  
    $.each(this.serializeArray(),function(index,param){  
        if(!(param.name in obj)){  
            obj[param.name]=param.value;  
        }  
    });  
    return obj;  
};

• 下拉框和普通jquery同樣

axios.get("getDepartList?").then(function(res){
    console.log(res.data);
    for(var i=0; i<res.data.length; i++){
        var tmp=res.data[i];
        $("select[name='departid']").append("<option value='"+tmp.departid+"' >"+tmp.departname+"</option>")
    }
        
});

• 增長,須要把form轉化爲json

var param = $("form").serializeObject();//轉化爲json對象
axios.get("addEmp?",{params: param}).then(function(res){
        console.log(res)
});

• 批量刪除

//批量刪除
  function plsc() {
    var mid = "";
    var ids=[];
    $(":checkbox:checked").each(function(){
        mid += ","+$(this).val();
        ids.push($(this).val())
    })
    //上面的是縮寫
    //$("input[type='checkbox']:checked")
    alert(mid);
    mid = mid.substring(1);
    console.log(ids)
    //調用單刪的函數
    axios.get("plsc?ids="+ids).then(function(res){
        if(res.data=="success"){
            location.reload();
        }
    });

把數組傳到後臺,springmvc直接用數組就能夠接

• 修改回顯,若是有雙向綁定就行了

axios.get("getEmp?empid="+empid).then(function(res){
    console.log(res.data);

    $("input[name='empid']").val(res.data.empid);
    $("input[name='empname']").val(res.data.empname);
    $("input[name='empdesc']").val(res.data.empdesc);
    $("input[name='birth']").val(res.data.birth);
    $("select[name='departid']").val(res.data.departid);
    $("select[name='jobid']").val(res.data.jobid);

});

var param = $("form").serializeObject();//轉化爲json對象
    
axios.get("updateEmp?",{params: param}).then(function(res){
    console.log(res.data);
})

若是能進一步封裝使用起來就更方便了