<!DOCTYPE html>

 <html>

 <head>

     <meta charset="utf-8" />

     <meta http-equiv="X-UA-Compatible" content="IE=edge">

     <title>Page Title</title>

     <meta name="viewport" content="width=device-width, initial-scale=1">

    <link rel="stylesheet" type="text/css" href="http://www.jeasyui.net/Application/Home/View/Public/js/easyui/themes/default/easyui.css    ">

    <link rel="stylesheet" type="text/css" href="http://www.jeasyui.net/Application/Home/View/Public/js/easyui/themes/icon.css">

     <script type="text/javascript"  src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js"></script>

     <script type="text/javascript" src="http://www.jeasyui.net/Application/Home/View/Public/js/easyui/jquery.easyui.min.js"></script>

 </head>

 <body>

 <table id="dg" class="easyui-datagrid" style="width: auto; height: 350px;"></table>

 </body>

 <script>

     $("#dg").datagrid({

         iconCls: "icon-add",

         fitColumns: false,

         loadMsg: "数据加载中......",

         data:[ { "productid": "K9-DL-01", "unitcost": , "status": "P", "listprice": , "attr1": "Spotted Adult Female", "itemid": "EST-10" }, { "productid": "RP-SN-01", "unitcost": , "status": "P", "listprice": , "attr1": "Venomless", "itemid": "EST-11" }, { "productid": "RP-SN-01", "unitcost": , "status": "P", "listprice": , "attr1": "Rattleless", "itemid": "EST-12" }, { "productid": "RP-LI-02", "unitcost": , "status": "P", "listprice": , "attr1": "Green Adult", "itemid": "EST-13" }, { "productid": "FL-DSH-01", "unitcost": , "status": "P", "listprice": , "attr1": "Tailless", "itemid": "EST-14" }, { "productid": "FL-DSH-01", "unitcost": , "status": "P", "listprice": , "attr1": "With tail", "itemid": "EST-15" }, { "productid": "FL-DLH-02", "unitcost": , "status": "P", "listprice": , "attr1": "Adult Female", "itemid": "EST-16" }, { "productid": "FL-DLH-02", "unitcost": , "status": "P", "listprice": , "attr1": "Adult Male", "itemid": "EST-17" }, { "productid": "AV-CB-01", "unitcost": , "status": "P", "listprice": , "attr1": "Adult Male", "itemid": "EST-18" }, { "productid": "AV-CB-03", "unitcost": , "status": "P", "listprice": , "attr1": "Adult Male", "itemid": "EST-134" }] ,

         pagination: true,

         rownumbers: true,

         nowrap: false,

         showFooter: true,

         singleSelect: true,

         columns: [[

             {

                 field: 'itemid', title: '编号', width: , align: 'center',

                 formatter: function (value, row, index) {

                     return " <a href='javascript:void(0)' onclick='return LoadUserInfo()'>" + value + "</a>";

                 }

             },

             {

                 field: 'productid', title: '用户名', width: , align: 'center',

             },

             {

                 field: 'listprice', title: '姓名', width: , align: 'center',

             },

             {

                 field: 'unitcost', title: '操作', width: , align: 'center',

             },

             {

                 field: 'attr1', title: '操作', width: , align: 'center',

             },

             {

                 field: 'status', title: '操作', width: , align: 'center',

             }

         ]]

     })

 </script>

 </html>

