在一个项目中用到了extremetable,但是有些的体现形式还不符合业务的需求,所以做了些改动。下面贴出来,供大家参考:
主要增加功能:加入 全选 反选 全不选 的按钮,外观布置改动,增加table的td监听事件。
首先在http://extremecomponents.org/下载eXtremeComponents 1.0.1 的源码
修改org.extremecomponents.table.view.DefaultToolbar如下:
<br />/*<br /> * Copyright 2004 original author or authors.<br /> *<br /> * Licensed under the Apache License, Version 2.0 (the "License");<br /> * you may not use this file except in compliance with the License.<br /> * You may obtain a copy of the License at<br /> *<br /> * http://www.apache.org/licenses/LICENSE-2.0<br /> *<br /> * Unless required by applicable law or agreed to in writing, software<br /> * distributed under the License is distributed on an "AS IS" BASIS,<br /> * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.<br /> * See the License for the specific language governing permissions and<br /> * limitations under the License.<br /> */<br />package org.extremecomponents.table.view;<br /><br />import java.util.Iterator;<br /><br />import org.extremecomponents.table.bean.Export;<br />import org.extremecomponents.table.core.TableModel;<br />import org.extremecomponents.table.view.html.BuilderConstants;<br />import org.extremecomponents.table.view.html.BuilderUtils;<br />import org.extremecomponents.table.view.html.TwoColumnTableLayout;<br />import org.extremecomponents.util.HtmlBuilder;<br /><br />import com.ite.common.system.extremetable.CustomToolbarBuilder;<br /><br />/**<br /> * @author Jeff Johnston<br /> * alter by leo 2007 03 08<br /> */<br />public class DefaultToolbar extends TwoColumnTableLayout {<br /> public DefaultToolbar(HtmlBuilder html, TableModel model) {<br /> super(html, model);<br /> }<br /><br /> protected boolean showLayout(TableModel model) {<br /> boolean showPagination = BuilderUtils.showPagination(model);<br /> boolean showExports = BuilderUtils.showExports(model);<br /> boolean showTitle = BuilderUtils.showTitle(model);<br /> if (!showPagination && !showExports && !showTitle) {<br /> return false;<br /> }<br /><br /> return true;<br /> }<br /><br /> protected void columnLeft(HtmlBuilder html, TableModel model) {<br /> html.td(2).close();<br /> //new TableBuilder(html, model).title();<br /> html.append("选择:<a class=\"check\" href=\"#\" onclick=\"javascript:selectAll();\">全选</a>-");<br /> html.append("<a class=\"check\" href=\"#\" onclick=\"javascript:switchselect();\">反选</a>-");<br /> html.append("<a class=\"check\" href=\"#\" onclick=\"javascript:unselect();\">全不选</a> ");<br /> html.tdEnd();<br /> }<br /><br /> protected void columnRight(HtmlBuilder html, TableModel model) {<br /> boolean showPagination = BuilderUtils.showPagination(model);<br /> boolean showExports = BuilderUtils.showExports(model);<br /><br /> ToolbarBuilder toolbarBuilder = new ToolbarBuilder(html, model);<br /> //CustomToolbarBuilder toolbarBuilder = new CustomToolbarBuilder(html, model);<br /><br /> html.td(2).align("right").close();<br /><br /> html.table(2).border("0").cellPadding("0").cellSpacing("1").styleClass(BuilderConstants.TOOLBAR_CSS).close();<br /><br /> html.tr(3).close();<br /><br /> if (showPagination) {<br /><br /> html.td(4).close();<br /> toolbarBuilder.firstPageItemAsImage();<br /> html.tdEnd();<br /><br /> html.td(4).close();<br /> toolbarBuilder.prevPageItemAsImage();<br /> html.tdEnd();<br /><br /> html.td(4).close();<br /> toolbarBuilder.nextPageItemAsImage();<br /> html.tdEnd();<br /><br /> html.td(4).close();<br /> toolbarBuilder.lastPageItemAsImage();<br /> html.tdEnd();<br /><br /> html.td(4).close();<br /> toolbarBuilder.separator();<br /> html.tdEnd();<br /><br /> html.td(4).close();<br /> html.img();<br /> html.src(BuilderUtils.getImage(model, "pageDisplayed"));<br /> html.style("border:0");<br /> html.alt("当前页码");<br /> html.xclose();<br /> toolbarBuilder.pagesDisplayedDroplist();<br /> html.tdEnd();<br /><br /> html.td(4).close();<br /> toolbarBuilder.separator();<br /> html.tdEnd();<br /> <br /> html.td(4).close();<br /> html.img();<br /> html.src(BuilderUtils.getImage(model, BuilderConstants.TOOLBAR_ROWS_DISPLAYED_IMAGE));<br /> html.style("border:0");<br /> html.alt("每页显示");<br /> html.xclose();<br /> toolbarBuilder.rowsDisplayedDroplist();<br /> html.tdEnd();<br /><br /> if (showExports) {<br /> html.td(4).close();<br /> toolbarBuilder.separator();<br /> html.tdEnd();<br /> }<br /> }<br /><br /> if (showExports) {<br /> Iterator iterator = model.getExportHandler().getExports().iterator();<br /> for (Iterator iter = iterator; iter.hasNext();) {<br /> //html.td(4).close();<br /> <br /> html.td(4).close();<br /> html.img();<br /> html.src(BuilderUtils.getImage(model, "ExcelExport"));<br /> //html.style("border:0");<br /> html.alt("导出为Excel");<br /> html.xclose();<br /> <br /> Export export = (Export) iter.next();<br /> toolbarBuilder.exportItemAsImage(export);<br /> html.tdEnd();<br /> }<br /> }<br /><br /> html.trEnd(3);<br /><br /> html.tableEnd(2);<br /> html.newline();<br /> html.tabs(2);<br /><br /> html.tdEnd();<br /> }<br />}<br />
然后修改org.extremecomponents.table.view.HtmlView
<br />/*<br /> * Copyright 2004 original author or authors.<br /> *<br /> * Licensed under the Apache License, Version 2.0 (the "License");<br /> * you may not use this file except in compliance with the License.<br /> * You may obtain a copy of the License at<br /> *<br /> * http://www.apache.org/licenses/LICENSE-2.0<br /> *<br /> * Unless required by applicable law or agreed to in writing, software<br /> * distributed under the License is distributed on an "AS IS" BASIS,<br /> * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.<br /> * See the License for the specific language governing permissions and<br /> * limitations under the License.<br /> */<br />package org.extremecomponents.table.view;<br /><br />import org.extremecomponents.table.core.TableModel;<br />import org.extremecomponents.util.HtmlBuilder;<br /><br />/**<br /> * @author Jeff Johnston alter by leo 2007 03 08<br /> */<br />public class HtmlView extends AbstractHtmlView {<br /> protected void beforeBodyInternal(TableModel model) {<br /> toolbar(getHtmlBuilder(), getTableModel());<br /> <br /> getTableBuilder().tableStart();<br /><br /> getTableBuilder().theadStart();<br /> <br /> //statusBar(getHtmlBuilder(), getTableModel());<br /> <br /> getTableBuilder().filterRow();<br /><br /> getTableBuilder().headerRow();<br /><br /> getTableBuilder().theadEnd();<br /><br /> getTableBuilder().tbodyStart();<br /> }<br /><br /> protected void afterBodyInternal(TableModel model) {<br /> getCalcBuilder().defaultCalcLayout();<br /><br /> getTableBuilder().tbodyEnd();<br /><br /> statusBar(getHtmlBuilder(), getTableModel());<br /><br /> getTableBuilder().tableEnd();<br /> <br /> }<br /> <br /> protected void toolbar(HtmlBuilder html, TableModel model) {<br /> new DefaultToolbar(html, model).layout();<br /> }<br /><br /> protected void statusBar(HtmlBuilder html, TableModel model) {<br /> new DefaultStatusBar(html, model).layout();<br /> }<br />}<br /><br />
下面是一个js的公共的函数,因为时间关系,没有融入到代码里面,以后会完善。现在只要include到jsp中就可以了。
<br /><br /><%@ page language="java" pageEncoding="gb2312"%><br /><%<br />response.setHeader("Pragma","No-cache"); <br />response.setHeader("Cache-Control","no-cache"); <br />response.setDateHeader("Expires", 0); <br />//create by leo 2007-03-08<br />%><br /><link rel="stylesheet" type="text/css" href="../css/extremecomponents.css"><br /><script type="text/javascript"><br /> ///select all<br /> function selectAll() {<br /> var i = document.getElementsByName("checkbox").length;<br /> if (i == 1) {<br /> document.forms.ec.checkbox.checked = true;<br /> } else {<br /> if (i > 1) {<br /> for (i = 0; i < document.forms.ec.checkbox.length; i++) {<br /> document.forms.ec.checkbox<i>.checked = true;<br /> }<br /> }<br /> }<br /> }<br /> <br /> //unselect all<br /> function unselect() {<br /> var i = document.getElementsByName("checkbox").length;<br /> if (i == 1) {<br /> document.forms.ec.checkbox.checked = false;<br /> } else {<br /> if (i > 1) {<br /> for (i = 0; i < document.forms.ec.checkbox.length; i++) {<br /> document.forms.ec.checkbox<i>.checked = false;<br /> }<br /> }<br /> }<br /> }<br /> <br /> ///switchselect<br /> function switchselect() {<br /> var i = document.getElementsByName("checkbox").length;<br /> if (i == 1) {<br /> document.forms.ec.checkbox.checked = !document.forms.ec.checkbox.checked;<br /> } else {<br /> if (i > 1) {<br /> for (i = 0; i < document.forms.ec.checkbox.length; i++) {<br /> document.forms.ec.checkbox<i>.checked = !document.forms.ec.checkbox<i>.checked;<br /> }<br /> }<br /> }<br /> }<br /><br /> //table event<br /> function runTableOnClick(TableHandle){<br /> var e = event.srcElement;<br /> //alert("e.tagName is "+e.tagName);<br /> //alert("e.rowIndex is "+e.rowIndex);<br /> //alert("e.parentElement is "+e.parentElement);<br /> <br /> if(typeof(e.tagName)=='undefined') return; <br /> if (e.tagName == 'TABLE' || e.tagName == 'TR' || e.tagName == 'TBODY') return;<br /> while (e.tagName != 'TR') e = e.parentElement;<br /> //alert("e.tagName is "+e.tagName);<br /> if (e.rowIndex == 0 || e.className == 'itemDisabled') return;<br /> var el = e;<br /> while (el.tagName != 'TABLE') el = el.parentElement;<br /> //alert("el.rows.length is "+el.rows.length);<br /> for (var i = 0; i < el.rows.length; i++){<br /> if (el.rows(i).className == 'itemOver'){<br /> el.rows(i).className = 'itemOut';<br /> break;<br /> }<br /> }<br /> e.className = 'itemOver';<br /> //if (TableHandle != null){<br /> // if (event.button == 2) menuShow(TableHandle); else menuHide(TableHandle);<br /> //}<br /> }<br /> <br /> //number only<br /> function JHshNumberText()<br /> {<br /> if ( !(((window.event.keyCode >= 48) && (window.event.keyCode <= 57))&& (window.event.keyCode <= 90)))<br /> {<br /> window.event.keyCode = 0 ;<br /> alert("请输入0-9之间的字符!");<br /> }<br /> } <br /></script><br />
楼主,看来你已经研究这个很久了,由于项目需求,需要将checkbox的选中的行导出来,那么该怎么办!而且分页时如何保存选中的checkbox状态!
项目很急,盼楼主及时指点,希望能有个例子指点一下!我的邮箱地址是
chengtwocow·126.com
这是很久以前的东西了啊。。没有看过了,但是你说的版次checkbox的状态,就要看你翻页是怎么翻的了,如果是提交表单,就用一个隐藏域保存下来就行了。。但是这样处理有session的问题。
哈哈。。。我把选页的下拉改成输入形式了。哈哈。。
就是 第>2<页 go>>
go>>是个链接。。。哈哈
很感激你。。。。。
改的我废老劲了。。嘿嘿
呵呵。。。。反正谢谢了。。。
十分感谢。。。
收藏了。。。
以后多来学习。。。。
……还有个类没有。。。还得麻烦你。。。。
CustomTableActions这个类。。。找不到。。。
呵呵。。到这里交流吧。
太谢谢了。。交个朋友好吗?
我的qq 32246910
牛人还很大方。。。。。
呵呵。。。。我东北的。。喜欢交朋友。。。
……还有个类没有。。。还得麻烦你。。。。
CustomTableActions这个类。。。找不到。。。
package com.ite.common.system.extremetable;
import org.extremecomponents.table.core.TableConstants;
import org.extremecomponents.table.core.TableModel;
import org.extremecomponents.table.view.html.BuilderUtils;
import org.extremecomponents.table.view.html.TableActions;
public class CustomTableActions extends TableActions {
public CustomTableActions(TableModel model) {
super(model);
}
public String getPageAction() {
TableModel model = getTableModel();
StringBuffer action = new StringBuffer("javascript:");
action.append(getClearedExportTableIdParameters());
String form = BuilderUtils.getForm(model);
action.append("document.forms.").append(form).append(".");
action.append(model.getTableHandler().prefixWithTableId()).append(
TableConstants.PAGE);
String page = "this.options[this.selectedIndex].value";
action.append(".value=").append(page).append(";");
action.append(getOnInvokeAction());
return action.toString();
}
}
老头。。。。您好。。。。
你的这篇文章对我帮助很大。。。
只是。。。pagesDisplayedDroplist 这个方法源码可以给我一份吗?
麻烦您了。。。。
头疼的厉害。。这个东西。研究了好几天。。。
刚会改。。。但代码功底太差。。就是改不明白。呵呵。。。。
我的邮箱是chm_demon@163.com
QQ:32246910
谢谢了。麻烦你了。。。。。
对了对了。。还有这个。。com.ite.common.system.extremetable.CustomToolbarBuilder
pagesDisplayedDroplist 这个的源码在源码包里面,CustomToolbarBuilder 已经发送。
public void pagesDisplayedDroplist() {
HtmlBuilder html = getHtmlBuilder();
TableModel model = getTableModel();
int totalPages = BuilderUtils.getTotalPages(model);
int currentPage = model.getLimit().getPage();
StringBuffer onchange = new StringBuffer();
onchange.append(new CustomTableActions(model).getPageAction());
html.select().name("pages");
html.onchange(onchange.toString());
html.close();
html.newline();
html.tabs(4);
for (int i = 1; i <= totalPages; i++) {
html.option().value(String.valueOf(i));
if (currentPage == i) {
html.selected();
}
html.close();
html.append(String.valueOf(i));
html.optionEnd();
}
html.newline();
html.tabs(4);
html.selectEnd();
}
在extremetable中增加一列用来作为操作(删除修改),如何增加呢?THANKS!
这更简单啊,只需要在jsp页面加上一列的代码就行了啊。加上自己的链接。
你好,能否将com.ite.common.system.extremetable.CustomToolbarBuilder的源代码也发我一份呢?~
07122333@mail.bjtu.edu.cn ~
十分感谢!!
已经发送。
非常需要com.ite.common.system.extremetable.CustomToolbarBuilder文件,麻烦给我发一份,huayan.xu@gmail.com,非常感谢
找到了,已经发送,请查收。
老大,如果我要把翻页放到下面来,我应该在哪个类里修改呢?
谢谢博爱老头的回复,哈哈,复制你的代码提示一个错误
toolbarBuilder.pagesDisplayedDroplist(); 找不到这个方法。。
还有两个不明白
.newline();
tabs(4);
这两个怎么理解!!
自己先多看看代码吧,这么点代码,很容易看懂的。
html.td(2);
这句怎么理解?
第几个TD
我看了HtmlBuilde.HtmlBuilder类,里面有好多方法,比如下面两个能详细说明一下吗,谢谢
public HtmlBuilder table(int tabs) {
newline();
tabs(tabs);
write("<table");
return this;
}
public HtmlBuilder tabs(int tabs) {
for (int i = 0; i < tabs; i++) {
tab();
}
return this;
}
这两个方法各什么意思呢?
设置属性了之后,返回本实例。
博爱老头:
你好!
我看了你的例子有点启发,我现在用的是eXtremeComponents-1.0.1 我想把 翻页导出放到下面来,我就是还不太明白它是怎么来生成html代码的,希望博爱老头能忙帮我。非常感谢 能留个你的联系方式吗,这里不方便的话可以发到我的信箱,chenxi3021@163.com ,如果能帮忙我可以给你酬劳的。
你看看org.extremecomponents.util。HtmlBuilde.HtmlBuilder就知道了。
您好,最近才发现extremetable,但是官网不能访问了。麻烦您给一份extremetable的源码吧。谢谢. zhoulanok@gmail.com
我要找找看,找到了发給你吧。
超赞博主!谢谢啦!
不用
您好!网上找很久了没找着,我的邮箱bybruse@sina.com,麻烦给我一份,谢谢!
自己写的,你当然找不到啊,呵呵。
已经发送,请查收!
com.ite.common.system.extremetable.CustomToolbarBuilder
这个包怎么找不到?
这个不是包,是源代码,应该是有的,如果没有的话,給我发邮件。
本人非常喜欢extremetable,但是苦于较菜,很多地方有点疑惑,以后可能还要在此站请教楼主啊~
首先谢谢楼主这个代码了,很多项目都需要类似的功能,肯定用的上,收了!:-)
不用客气!
这样的js写法,只能在ie下用哦
对的,不能兼容fw,要做到兼容的的话,需要改document!
忘记说明了,谢谢提醒:)