eXtremeTable的改装

| Posted in JAVA技术 @ 2007/03/28 11:10 by 博爱老头

在一个项目中用到了extremetable，但是有些的体现形式还不符合业务的需求，所以做了些改动。下面贴出来，供大家参考：

主要增加功能：加入全选反选全不选的按钮，外观布置改动，增加table的td监听事件。

首先在http://extremecomponents.org/下载eXtremeComponents 1.0.1 的源码

修改org.extremecomponents.table.view.DefaultToolbar如下：

/*
 * Copyright 2004 original author or authors.
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *    http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */
package org.extremecomponents.table.view;

import java.util.Iterator;

import org.extremecomponents.table.bean.Export;
import org.extremecomponents.table.core.TableModel;
import org.extremecomponents.table.view.html.BuilderConstants;
import org.extremecomponents.table.view.html.BuilderUtils;
import org.extremecomponents.table.view.html.TwoColumnTableLayout;
import org.extremecomponents.util.HtmlBuilder;

import com.ite.common.system.extremetable.CustomToolbarBuilder;

/**
 * @author Jeff Johnston
 *  alter by <a href="http://www.icnote.com" target="_blank" title="http://www.icnote.com" class="mykeyword">leo</a><img src="http://www.icnote.com/images/logo.gif" alt="leo" /> 2007 03 08
 */
public class DefaultToolbar extends TwoColumnTableLayout {
    public DefaultToolbar(HtmlBuilder html, TableModel model) {
        super(html, model);
    }

protected boolean showLayout(TableModel model) {
        boolean showPagination = BuilderUtils.showPagination(model);
        boolean showExports = BuilderUtils.showExports(model);
        boolean showTitle = BuilderUtils.showTitle(model);
        if (!showPagination && !showExports && !showTitle) {
            return false;
        }

return true;
    }

protected void columnLeft(HtmlBuilder html, TableModel model) {
        html.td(2).close();
        //new TableBuilder(html, model).title();
        html.append("选择：<a class=\"check\" href=\"#\" onclick=\"javascript:selectAll();\">全选</a>－");
        html.append("<a class=\"check\" href=\"#\" onclick=\"javascript:switchselect();\">反选</a>－");
        html.append("<a class=\"check\" href=\"#\" onclick=\"javascript:unselect();\">全不选</a> ");
        html.tdEnd();
    }

protected void columnRight(HtmlBuilder html, TableModel model) {
        boolean showPagination = BuilderUtils.showPagination(model);
        boolean showExports = BuilderUtils.showExports(model);

ToolbarBuilder toolbarBuilder = new ToolbarBuilder(html, model);
        //CustomToolbarBuilder toolbarBuilder = new CustomToolbarBuilder(html, model);

html.td(2).align("right").close();

html.table(2).border("0").cellPadding("0").cellSpacing("1").styleClass(BuilderConstants.TOOLBAR_CSS).close();

html.tr(3).close();

if (showPagination) {

html.td(4).close();
            toolbarBuilder.firstPageItemAsImage();
            html.tdEnd();

html.td(4).close();
            toolbarBuilder.prevPageItemAsImage();
            html.tdEnd();

html.td(4).close();
            toolbarBuilder.nextPageItemAsImage();
            html.tdEnd();

html.td(4).close();
            toolbarBuilder.lastPageItemAsImage();
            html.tdEnd();

html.td(4).close();
            toolbarBuilder.separator();
            html.tdEnd();

html.td(4).close();
      html.img();
      html.src(BuilderUtils.getImage(model, "pageDisplayed"));
      html.style("border:0");
      html.alt("当前页码");
      html.xclose();
      toolbarBuilder.pagesDisplayedDroplist();
      html.tdEnd();

html.td(4).close();
      toolbarBuilder.separator();
      html.tdEnd();
                   
            html.td(4).close();
            html.img();
            html.src(BuilderUtils.getImage(model, BuilderConstants.TOOLBAR_ROWS_DISPLAYED_IMAGE));
            html.style("border:0");
            html.alt("每页显示");
            html.xclose();
            toolbarBuilder.rowsDisplayedDroplist();
            html.tdEnd();

if (showExports) {
                html.td(4).close();
                toolbarBuilder.separator();
                html.tdEnd();
            }
        }

if (showExports) {
            Iterator iterator = model.getExportHandler().getExports().iterator();
            for (Iterator iter = iterator; iter.hasNext();) {
                //html.td(4).close();
              
              html.td(4).close();
                html.img();
                html.src(BuilderUtils.getImage(model, "ExcelExport"));
                //html.style("border:0");
                html.alt("导出为Excel");
                html.xclose();
              
                Export export = (Export) iter.next();
                toolbarBuilder.exportItemAsImage(export);
                html.tdEnd();
            }
        }

html.trEnd(3);

html.tableEnd(2);
        html.newline();
        html.tabs(2);

html.tdEnd();
    }
}