EasyUI datagrid 一个可以 直接运行例子一个文件 六的更多相关文章

  1. 谈谈easyui datagrid 的数据加载(转)

    这篇文章只谈jQuery easyui datagrid 的数据加载,因为这也是大家谈论最多的内容.其实easyui datagrid加载数据只有两种方式:一种是ajax加载目标url返回的json数 ...

  2. [转载]再次谈谈easyui datagrid 的数据加载

    这篇文章只谈jQuery easyui datagrid 的数据加载,因为这也是大家谈论最多的内容.其实easyui datagrid加载数据只有两种方式:一种是ajax加载目标url返回的json数 ...

  3. 再次谈谈easyui datagrid 的数据加载

    from:http://www.easyui.info/archives/204.html 这篇文章只谈jQuery easyui datagrid 的数据加载,因为这也是大家谈论最多的内容.其实ea ...

  4. 谈谈easyui datagrid 的数据加载

    文章目录 1url方式加载数据 1.1调用方式 1.2相关方法 1.3二次加载问题 2加载本地数据方式 2.1调用方式 2.2如何分页 2.3加载中效果 2.4如何不统计总数 这篇文章只谈jQuery ...

  5. 对easyui datagrid组件的一个小改进

    #对easyui datagrid组件的一个小改进 ##问题 在实际项目中使用datagrid时,受版面限制,有时候表格不能太大,这时候表格里面的内容就不能完全显示,用户需要经常拖动调整列宽才能看完整 ...

  6. 一个简单的CORBA例子

    因为对CORBA分析的需要,这里写一个简单的CORBA例子.从JDK1.2开始,JDK中集成了ORB的实现,本例子使用了JDK1.7,对于JDK1.2+应该都没有问题.这个例子实现一个简单的加减乘除的 ...

  7. 轻松创建nodejs服务器（1）：一个简单nodejs服务器例子

    这篇文章主要介绍了一个简单nodejs服务器例子,本文实现了一个简单的hello world例子,并展示如何运行这个服务器,需要的朋友可以参考下   我们先来实现一个简单的例子,hello world ...

  8. Spark认识&环境搭建&运行第一个Spark程序

    摘要:Spark作为新一代大数据计算引擎,因为内存计算的特性,具有比hadoop更快的计算速度.这里总结下对Spark的认识.虚拟机Spark安装.Spark开发环境搭建及编写第一个scala程序.运 ...

  9. 使用Multiplayer Networking做一个简单的多人游戏例子-2/3（Unity3D开发之二十六）

    猴子原创,欢迎转载.转载请注明: 转载自Cocos2Der-CSDN,谢谢! 原文地址: http://blog.csdn.net/cocos2der/article/details/51007512 ...

随机推荐

  1. Win10系列：UWP界面布局进阶5

    提示框 在Windows应用商店应用程序中可以使用提示框来向用户显示提示信息,例如可以通过对话框来询问用户当前需要执行的操作,还可以通过弹出窗口来显示需要注意的信息.本节将向读者介绍如何在Window ...

  2. Win10系列：VC++媒体播放控制1

    在MediaElement控件中定义了用于控制视频播放的函数,如Play.Pause和Stop等函数.本小节将在20.6.1小节所新建的项目基础上继续来介绍如何为视频添加播放控制,并在最后一部分给出项 ...

  3. mybatis generator工具的使用

    mybatis反转数据库的配置文件: generatorConfig.xml: <?xml version="1.0" encoding="UTF-8"? ...

  4. svn服务器搭建及使用（二）

    上一篇介绍了VisualSVN Server和TortoiseSVN的下载,安装,汉化.这篇介绍一下如何使用VisualSVN Server建立版本库,以及TortoiseSVN的使用. 首先打开Vi ...

  5. Linux 最小安装常用包

    Linux最小安装后很多常用的工具都没有,但直接通过yum install 文件名的方式可能无法找到,汇总于此,随时更新: CentOS7 1.如果要通过SecureCRT上直接上传下载文件,最简单的 ...

  6. Cracking The Coding Interview 2.0 单链表

    #include <iostream> #include <string> using namespace std; class linklist { private: cla ...

  7. 2.17 C++类与const关键字

    参考: http://www.weixueyuan.net/view/6348.html 总结: const成员变量的初始化只有唯一的一条途径:参数初始化表. const成员函数可以使用类中的所有成员 ...

  8. SQL-33 创建一个actor表，包含如下列信息

    题目描述   创建一个actor表,包含如下列信息 列表 类型 是否为NULL 含义 actor_id smallint(5) not null 主键id first_name varchar(45) ...

  9. 二、求水仙花数，打印出100-999之间所有的"水仙花数"

    所谓"水仙花数"是指一个三位数,其各位数字立方和等于该数本身. 例如:153是一个"水仙花数",因为153=1的三次方+5的三次方+3的三次方 public c ...

  10. Problem D: 求(x-y+z)*2

    Description 编写一个程序,求解以下三个函数: f(x,y,z)=2*(x-y+z) f(x,y)  =2*(x-y) f(x)    =2*(x-1) 函数调用格式见append.cc. ...