如何用easy-ui显示两张表的数据而且实现两张表的增,删,改。

来源:互联网 发布:图片调整软件 编辑:程序博客网 时间:2024/05/22 10:56

在script中定义两个datagrid,如下var datagrid;var datagrid1;两个datagrid

用来显示两张表的数据!

<script type="text/javascript">
var datagrid;
var datagrid1;
$(function() {
  datagrid = $('#Content_MyJsp_grid').datagrid({
   url : '${pageContext.request.contextPath}/contentsAction!show.action',
   pagination : true,
   pagePosition : 'bottom',
   pageSize : 10,
   pageList : [ 10, 20, 30, 40 ],
   fit : true,
   fitColumns : false,
   nowrap : false,
   border : false,
   idField : 'id',
   checkOnSelect : true,
   selectOnCheck : true,
   singleSelect : true,
   frozenColumns : [ [ {
    title : 'id',
    field : 'cid',
    width : 150,
    sortable : true,
    checkbox : true,
  
   } ] ],
   columns : [ [ {
    title : '目录名称',
    field : 'cname',
    width : 150
   } ] ],
   toolbar : [ {
    text : '增加',
    iconCls : 'icon-add',
    handler : function() {
     appendContent();
    }
   }, '-', {
    text : '删除',
    iconCls : 'icon-remove',
    handler : function() {
     removeContent();
    }
   }, '-', {
    text : '修改',
    iconCls : 'icon-edit',
    handler : function() {
     editContent();
    }
   }, '-' ],
   onRowContextMenu : function(e, rowIndex, rowData) {
    e.preventDefault();
    $(this).datagrid('unselectAll');
    $(this).datagrid('selectRow', rowIndex);
    $('#bullamacow_bullamacowVaccinum_menu').menu('show', {
     left : e.pageX,
     top : e.pageY
    });
   }
  });
  //下面是关于datagrid的现实;
  datagrid1 = $('#Type_MyJsp_grid').datagrid({
   url : '${pageContext.request.contextPath}/typeAction!show.action',
   pagination : true,
   pagePosition : 'bottom',
   pageSize : 10,
   pageList : [ 10, 20, 30, 40 ],
   fit : true,
   fitColumns : false,
   nowrap : false,
   border : false,
   idField : 'id',
   checkOnSelect : true,
   selectOnCheck : true,
   frozenColumns : [ [ {
    title : 'id',
    field : 'cid',
    width : 150,
    sortable : true,
    checkbox : true
   //加上checkbox就可以进行勾选框了
   } ] ],
   columns : [ [ {
    title : '型号',
    field : 'ctype',
    width : 150
   }, {
    title : '所属目录',
    field : 'content',
    width : 150
   } ] ],
   toolbar : [ {
    text : '增加',
    iconCls : 'icon-add',
    handler : function() {
     appendType();
    }
   }, '-', {
    text : '删除',
    iconCls : 'icon-remove',
    handler : function() {
     removeType();
    }
   }, '-', {
    text : '修改',
    iconCls : 'icon-edit',
    handler : function() {
     editType();
    }
   }, '-' ],
   onRowContextMenu : function(e, rowIndex, rowData) {
    e.preventDefault();
    $(this).datagrid('unselectAll');
    $(this).datagrid('selectRow', rowIndex);
    $('#bullamacow_bullamacowVaccinum_menu').menu('show', {
     left : e.pageX,
     top : e.pageY
    });
   }
  });
});