<!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. POJ 1390 Blocks(记忆化搜索+dp)

    POJ 1390 Blocks 砌块 时限:5000 MS   内存限制:65536K 提交材料共计: 6204   接受: 2563 描述 你们中的一些人可能玩过一个叫做“积木”的游戏.一行有n个块 ...

  2. 【配置】pom.xml的配置

    pom.xml的配置: 地址:https://mvnrepository.com/ 示例:配置log4j 1.在搜索框中搜索log4j 2.在搜索结果页点击log4j 3.选择一个最新的版本,点击 4 ...

  3. learning ddr3 protocol

    refercece:  www.jedec.org https://www.cnblogs.com/zhongguo135/p/8486979.html : 

  4. Ubuntu下如何访问Windows磁盘？

    有些同学的电脑原来是Windows系统的,但为了需要,又下载了一个Ubuntu系统,变成双系统的电脑. 但是,在Ubuntu下,Windows的磁盘是打不开的,用网盘或者U盘又是很不方便,所以ljn教 ...

  5. Java遍历集合的几种方法分析（实现原理、算法性能、适用场合）

    概述 Java语言中,提供了一套数据集合框架,其中定义了一些诸如List.Set等抽象数据类型,每个抽象数据类型的各个具体实现,底层又采用了不同的实现方式,比如ArrayList和LinkedList ...

  6. Express工作原理和源码分析一：创建路由

    Express是一基于Node的一个框架,用来快速创建Web服务的一个工具,为什么要使用Express呢,因为创建Web服务如果从Node开始有很多繁琐的工作要做,而Express为你解放了很多工作, ...

  7. Docker小白从零入门到实战系列【二】

    1.安装好Centos 7 2.关闭SELINUX sed -i 's#SELINUX=enforcing#SELINUX=disabled#g' /etc/selinux/configsetenfo ...

  8. bootstrap table 列求和

    <div class="modal fade in" id="_modalDialog" tabindex="1" role=&quo ...

  9. 网口扫盲三:以太网芯片MAC和PHY的关系（转）

      问:如何实现单片以太网微控制器? 答:诀窍是将微控制器.以太网媒体接入控制器(MAC)和物理接口收发器(PHY)整合进同一芯片,这样能去掉许多外接元器件.这种方案可使MAC和PHY实现很好的匹配, ...

  10. 1.Python爬虫入门一之综述

    要学习Python爬虫,我们要学习的共有以下几点: Python基础知识 Python中urllib和urllib2库的用法 Python正则表达式 Python爬虫框架Scrapy Python爬虫 ...