一，效果图。

二，源代码。

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Group DataList - jQuery EasyUI Demo</title>
<link rel="stylesheet" type="text/css" href="http://www.jeasyui.com/easyui/themes/default/easyui.css">
<link rel="stylesheet" type="text/css" href="http://www.jeasyui.com/easyui/themes/icon.css">
<link rel="stylesheet" type="text/css" href="http://www.jeasyui.com/easyui/demo.css">
<script type="text/javascript" src="http://www.jeasyui.com/easyui/jquery.min.js"></script>
<script type="text/javascript" src="http://www.jeasyui.com/easyui/jquery.easyui.min.js"></script>
</head>
<body>
<h2>Group DataList</h2>
<p>This example shows how to display items in groups.</p>
<div style="margin:20px 0"></div>
<div id="#dglist" class="easyui-datalist" title="Group DataList" style="width:400px;height:250px" data-options="
method: 'get',
groupField: 'group'
">
</div>

<script type="text/javascript">

$().ready(function(){

$("#dglist").datalist({data:[
{"text":"Epson WorkForce 845","group":"Printer"},
{"text":"Canon PIXMA MG5320","group":"Printer"},
{"text":"HP Deskjet 1000 Printer","group":"Printer"},
{"text":"Cisco RV110W-A-NA-K9","group":"Firewall"},
{"text":"ZyXEL ZyWALL USG50","group":"Firewall"},
{"text":"NETGEAR FVS318","group":"Firewall"},
{"text":"Logitech Keyboard K120","group":"Keyboard"},
{"text":"Microsoft Natural Ergonomic Keyboard 4000","group":"Keyboard"},
{"text":"Logitech Wireless Touch Keyboard K400","group":"Keyboard"},
{"text":"Logitech Gaming Keyboard G110","group":"Keyboard"},
{"text":"Nikon COOLPIX L26 16.1 MP","group":"Camera"},
{"text":"Canon PowerShot A1300","group":"Camera"},
{"text":"Canon PowerShot A2300","group":"Camera"}

]
});

});

</script>
</body>
</html>

Group DataList的更多相关文章

  1. easyui datalist按组多选

    结果如下: 数据样式如下: [ {"text":"Epson WorkForce 845","group":"Printer&qu ...

  2. Android之ExpandableListView的属性（Group不展开）

    1. 设置ExpandableListView 默认是展开的:  先实例化exListView 然后 exListView.setAdapter(exlvAdapter); //遍历所有group,将 ...

  3. Mysql按日期分组（group by）查询统计的时候，没有数据补0的解决办法

    转载自:http://blog.csdn.net/jie11447416/article/details/50887888 1.案例中的数据结构和数据如下 2.在没有解决的时候,是这样的   SELE ...

  4. LINQ Group By操作

    在上篇文章 .NET应用程序与数据库交互的若干问题 这篇文章中,讨论了一个计算热门商圈的问题,现在在这里扩展一下,假设我们需要从两张表中统计出热门商圈,这两张表内容如下: 上表是所有政区,商圈中的餐饮 ...

  5. 利用HTML5 的Datalist 元素实现输入提示

    HTML5有无限可能,总是在释出一些新鲜实用的功能,让原生的web环境更加炫酷. 今天看到datalist 这个元素,可以用来预先定义一个输入框的潜在选项,也就是我们在平时项目中经常用jQuery插件 ...

  6. Kafka消费组(consumer group)

    一直以来都想写一点关于kafka consumer的东西,特别是关于新版consumer的中文资料很少.最近Kafka社区邮件组已经在讨论是否应该正式使用新版本consumer替换老版本,笔者也觉得时 ...

  7. LINQ to SQL语句(6)之Group By/Having

    适用场景:分组数据,为我们查找数据缩小范围. 说明:分配并返回对传入参数进行分组操作后的可枚举对象.分组:延迟 1.简单形式: var q = from p in db.Products group ...

  8. 学习笔记 MYSQL报错注入(count()、rand()、group by)

    首先看下常见的攻击载荷,如下: select count(*),(floor(rand(0)*2))x from table group by x; 然后对于攻击载荷进行解释, floor(rand( ...

  9. [备查]使用 SPQuery 查询 "Person or Group" 字段

    原文地址:http://www.stum.de/2008/02/06/querying-the-person-or-group-field-using-spquery/ Querying the “P ...

随机推荐

  1. 理解Python的with as语句

    简单的说, with open(filepath, 'wb') as file: file.write("something") 等价于: file = open(filepath ...

  2. [LeetCode]题解（python）：105-Construct Binary Tree from Preorder and Inorder Traversal

    题目来源: https://leetcode.com/problems/construct-binary-tree-from-preorder-and-inorder-traversal/ 题意分析: ...

  3. 【转】IOS 输入框被键盘遮盖的解决方法

    做IOS开发时,难免会遇到输入框被键盘遮掩的问题.上网上搜索了很多相关的解决方案,看了很多,但是由衷的觉得太麻烦了. 有的解决方案是将视图上的所有的东西都添加到一个滚动视图对象( UIScrollVi ...

  4. 转: Nodejs概述

    目录 简介 安装与更新 版本管理工具nvm 基本用法 REPL环境 异步操作 全局对象和全局变量 模块化结构 概述 核心模块 自定义模块 fs模块 Stream模式 http模块 实例:搭建一个HTT ...

  5. 提高IOS开发效率的常用网站、开源类库及工具

    时间过得很快,学习iOS也已经2年左右了.在这里整理一下,在平台平常开发过程中使用比较多的开源类库.网站与工具吧! 一.网站: UI网站: 1.https://www.cocoacontrols.co ...

  6. 【C++学习笔记】继承与派生基础概念

    面向对象的程序设计主要有四个特点:抽象.封装.继承和多态.其中继承是我认为最最重要的一个特性,可以说继承是面向对象的精华所在. 举一个继承的浅显易懂的例子:假如我们已经有了一个“马”的类,其中成员变量 ...

  7. Android记录4--自定义ToggleButton+用SharedPreferences保存用户配置

    Android记录4--自定义ToggleButton+用SharedPreferences保存用户配置 2013年8月14日Android记录 很多应用都会有用户设置,用户的一些偏好可以由用户来决定 ...

  8. android adb经常使用的命令

    1.adb--- 订购屏幕截取  :adb shell screencap -p | sed 's/\r$//' > outputs.png 2.jni ---命令    :$NDK/ndk-b ...

  9. 关于php析构函数__destruct()的问题

    1.背景:在一次输出错误信息,引入Componets\下的ErrorCode的类文件报错,报错的信息是该类找不到:然而那个类文件明明存在的阿,怎么会报错呢? 2.解决过程:看类加载器如何加载该类.通过 ...

  10. C#_会员管理系统：开发八（权限分配）

    数据库设计 这里由于增加了普通用户权限值,我们需要对数据库结构稍作修改.这里在MovieAccount表中增加4列内容 分别用于 RightFManager       判断普通用户管理界面权限   ...