`
youlong05
  • 浏览: 147730 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

EC tags

    博客分类:
  • AJAX
阅读更多
一、简介
Extreme Table是最功能强大而又容易配置,扩展,自定义的Table 控件。
最主要的功能包括排序, 分页, 导出Excel, pdf和汇总

官方网站:
http://www.extremecomponents.org
ExtremeTable自带的文档:
http://extremecomponents.org/wiki/index.php/Main_Page
Luck翻译的ExtremeTable官方文档中文版:
http://extremecomponents.org/wiki/index.php/Simplified_Chinese

二、简单示例
1,将extremecomponents.jar丢入WEB-INF/lib
2,将SpringSide与ec的相关images丢入/resources/images/table
3,将SpringSide的extremecomponents.css丢入/resources/css
4,将SpringSide的extremetable.properties丢入classpath,如src-conf/table
5,extremecomponents.css:
/*ExtremeTable专用Style*/
.eXtremeTable {
margin: 0;
padding: 0;
}

.eXtremeTable select {
font-family: verdana, arial, helvetica, sans-serif;
font-size: 12px;
border: solid 1px #EEE;
width: 75px;
}

.eXtremeTable .tableRegion {
border: 1px solid #AAC2D9;
padding: 2px;
font-size: 12px;
margin-top: 7px;
}

.eXtremeTable .filter {
background-color: #F4F4F4;
}

.eXtremeTable .title {
color: #1a7cdf;
vertical-align: middle;
font-size: 18px;
font-weight: bold;

}

.eXtremeTable .titleRow {
background-color: #F4F4F4;
}

.eXtremeTable .titleRow td {
border-bottom: 1px solid #308dbb;
padding-top: 2px;
padding-bottom: 2px;
vertical-align: middle;
}

.eXtremeTable .titleRow span {
color: #444444;
font-weight: bold;
font-size: 12px;
}

.eXtremeTable .filter input {
font-size: 12px;
width: 100%;
}

.eXtremeTable .filter select {
font-size: 9px;
border: solid 1px #EEE;
width: 100%;
}

.eXtremeTable .tableHeader {
background-color: #308dbb;
color: white;
font-size: 12px;
font-weight: bold;
text-align: left;
padding-right: 3px;
padding-left: 3px;
padding-top: 4px;
padding-bottom: 4px;
margin: 0px;
border-right: 1px solid white;
background-image: url( "../images/tableTopbg.gif" );
}

.eXtremeTable .tableHeaderSort {
background-color: #3a95c2;
color: white;
font-size: 12px;
font-weight: bold;
text-align: left;
padding-right: 3px;
padding-left: 3px;
padding-top: 4px;
padding-bottom: 4px;
white-space: nowrap;
border-right: 1px solid white;
background-image: url( "../images/tableTopbg.gif" );
}

.eXtremeTable .odd a, .even a {
color: Black;
font-size: 12px;
}

.eXtremeTable .odd td, .eXtremeTable .even td {
vertical-align: middle;
font-size: 12px;

padding-right: 3px;
padding-left: 3px;
padding-top: 4px;
padding-bottom: 4px;
border-bottom: 1px solid #CADAE8;
border-right: 1px solid #DAE6EF;
}

.eXtremeTable .odd {
background-color: #FFFFFF;
}

.eXtremeTable .even {
background-color: #F8F8F8;
}

.eXtremeTable .highlight td {
color: black;
font-size: 12px;
vertical-align: middle;
background-color: #fdecae;

padding-right: 3px;
padding-left: 3px;
padding-top: 4px;
padding-bottom: 4px;
border-bottom: 1px solid #CADAE8;
border-right: 1px solid #DAE6EF;
}

.eXtremeTable .highlight a, .highlight a {
color: black;
font-size: 12px;
}

.eXtremeTable .toolbar {
background-color: #FFFFFF;
font-size: 12px;
border-right: 1px solid silver;
border-left: 1px solid silver;
border-top: 1px solid silver;
border-bottom: 1px solid silver;
}

.eXtremeTable .toolbar td {
color: #444444;
padding: 0px 3px 0px 3px;
text-align: center;
}

.eXtremeTable .separator {
width: 7px;
}

.eXtremeTable .statusBar {
background-color: #FFFFFF;
font-size: 12px;
}

.eXtremeTable .filterButtons {
background-color: #F4F4F4;
text-align: right;
}

.eXtremeTable .title span {
margin-left: 7px;
}

.eXtremeTable .formButtons {
display: block;
margin-top: 10px;
margin-left: 5px;
}

.eXtremeTable .formButton {
cursor: pointer;
font-size: 12px;
font-weight: bold;
background-color: #308dbb;
color: white;
margin-top: 5px;
border: outset 1px #333;
vertical-align: middle;
}

.eXtremeTable .calcRow {
background-color: #FFFFFF;
}

.eXtremeTable .calcRow td {
background-color: #FFFFFF;
border-top: 1px solid #cccccc;
border-right: 1px solid #cccccc;
}

.eXtremeTable .calcTitle {
font-weight: bold;
font-size: 12px;
}

.eXtremeTable .calcResult {
font-size: 12px;
}
6,extremetable.properties:
table.filterable=false
table.imagePath=/resources/images/table/*.gif
table.locale=zh_CN
table.view.html=org.extremecomponents.table.view.CompactView

row.highlightRow=true

column.format.date=yyyy-MM-dd
column.format.currency=###,###,###,###,#00.00
7,以listBlog为例:
public void onList(HttpServletRequest request,
HttpServletResponse response, ModelAndView mav) throws Exception {
Limit limit = ExtremeTablePage.getLimit(request, defaultPageSize);
Page page = commonManager.findBy(Blog.class, null,
ExtremeTablePage.getSort(limit), limit.getPage(),
limit.getCurrentRowsDisplayed());
mav.addObject("blogList", page.getResult());
mav.addObject("totalRows", page.getTotalCount());
}
8,Page和上面介绍pager时的Page类一样
9,ExtremeTablePage:
package com.itone.hibernate.util;

import java.util.HashMap;
import java.util.Map;

import javax.servlet.http.HttpServletRequest;

import org.extremecomponents.table.context.Context;
import org.extremecomponents.table.context.HttpServletRequestContext;
import org.extremecomponents.table.limit.Limit;
import org.extremecomponents.table.limit.LimitFactory;
import org.extremecomponents.table.limit.Sort;
import org.extremecomponents.table.limit.TableLimit;
import org.extremecomponents.table.limit.TableLimitFactory;

import com.itone.common.support.Constants;

/**
* 辅助ExtremeTable获取分页信息的Util类
*
* @author calvin
*/
public class ExtremeTablePage {

static public Limit getLimit(HttpServletRequest request) {
return getLimit(request, Constants.DEFAULT_PAGE_SIZE);
}

/**
* 从request构造Limit对象实例.
* Limit的构造流程比较不合理,为了照顾export Excel时忽略信息分页,导出全部数据
* 因此流程为程序先获得total count, 再使用total count 构造Limit,再使用
limit中的分页数据查询分页数据
* 而SS的page函数是在同一步的,无法拆分,再考虑到首先获得的totalCount
*/
static public Limit getLimit(HttpServletRequest request, int defautPageSize) {
Context context = new HttpServletRequestContext(request);
LimitFactory limitFactory = new TableLimitFactory(context);
TableLimit limit = new TableLimit(limitFactory);
limit.setRowAttributes(1000000000, defautPageSize);
return limit;
}

/**
* 将Limit中的排序信息转化为Map{columnName,升序/降序}
*/
static public Map getSort(Limit limit) {
Map sortMap = new HashMap();
if (limit != null) {
Sort sort = limit.getSort();
if (sort != null && sort.isSorted()) {
sortMap.put(sort.getProperty(), sort.getSortOrder());
}
}
return sortMap;
}
}
10,commonManager.findBy(args)用到SpringSide的BaseHibernateDao并有扩展:
public Page findBy(Class clazz, Map filterMap, Map orderMap, int pageNo, int
pageSize, CriteriaSetup criteriaSetup) {

Criteria criteria = null;

if(clazz == null) {

criteria = getSession().createCriteria(getEntityClass());

} else {

criteria = getSession().createCriteria(clazz);

}

if (!CollectionUtils.isEmpty(filterMap)) {
try {
criteriaSetup.setup(criteria, filterMap);
} catch (Exception e) {
}
}

if (!CollectionUtils.isEmpty(orderMap))
sortCriteria(criteria, orderMap, null);

criteria.setResultTransformer(CriteriaSpecification.ROOT_ENTITY);

return pagedQuery(criteria, pageNo, pageSize);
}
11,listBlog.jsp:
<%@ taglib prefix="ec" uri="http://www.extremecomponents.org%>
<link href="/resources/css/extremecomponents.css" rel="stylesheet"
type="text/css">
<ec:table
var="blog"
items="blogList"
action="/blog.do"
retrieveRowsCallback="limit"
sortRowsCallback="limit"
rowsDisplayed="10">
<ec:row>

<ec:column property="name" title="博客名称"/>

<ec:column property="user.name" title="博客作者" alias="userName"/>

<ec:column property="description" title="描述"/>

<ec:column property="edit" title="操作" sortable="false" viewsAllowed="html">

<a href="blog.do?method=edit&id=${blog.id}">

编辑

</a>

</ec:column>
</ec:row>
</ec:table>
12,web.xml
<context-param>
<param-name>extremecomponentsPreferencesLocation</param-name>
<param-value>/table/extremetable.properties</param-value>
</context-param>
分享到:
评论

相关推荐

    struts中ec标签的使用

    - 在使用EC标签时,需要正确导入对应的命名空间,例如`&lt;%@ taglib prefix="ec" uri="http://struts.apache.org/tags-ext" %&gt;`. - 在Struts配置文件(struts-config.xml)中,为EC标签库定义一个对应的action-mapping...

    ec2tags:将 AWS EC2 实例标签作为环境变量返回的小型 golang 程序

    ec2tags 标记 AWS EC2 实例,特别是通过自动缩放组,是传达有关实例的角色和预期行为的信息的好方法。 这个简单的脚本使实例能够发现自己的标签并将它们写入环境变量以供应用程序使用。下载 curl -L ...

    ec2-tags-env:将AWS EC2标记导入为环境变量

    EC2-Tags-Env是一个实用工具,主要用于将Amazon Web Services (AWS) 的EC2实例的标签转换为环境变量。在云环境中,EC2实例的标签是管理资源、组织和自动化工作流程的重要方式。通过将这些标签转化为环境变量,开发者...

    ec2tags:从 EC2 实例复制标签并将它们添加到相关资源,例如卷

    ec2tags 从 EC2 实例复制标签并将它们添加到相关资源,例如卷 此代码只是一个早期试用版,它使用以“Product”字符串开头的标签进行了硬编码,但可以随时对其进行改进。 为了使用它,必须在 aws cli 工具配置文件...

    mina-ec2:使用 Mina 部署到 EC2 实例,使用标签查找机器

    set :ec2_settings, { regions: %w{eu-west-1}, access_key_id: ENV['AWS_ACCESS_KEY_ID'], secret_access_key: ENV['AWS_SECRET_ACCESS_KEY_ID']}过滤实例设置标签以通过以下方式查找您的实例: set :ec2_tags, { ...

    libcluster_ec2

    默认的Tags策略使用查询EC2 DescribeInstances API端点。 应该将此访问权授予EC2实例配置文件。 有关其他配置选项,请参阅ExAws文档。 config :libcluster, topologies: [ example: [ strategy: ClusterEC2....

    ectable的基本用法

    "Ectable 的基本用法" Ectable 是一个功能强大的表格控件,提供了许多实用的...&lt;ec:table …………………… saveFilterSort="true"&gt;&lt;/ec:table&gt; ``` 这样,Ectable 将保存 filter 和 sort 参数,直到用户关闭浏览器。

    PHP关于htmlspecialchars、strip_tags、addslashes的解释

    PHP的htmlspecialchars、strip_tags、addslashes是网页程序开发中常见的函数,今天就来详细讲述这些函数的用法: 1.函数strip_tags:去掉 HTML 及 PHP 的标记 注意:本函数可去掉字串中包含的任何 HTML 及 PHP 的...

    awstaghelper:AWS批量标记工具

    目录使用范例正在安装从下载最新的二进制文件入门Ec2获取ec2标签获取带有必需标签的ec2列表awstaghelper ec2 get-ec2-tags 示例: awstaghelper ec2 get-ec2-tags --filename ec2Tag.csv --tags Name,Owner --...

    aws-ec2-ssh:根据标签名称从EC2和SSH检索所有活动实例

    AWS-EC2-SSH处理AWS密钥选项使用...添加名为AWS_ACCESS_KEY_ID和AWS_SECRET_ACCESS_KEY的环境变量检索所有活动实例$ aws-ec2-ssh --active 输出: Tags Public DNS Name IP Address Type Launch Time------------------

    [JSON解析与生成 / 哈希表]Quick And Simple EC

    提供了DOM风格的JSON相关接口,纯易语言实现,提供了迭代支持。兼容JSON5,因此你可以用JSON5扩展特性,如:注释。支持所有标准JSON,支持空字符(即"\u0000",需用 文本_字节集,置文本_字节集 等...Tags:JSON解析。

    node-ec2-instances

    { Tags : [ { Key : 'Purpose' , Value : 'MyApp' } , { Key : 'Environment' , Value : 'production' } , { Key : 'Name' , Value : 'myapp-db-node1' } ] , } 例子 请参阅以获取输出的代码: { production:...

    aws_ec2_instance

    tags = { Name = "example-instance" # 添加自定义标签 } } resource "aws_security_group" "example" { name = "example-sg" description = "Allow all inbound traffic" ingress { from_port = 0 to_...

    chef-aws-tag:使用 Opsworks 在 ec2 实例上设置标签

    "tags": { "ouid": "917736014", "team": "webdev", "email": "email@company.com", "app": "Awesome App", "environment": "dev", "availability": "on" } } } 确保使用的 EC2 实例配置文件具有 ...

    tf_aws_ec2_instance:[已弃用]使用https

    ec2_instance terraform... 启动实例时,Terraform将包含此文件的内容tags -用于设置AWS标签的地图。用法您可以通过以下步骤在terraform模板中使用它。 在模板中添加模块资源,例如main.tf module "ec2_instance" {

    APlayer模块源码 媒体播放引擎

    APlayer模块源码 媒体播放引擎。解码库自行下载放到源码同目录。全媒体文件格式支持 (rmvb/avi/mkv/mov/mpg/mp3/mp4/mpa/wmv/wma/flv/xv/ts/divx/xvid/ogg/ogm等)。@火云邪神。Tags:APlayer模块源码。

    Atlassian-Stash-Ansible:使用默认选项自动安装 Stash 的 Ansible play

    #介绍 这套剧本应该启动 c3.large EC2 和 db.t2.small RDS 实例,下载并安装 Atlassian Stash,在 Route53 中创建 DNS ...~/Downloads/ec2-api-tools-1.7.2.2/bin/ec2-create-tags ansible 版本 [dvaida@scat Atlassi

    awls-py:在外壳中查找EC2实例信息的简单工具

    锥子在外壳中查找EC2实例信息的简单工具用法awls -husage: awls [-h] [--profile PROFILE] [--region REGION] [--maintenance_tags] [N]Interrogate AWS EC2 and return pretty datapositional arguments: N Search ...

    AWS亚马逊SAA助理架构师最新题库中文版2019最新4/20

    - **AutoScaling Group**: 定义了一组EC2实例的集合,包括最小、最大实例数量等,但具体实例类型是由启动配置来决定的。 - **AutoScaling Tags**: 用于给自动扩展组内的实例添加标签,与实例类型的更改无关。 - **...

Global site tag (gtag.js) - Google Analytics