然后修改org.extremecomponents.table.view.HtmlView

import org.extremecomponents.table.core.TableModel;
import org.extremecomponents.util.HtmlBuilder;

/**
 * @author Jeff Johnston alter by leo 2007 03 08
 */
public class HtmlView extends AbstractHtmlView {
    protected void beforeBodyInternal(TableModel model) {
        toolbar(getHtmlBuilder(), getTableModel());
        
        getTableBuilder().tableStart();

getTableBuilder().theadStart();
        
        //statusBar(getHtmlBuilder(), getTableModel());
        
        getTableBuilder().filterRow();

getTableBuilder().headerRow();

getTableBuilder().theadEnd();

getTableBuilder().tbodyStart();
    }

protected void afterBodyInternal(TableModel model) {
        getCalcBuilder().defaultCalcLayout();

getTableBuilder().tbodyEnd();

statusBar(getHtmlBuilder(), getTableModel());

getTableBuilder().tableEnd();
        
    }
    
    protected void toolbar(HtmlBuilder html, TableModel model) {
        new DefaultToolbar(html, model).layout();
    }

protected void statusBar(HtmlBuilder html, TableModel model) {
        new DefaultStatusBar(html, model).layout();
    }
}

下面是一个js的公共的函数，因为时间关系，没有融入到代码里面，以后会完善。现在只要include到jsp中就可以了。

<%@ page language="java" pageEncoding="gb2312"%>
<%
response.setHeader("Pragma","No-cache"); 
response.setHeader("Cache-Control","no-cache"); 
response.setDateHeader("Expires", 0); 
//create by leo 2007-03-08
%>
<link rel="stylesheet" type="text/css" href="../css/extremecomponents.css">
<script type="text/javascript">
    ///select all
    function selectAll() {
      var i = document.getElementsByName("checkbox").length;
      if (i == 1) {
        document.forms.ec.checkbox.checked = true;
      } else {
        if (i > 1) {
          for (i = 0; i < document.forms.ec.checkbox.length; i++) {
            document.forms.ec.checkbox[i].checked = true;
          }
        }
      }
    }
      
    //unselect all
    function unselect() {
      var i = document.getElementsByName("checkbox").length;
      if (i == 1) {
        document.forms.ec.checkbox.checked = false;
      } else {
        if (i > 1) {
          for (i = 0; i < document.forms.ec.checkbox.length; i++) {
            document.forms.ec.checkbox[i].checked = false;
          }
        }
      }
    }
      
    ///switchselect
    function switchselect() {
      var i = document.getElementsByName("checkbox").length;
      if (i == 1) {
        document.forms.ec.checkbox.checked = !document.forms.ec.checkbox.checked;
      } else {
        if (i > 1) {
          for (i = 0; i < document.forms.ec.checkbox.length; i++) {
            document.forms.ec.checkbox[i].checked = !document.forms.ec.checkbox[i].checked;
          }
        }
      }
    }

