代码如下:

  1. <script type="text/javascript">
  2. var datagrid;
  3. $(function(){
  4. $('#datagrid').datagrid({
  5. url:'{:U("Admin/Article/indexjson")}',
  6. title:'',
  7. iconCls:'icon-save',
  8. fit:true,
  9. //下面的page条
  10. pagination:true,
  11. pageSize:14,
  12. pageList:[14,20,30,40,50],
  13. //是否出现横向滚动条
  14. fitColumns:true,
  15. //数据折行
  16. nowrap:false,
  17. border:false,
  18. //帮你记住你选过的,做跨页删除
    1. idField:'id',
    2. columns:[[{
    3. title:'',
    4. field:'ck',
    5. checkbox:true,
    6. width:10,
    7. rowspan:2
    8. },{
    9. title:'ID',
    10. field:'id',
    11. width:50,
    12. rowspan:2,
    13. align:'center'
    14. },{
    15. title:'文章标题',
    16. field:'title',
    17. width:350,
    18. rowspan:2
    19. },{
    20. title:'属性',
    21. align:'center',
    22. colspan:3
    23. },{
    24. title:'所属栏目',
    25. field:'name',
    26. width:150,
    27. rowspan:2
    28. },{
    29. title:'所属专题',
    30. field:'name',
    31. width:150,
    32. rowspan:2
    33. },{
      1. title:'发布时间',
      2. field:'time',
      3. width:150,
      4. align:'center',
      5. rowspan:2
      6. }
      7. ],[
      8. {
      9. title:'推荐',
      10. field:'good',
      11. width:50,
      12. align:'center'
      13. },{
      14. title:'热门',
      15. field:'hits',
      16. width:50,
      17. align:'center'
      18. },{
      19. title:'图',
      20. field:'pic',
      21. width:50,
      22. align:'center'
      23. },
      24. ]],toolbar:"#tb"
      25. });
      26. });
      27. function doSearch(value){
      28. //alert('You input: ' + value);
      29. $('#datagrid').datagrid('load',{
      30. title:$('#tb').find('[name=search]').val()
      31. });
        1. }
        2. function doAdd(){
        3. //alert('You input: ' + value);
        4. }
        5. function doSave(value){
        6. alert('You input: ' + value);
        7. }
        8. function doDel(value){
        9. alert('You input: ' + value);
        10. }
        11. //    function doSearch(value){
        12. //        alert('You input: ' + value);
        13. //    }
        14. </script>

用JavaScript方式创建easyUI datagrid Column Group(列组)的更多相关文章

  1. easyui datagrid Column Group 列组、 复杂表头 嵌套表头 组合表头 (转载)

    核心: rowspan:2   //占两行 colspan:3    //占三列 所有的colspan下的二级列表头,统一放在一个数组里. 文章一: 转载来源:https://blog.csdn.ne ...

  2. 完美实现保存和加载easyui datagrid自定义调整列宽位置隐藏属性功能

    需求&场景 例表查询是业务系统中使用最多也是最基础功能,但也是调整最平凡,不同的用户对数据的要求也不一样,所以在系统正式使用后,做为开发恨不得坐在业务边上,根据他们的要求进行调整,需要调整最多 ...

  3. (转)扩展jquery easyui datagrid 之动态绑定列和数据

    本文转载自:http://blog.csdn.net/littlewolf766/article/details/7336550 easyui datagrid 不支持动态加载列,上次使用的方法是自己 ...

  4. Easyui Datagrid相同连续列合Demo之三

    效果图: html <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> < ...

  5. 扩展-Easyui Datagrid相同连续列合并扩展(一)

    一.autoMergeCellAndCells实现效果 调用方法: function onLoadSuccess(data){     $(this).datagrid("autoMerge ...

  6. EasyUI DataGrid 相同连续列合并

    扩展方法:$.extend($.fn.datagrid.methods, { autoMergeCells: function(jq, fields) { return jq.each(functio ...

  7. DataGrid Column Group (合并表头)

    <thead> <tr> <th colspan=">swjg</th> <th colspan=">swbm</ ...

  8. easyui datagrid自定义操作列

    通过formatter方法给Jquery easyui 的datagrid 每行增加操作链接 我们都知道Jquery的EasyUI的datagrid可以添加并且自定义Toolbar, 这样我们选择一行 ...

  9. easyui datagrid自定义按钮列,即最后面的操作列(转)

    做项目的时候因为需求,要在表格的最后添加一列操作列,easyUI貌似没有提供这种功能,不过没关系,我们可以自定义来实现 版本:jQuery easyUI 1.3.2 这里我的实现方式是采用HTML形式 ...

随机推荐

  1. Swift的两个小窍门

    一:查看Swift版本号(How do I see which version of Swift I’m using in Xcode?) 终端下输入:xcrun swift -version(in ...

  2. UVA11770 - Lighting Away

    题目链接 题意:一个有向图,每对一个结点操作.就能够触发连锁反应,使得该结点及它直接或间接指向的点均获得标记,问至少须要操作多少个结点使得全部结点获得标记 思路:有向图的强连通分量.用Tarjan缩点 ...

  3. ok6410[002] ubuntu1604系统下搭配ckermit和dnw基于RAM的裸机程序调试环境

    ubuntu1604系统下搭配ckermit和dnw基于RAM的裸机程序调试环境 系统:  ubuntu16.04 裸板: 飞凌公司OK6410开发板 目标:搭建基于ubuntu1604系统和基于RA ...

  4. C# winform ListView 的右键菜单的下级菜单的选项视情况禁用方法

    ListView 和右键菜单例如以下图: 要实现功能是: 1.用户状态为[活动]时,改动用户状态为[活动]禁用,反之则反. 2.而且仅仅实用户状态为[非活动]时,[删除学员用户]才是可用状态. 功能非 ...

  5. 惊艳的cygwin——Windows下的Linux命令行环境的配置和使用

    http://www.tuicool.com/articles/2MramqI 时间 2014-07-29 09:28:36  点滴之间 聚沙成金 原文  http://www.path8.net/t ...

  6. Android判断TextView是否超出加省略号

    我们都知道通过指定android:ellipsize="end" android:singleLine="true" 可以让TextView自动截断超出部分并且 ...

  7. shift:解决shell编程中的入渗问题

    我说过了,shell是我的常规武器,目前虽然还不纯熟,但是我爱shell这门语言,在Linux下面混,总要写脚本.程序员是有基因,对编程语言是有偏好的,你让我写C代码,我会觉得很爽,会有困难,会有痛苦 ...

  8. Topcoder SRM 638 DIV 2 (大力出奇迹)

    水题,就是一个暴力.大力出奇迹. Problem Statement   There is a narrow passage. Inside the passage there are some wo ...

  9. contentprovider基础

    程序启动后,只要再manifest当中注册上,就会执行PersonProvider()创建一个对象

  10. vim编辑makefile时临时不展开tab为空格

    可以先敲ctrl-v组合键,再敲tab键,这样就不会被转换成空格了. 给自己的备忘!