$(function () { $("#jqGrid").jqGrid({ url: '../specification/list', datatype: "json", colModel: [ {label: 'id', name: 'id', index: 'id', key: true, hidden: true}, {label: '规格名称', name: 'name', index: 'name', width: 80 }, {label: '排序', name: 'sortOrder', index: 'sort_order', width: 80 } ], viewrecords: true, height: 550, rowNum: 10, rowList: [10, 30, 50], rownumbers: true, rownumWidth: 25, autowidth:true, multiselect: true, pager: "#jqGridPager", jsonReader: { root: "page.list", page: "page.currPage", total: "page.totalPage", records: "page.totalCount" }, prmNames: { page: "page", rows: "limit", order: "order" }, gridComplete: function () { $("#jqGrid").closest(".ui-jqgrid-bdiv").css({"overflow-x": "hidden"}); } }); }); var vm = new Vue({ el:'#rrapp', data:{ showList: true, title: null, specification: {}, ruleValidate: { name: [ {required: true, message: '规格名称不能为空', trigger: 'blur'} ] }, q: { name: '' } }, methods: { query: function () { vm.reload(); }, add: function(){ vm.showList = false; vm.title = "新增"; vm.specification = {}; }, update: function (event) { var id = getSelectedRow(); if(id == null){ return ; } vm.showList = false; vm.title = "修改"; vm.getInfo(id) }, saveOrUpdate: function (event) { var url = vm.specification.id == null ? "../specification/save" : "../specification/update"; $.ajax({ type: "POST", url: url, contentType: "application/json", data: JSON.stringify(vm.specification), success: function(r){ if(r.code === 0){ alert('操作成功', function(index){ vm.reload(); }); }else{ alert(r.msg); } } }); }, del: function (event) { var ids = getSelectedRows(); if(ids == null){ return ; } confirm('确定要删除选中的记录?', function(){ $.ajax({ type: "POST", url: "../specification/delete", contentType: "application/json", data: JSON.stringify(ids), success: function(r){ if(r.code == 0){ alert('操作成功', function(index){ $("#jqGrid").trigger("reloadGrid"); }); }else{ alert(r.msg); } } }); }); }, getInfo: function(id){ $.get("../specification/info/"+id, function(r){ vm.specification = r.specification; }); }, reload: function (event) { vm.showList = true; var page = $("#jqGrid").jqGrid('getGridParam','page'); $("#jqGrid").jqGrid('setGridParam',{ postData: {'name': vm.q.name}, page:page }).trigger("reloadGrid"); vm.handleReset('formValidate'); }, handleSubmit: function (name) { handleSubmitValidate(this, name, function () { vm.saveOrUpdate() }); }, handleReset: function (name) { handleResetForm(this, name); } } });