//table event
  function runTableOnClick(TableHandle){
    var e = event.srcElement;
    //alert("e.tagName is "+e.tagName);
    //alert("e.rowIndex is "+e.rowIndex);
    //alert("e.parentElement is "+e.parentElement);
    
    if(typeof(e.tagName)=='undefined') return;  
    if (e.tagName == 'TABLE' || e.tagName == 'TR' || e.tagName == 'TBODY') return;
    while (e.tagName != 'TR') e = e.parentElement;
    //alert("e.tagName is "+e.tagName);
    if (e.rowIndex == 0 || e.className == 'itemDisabled') return;
    var el = e;
    while (el.tagName != 'TABLE') el = el.parentElement;
    //alert("el.rows.length is "+el.rows.length);
    for (var i = 0; i < el.rows.length; i++){
      if (el.rows(i).className == 'itemOver'){
        el.rows(i).className = 'itemOut';
        break;
      }
    }
    e.className = 'itemOver';
    //if (TableHandle != null){
    //  if (event.button == 2) menuShow(TableHandle); else menuHide(TableHandle);
    //}
    }
    
    //number only
    function JHshNumberText()
            {
              if ( !(((window.event.keyCode >= 48) && (window.event.keyCode <= 57))&& (window.event.keyCode <= 90)))
                {
                  window.event.keyCode = 0 ;
                  alert("请输入0-9之间的字符!");
                }
            }  
</script>

就这样，预览效果如下：

作者：博爱老头@博爱老头的草屋
地址：http://www.icnote.com/Extreme-Table/
版权所有。转载时必须以链接形式注明作者和原始出处及本声明！

最新日志		随机日志		综合排行
	用java将本地化语言转换... ThrottleLock ... 新年快乐 [music] Sisse... 可口的三文鱼你不知道的故... [music] 听歌时间-... 平安夜杂记 DOPOD S900 官方... [music]好冷。。音乐... j2ee中session的...		中国参建人造太阳百亿欧元... 也谈java反射机制(Ja... 周末路过“山寨市场” 超可爱小MM[打针] Linux Kernel ... 中俄正讨论太空站方面合作我国新一代运载火箭长征五号... Fedora bang b... 经典老歌[失乐园] 一封有趣的垃圾邮件		java msn机器人 JSTL详解终于在fc6下把TL－WN... eXtremeTable的... DES加密、解密字符串算法... IDC sees $49 ... eclipse 安装pyt... 放假早起，听到熟悉经典的音... 测试Issue管理利器JI... Waiting for f...

文章来自: 本站原创

Tags: java技术

今天的天气真好啊。

一个有意思的逻辑题目：）

鲍海昕 Said,

2008/12/19 17:01

哈哈。。。我把选页的下拉改成输入形式了。哈哈。。
就是第>2<页 go>>
go>>是个链接。。。哈哈
很感激你。。。。。
改的我废老劲了。。嘿嘿

博爱老头回复于 2008/12/19 18:47

鲍海昕 Said,

2008/12/19 14:40

呵呵。。。。反正谢谢了。。。
十分感谢。。。
收藏了。。。
以后多来学习。。。。

鲍海昕 Said,

2008/12/19 11:56

......还有个类没有。。。还得麻烦你。。。。

CustomTableActions这个类。。。找不到。。。

博爱老头回复于 2008/12/19 14:17

呵呵。。到这里交流吧。

鲍海昕

Said,

2008/12/19 11:56

太谢谢了。。交个朋友好吗？
我的qq 32246910
牛人还很大方。。。。。
呵呵。。。。我东北的。。喜欢交朋友。。。

......还有个类没有。。。还得麻烦你。。。。

CustomTableActions这个类。。。找不到。。。

博爱老头回复于 2008/12/19 14:17

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();
  }
}

鲍海昕

Said,

2008/12/19 11:09

老头。。。。您好。。。。
你的这篇文章对我帮助很大。。。
只是。。。pagesDisplayedDroplist 这个方法源码可以给我一份吗？
麻烦您了。。。。
头疼的厉害。。这个东西。研究了好几天。。。
刚会改。。。但代码功底太差。。就是改不明白。呵呵。。。。
我的邮箱是chm_demon@163.com
QQ:32246910
谢谢了。麻烦你了。。。。。
对了对了。。还有这个。。com.ite.common.system.extremetable.CustomToolbarBuilder

博爱老头回复于 2008/12/19 11:35

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();
  }

qiuermao

Said,

2008/12/14 14:58