jqGrid 编辑传参 与后台交互

一、前台：

  html代码：

<table id="chartTable" class="scroll" cellpadding="0" cellspacing="0"></table>
<div id="chartpager"></div>

 

js代码：

jQuery("#chartTable").jqGrid({
   url : '../dashbord/getAllChart.do',
   datatype : "json",
   colNames : [ "ID", "视图ID", "图表类型", "标题", "Y坐标显示","X坐标显示","数据SQL","分类名称","刷新时间" ],
   colModel : [ {
    name : "id",
    index : "id",
    width : 100,
    align : "center"
   }, {
    name : "pid",
    index : "pid",
    width : 100,
    align : "center",
    editable : true
   }, {
    name : "type",
    index : "type",
    width : 185,
    editable : true,
    align : "left",
    edittype : "select",
    editoptions : {
     value : "areaChart:区域图;lineChart:折线图;columnChart:柱状图;panelChart:仪表盘;pieChart:饼图"
    }
   }, {
    name : "title",
    index : "title",
    editable : true,
    align : "left",
    width : 130
   }, {
    name : "valueField",
    index : "valueField",
    width : 150,
    editable : true
   },{
    name : "categoryField",
    index : "categoryField",
    width : 100,
    editable : true
   },{
    name : "dataSource",
    index : "dataSource",
    width : 180,
    editable : true,
    edittype : "textarea",
    editoptions:{rows:"5",cols:"25"}
   },{
    name : "displayName",
    index : "displayName",
    width : 150,
    editable : true,
    edittype : "text"
   },{
    name : "refreshTime",
    index : "refreshTime",
    width : 150,
    editable : true,
    edittype : "text"
   },],
   height : 400,
   width  : 915,
   rowNum : 10,
   rowList : [ 10, 20, 50 ],
   viewrecords : true,
   forceFit : true,
   sortname : 'id',
   pager : jQuery('#chartpager'),
   jsonReader : {
    id : '0'
   },
   editurl : "../dashbord/editChart.do",
   caption : "视图选项配置"
  }).navGrid("#chartpager", {
   edit : true,
   add : true,
   del : true
  });

 

二、后台

查询出数据，分页显示的方法

public void getAllChart(HttpServletRequest request,
   HttpServletResponse response) throws Exception {
  request.setCharacterEncoding("utf-8");

  String page = request.getParameter("page");
  String rows = request.getParameter("rows");
  String req = request.getParameter("searchField");

  PrintWriter out = response.getWriter();

  List chartList = chartDao.getAllCharts();

  int totalRecord = chartList.size();
  int totalPage = totalRecord % Integer.parseInt(rows) == 0 ? totalRecord
    / Integer.parseInt(rows) : totalRecord / Integer.parseInt(rows)
    + 1;

  String json = "{total: " + totalPage + ", page: " + page
    + ", records: " + totalRecord + ", rows: [";

  int index = (Integer.parseInt(page) - 1) * Integer.parseInt(rows); // 开始记录数
  int pageSize = Integer.parseInt(rows);

  for (int i = index; i < pageSize + index && i < totalRecord; i++) {
   Chart chart = (Chart) chartList.get(i);
   json += "{cell:['" + chart.getId() + "','" + chart.getPid() + "','"
     + chart.getType() + "','" + chart.getTitle() + "','"
     + chart.getValueField() + "','" + chart.getCategoryField()
     + "','" + Deal.string2Json(chart.getDataSource()) + "','"
     + chart.getDisplayName() + "','"+chart.getRefreshTime()+"']}";
   if (i != pageSize + index - 1 && i != totalRecord - 1) {
    json += ",";
   }
  }
  json += "]}";
  out.println(json.toString());
  out.flush();
 }

 

编辑：删除、修改、添加的方法。这里如果用struts会更简单。

public void editChart(HttpServletRequest request,
   HttpServletResponse response) throws Exception {
  request.setCharacterEncoding("utf-8");
  
  String oper = request.getParameter("oper");
  String id = request.getParameter("id");
  
  String pid = request.getParameter("pid");
  String type = request.getParameter("type");
  String title = request.getParameter("title");
  String valueField = request.getParameter("valueField");
  String categoryField = request.getParameter("categoryField");
  String dataSource = request.getParameter("dataSource");
  String displayName = request.getParameter("displayName");
  String refreshTime = request.getParameter("refreshTime");
 
  if(oper.equals("del")){
   chartDao.deleteChartById(Integer.parseInt(id));
  }else{
   Chart chart = new Chart();
   chart.setCategoryField("kpiTime");
   chart.setDisplayName(displayName);
   chart.setPid(Integer.parseInt(pid));
   chart.setValueField(valueField);
   chart.setTitle(title);
   chart.setType(type);
   chart.setDataSource(dataSource);
   chart.setRefreshTime(Integer.parseInt(refreshTime));
   
   if(oper.equals("edit")){
    chartDao.updateChartByObj(chart,Integer.parseInt(id));
   }else if(oper.equals("add")){
    chartDao.insertNewChart(chart);
   }
  }
 }