一 LigerUI简介
孝义ssl适用于网站、小程序/APP、API接口等需要进行数据传输应用场景,ssl证书未来市场广阔!成为成都创新互联公司的ssl证书销售渠道,可以享受市场价格4-6折优惠!如果有意向欢迎电话联系或者加微信:028-86922220(备注:SSL证书合作)期待与您的合作!
LigerUI 是基于jQuery 的UI框架,其核心设计目标是快速开发、使用简单、功能强大、轻量级、易扩展。简单而又强大,致力于快速打造Web前端界面解决方案,可以应用于.net,jsp,php等等web服务器环境。
LigerUI有如下主要特点:
使用简单,轻量级
控件实用性强,功能覆盖面大,可以解决大部分企业信息应用的设计场景
快速开发,使用LigerUI可以比传统开发减少极大的代码量
易扩展,包括默认参数、表单/表格编辑器、多语言支持等等
支持Java、.NET、PHP等web服务端
支持 IE6+、Chrome、FireFox等浏览器
开源,源码框架层次简单易懂
(PS:以上简介来至官网)
二 一个最简单的Demo
(1)从官网下载最新版的LigerUI,目前的下载地址是:http://pan.baidu.com/s/1dDNAc7Z
(2)新建一个Java web项目,并将LigerUI的一些东西复制到项目中,比如说这样:
(3)最简单的demo,文件名是:demo1.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <% String path = request.getContextPath(); String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + path + "/"; %>"> Insert title here
从上面的代码可以看出,先是引入了几个jquery和ligerui的js文件,然后从用法上来说跟jQuery是很相似的,针对
TextBox进行了简单使用
三 使用本地数据建立表格
ligerGrid可以用来显示表格,ligerGrid绑定数据有两种方式,一是使用本地数据,一是使用服务器数据。其中使用本地数据需要配置data参数;使用服务器数据需要配置url参数,我这里以使用本地数据建立表格来简要说明,也就是上面图中的demo2.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <% String path = request.getContextPath(); String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + path + "/"; %>"> Insert title here
效果如下:
注:上面的Rows表示的是“数据源字段名”,定义在ligerUI/js/plugins/ligerGrid.js这个文件中,包括我们进行数据分页显示时常用到的“pagesize”、“sortname”和“sortorder”也是定义在这个文件中的
因此,在知道了字段名之后我们就可以进行自定义数据源的字段名了,比如说下面这样:
var grid = $("#maingrid").ligerGrid({ checkbox : true, //自定义数据源字段名 root : 'row' , columns : [ { name : 'id', display : '序号', width : 200 }, { name : 'name', display : '名称', width : 400 } ], data : { row : griddata } });
当然,其他的一些字段名也可以根据这个原理进行自定义设置
我的简单介绍就到这里了,想要了解更多可以查看源代码,可以参考这些官网指定的入门文章:http://www.cnblogs.com/leoxie2011/category/291637.html
当然也可以参考官网提供的demo:http://www.ligerui.com/demo.html