项目中使用ecTable的代码

这是不配置extremetable.properties的初始样式。

这是配置了extremetable.properties自定义的样式,主要是加了一个页数下拉框,可以选择第几页,每页几行。这个下拉框要加上对应的onchange()方法、action,非常复杂。

项目目录。

-------------------------------------------------------------------------------------------------------------------

ecTable的初步配置很简单。导入jar包。web.xml里面可以指定extremetable.properties。然后配置extremetable.properties。可以不指定,使用默认样式。还有一些image。可以自定义css。我们的css这里不写了,大致是这样:.eXtremeTable .tableRegion ,以.eXtremeTable开头。可以去下载项目。

http://download.csdn.net/detail/u010653311/6453225

web.xml就不贴了。这里没有配置导出报表和国际化。

index.jsp

<%@page contentType="text/html; charset=UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
  		<%@ taglib uri="http://www.extremecomponents.org" prefix="ec" %>
		<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
		<c:set var="ctx" value="${pageContext.request.contextPath}"/>
		<link href="${ctx}/css/extremecomponents.css" type="text/css" rel="stylesheet" />
		<link rel="stylesheet" type="text/css" href="${ctx}/css/common.css" />
		
  </head>
  
  <body style="padding:0 100px;">
    <br/>
    <div id="TableBody">
	    <ec:table tableId="adhocSql" items="data" var="map"
			width="100%" form="EditForm"
			action="${ctx}/adhocSql/query.action"
			imagePath="${ctx}/images/extremecomponents/*.gif" view="html"
			retrieveRowsCallback="limit" autoIncludeParameters="false">
			<ec:exportXls fileName="adhocSqlList.xls" tooltip="导出Excel" />
			<ec:row>
				<ec:column property="name" title="姓名" width="10%"/>
				<ec:column property="age" title="年龄" width="10%" />
				
			</ec:row>
		</ec:table>
	</div>
  </body>
</html>

配置文件:

table.filterable=false
table.imagePath=/images/extremecomponents/*.gif
table.locale=zh_CN
table.view.html=com.huateng.framework.extremecomponents.view.IssueView

exportXls.view=org.extremecomponents.table.view.XlsView

row.highlightRow=true

column.format.date=yyyy/MM/dd/hh/mm/ss
column.format.currency=###,###,###,###,#00.00

table.maxRowsDisplayed=50
table.medianRowsDisplayed=20
table.rowsDisplayed=10

column.cell.OrderState=com.huateng.framework.extremecomponents.cell.CustomerOrderStateCell 

这里指定了一个IssueView。自定义样式都是这个类。

column.cell.OrderState是这么用的:jsp里面

<ec:column property="orderStat" cell="OrderState" title="订单状态" width="10%"/>
就会找到CustomerOrderStateCell这个类。另外cell=""里面好像可以直接写类和包的全称。

这个类可以把一个输入转为一个输出。Action传过来的实际值比如是1,显示到页面上面可以变为‘草稿’。

public class CustomerOrderStateCell extends AbstractCell {

	/* (non-Javadoc)
	 * @see org.extremecomponents.table.cell.AbstractCell#getCellValue(org.extremecomponents.table.core.TableModel, org.extremecomponents.table.bean.Column)
	 */
	@SuppressWarnings("unchecked")
	@Override
	protected String getCellValue(TableModel model, Column column) {
		
		List<DictInfoDTO> list = (List<DictInfoDTO>)SystemInfo.getDictInfo().get(SystemInfoConstants.CUSTOMER_ORDER_STATE);
		
		String value = column.getValueAsString();
		if (StringUtils.isBlank(value))
			return "";
		
		for (DictInfoDTO d : list) {
			if (value.equals(String.valueOf(d.getDictId()))) {
				value = d.getDictShortName();
				break;
			}
		}
		return value;
	}
}

这个类比较简单。

再看IssueView

package com.huateng.framework.extremecomponents.view;

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

import com.huateng.framework.extremecomponents.toolbar.IssueToolbar;

public class IssueView extends CompactView {

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

IssueToolBar:

package com.huateng.framework.extremecomponents.toolbar;

import java.util.Iterator;

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

public class IssueToolbar extends CompactToolbar {

    public IssueToolbar(HtmlBuilder html, TableModel model) {
	super(html, model);
    }
    
    protected void columnRight(HtmlBuilder html, TableModel model) {
        boolean filterable = BuilderUtils.filterable(model);
        boolean showPagination = BuilderUtils.showPagination(model);
        boolean showExports = BuilderUtils.showExports(model);

        IssueToolbarBuilder toolbarBuilder = new IssueToolbarBuilder(html, model);

        html.td(4).styleClass(BuilderConstants.COMPACT_TOOLBAR_CSS).align("right").close();

        html.table(4).border("0").cellPadding("1").cellSpacing("2").close();
        html.tr(5).close();

        if (showPagination) {
            html.td(5).close();
            toolbarBuilder.firstPageItemAsImage();
            html.tdEnd();

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

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

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

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

            html.td(5).close();
            toolbarBuilder.rowsDisplayedDroplist();
            html.tdEnd();

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

        if (showExports) {
            Iterator iterator = model.getExportHandler().getExports().iterator();
            for (Iterator iter = iterator; iter.hasNext();) {
                html.td(5).close();
                Export export = (Export) iter.next();
                toolbarBuilder.exportItemAsImage(export);
                html.tdEnd();
            }
        }

        if (filterable) {
            if (showExports || showPagination) {
                html.td(5).close();
                toolbarBuilder.separator();
                html.tdEnd();
            }

            html.td(5).close();
            toolbarBuilder.filterItemAsImage();
            html.tdEnd();

            html.td(5).close();
            toolbarBuilder.clearItemAsImage();
            html.tdEnd();
        }

        html.trEnd(5);

        html.tableEnd(4);

        html.tdEnd();
    }

}

IssueToolbarBuilder:

package com.huateng.framework.extremecomponents.toolbar;

import org.extremecomponents.table.core.TableConstants;
import org.extremecomponents.table.core.TableModel;
import org.extremecomponents.table.view.html.TableActions;
import org.extremecomponents.table.view.html.ToolbarBuilder;
import org.extremecomponents.util.HtmlBuilder;

import com.huateng.framework.extremecomponents.tableaction.IssueTableActions;

public class IssueToolbarBuilder extends ToolbarBuilder {
    private static String pathString="/EcTableWeb";
    public IssueToolbarBuilder(HtmlBuilder html, TableModel model) {
	super(html, model);
    }

    public void rowsDisplayedDroplist() {
	int rowsDisplayed = getTableModel().getTableHandler().getTable()
		.getRowsDisplayed();
	int medianRowsDisplayed = getTableModel().getTableHandler().getTable()
		.getMedianRowsDisplayed();
	int maxRowsDisplayed = getTableModel().getTableHandler().getTable()
		.getMaxRowsDisplayed();
	int currentRowsDisplayed = getTableModel().getLimit()
		.getCurrentRowsDisplayed();
	//System.out.println(rowsDisplayed+","+medianRowsDisplayed+","+maxRowsDisplayed+","+currentRowsDisplayed);
	//10,20,50,10

	//显示页数的下拉框
	
	getHtmlBuilder().table(0).close().tr(4).close().td(8).style(" padding:0 0 0 4px;").close();

	int currentPage = getTableModel().getLimit().getPage();
	int totalRows = getTableModel().getLimit().getTotalRows();
	int totalPages = 1;

	if (totalRows % currentRowsDisplayed > 0) {
	    totalPages = totalRows / currentRowsDisplayed + 1;
	} else {
	    totalPages = totalRows / currentRowsDisplayed;
	}

	getHtmlBuilder().select().name(
		getTableModel().getTableHandler().prefixWithTableId()
			+ TableConstants.PAGE_SCOPE);

	StringBuffer onchangePage = new StringBuffer();
	onchangePage.append(new IssueTableActions(getTableModel())
		.getPagesDisplayedAction());
	getHtmlBuilder().onchange(onchangePage.toString());

	getHtmlBuilder().close();

	getHtmlBuilder().newline();
	getHtmlBuilder().tabs(4);

	for (int i = 1; i <= totalPages; i++) {
	    getHtmlBuilder().option().value(String.valueOf(i));
	    if (i == currentPage) {
		getHtmlBuilder().selected();
	    }
	    getHtmlBuilder().close();
	    getHtmlBuilder().append(String.valueOf(i));
	    getHtmlBuilder().optionEnd();
	}

	getHtmlBuilder().newline();
	getHtmlBuilder().tabs(4);
	getHtmlBuilder().selectEnd();
	
//	getHtmlBuilder().br();
//	getHtmlBuilder().img("images/extremecomponents/rowsDisplayed.gif");
//	getHtmlBuilder().nbsp();

	// 显示条数的下拉框
	
	getHtmlBuilder().tdEnd().td(8).style(" padding:0 0 0 4px;").close();
	
	getHtmlBuilder().select().name(
		getTableModel().getTableHandler().prefixWithTableId()
			+ TableConstants.ROWS_DISPLAYED);

	StringBuffer onchange = new StringBuffer();
	onchange.append(new TableActions(getTableModel())
		.getRowsDisplayedAction());
	getHtmlBuilder().onchange(onchange.toString());

	getHtmlBuilder().close();

	getHtmlBuilder().newline();
	getHtmlBuilder().tabs(4);

	// default rows
	getHtmlBuilder().option().value(String.valueOf(rowsDisplayed));
	if (currentRowsDisplayed == rowsDisplayed) {
	    getHtmlBuilder().selected();
	}
	getHtmlBuilder().close();
	getHtmlBuilder().append(String.valueOf(rowsDisplayed));
	getHtmlBuilder().optionEnd();

	// median rows
	getHtmlBuilder().option().value(String.valueOf(medianRowsDisplayed));
	if (currentRowsDisplayed == medianRowsDisplayed) {
	    getHtmlBuilder().selected();
	}
	getHtmlBuilder().close();
	getHtmlBuilder().append(String.valueOf(medianRowsDisplayed));
	getHtmlBuilder().optionEnd();

	// max rows
	getHtmlBuilder().option().value(String.valueOf(maxRowsDisplayed));
	if (currentRowsDisplayed == maxRowsDisplayed) {
	    getHtmlBuilder().selected();
	}
	getHtmlBuilder().close();
	getHtmlBuilder().append(String.valueOf(maxRowsDisplayed));
	getHtmlBuilder().optionEnd();

	getHtmlBuilder().newline();
	getHtmlBuilder().tabs(4);
	getHtmlBuilder().selectEnd();
	
	getHtmlBuilder().tdEnd().trEnd(4);
	getHtmlBuilder().tr(4).close().td(8).close();
	getHtmlBuilder().img(pathString+"/images/extremecomponents/rowsDisplayed.gif");
	getHtmlBuilder().tdEnd().td(8).close();
	getHtmlBuilder().img(pathString+"/images/extremecomponents/table/rowsDisplayed.gif");
	getHtmlBuilder().tdEnd().trEnd(4).tableEnd(0);
    }
}

用来指定onchange() Action的IssueTableActions:

package com.huateng.framework.extremecomponents.tableaction;

import org.apache.commons.lang.StringUtils;
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;

/**
 * 扩展TableActions,使原来页面中下拉框由显示行数变为显示页敄1�7
 * 这里完成了下拉框中js语句onchenge()的实玄1�7
 * @author liming.feng
 *
 */
public class IssueTableActions extends TableActions {
	
	private TableModel model;

	public IssueTableActions(TableModel model) {
		super(model);
		this.model = model;
	}
	
	/**
	 * 构建页面控件“翻页下拉框”的js中onchenge()语句
	 * @return String
	 */
    public String getPagesDisplayedAction() {
        StringBuffer action = new StringBuffer("javascript:");

        action.append(getClearedExportTableIdParameters());

        action.append(getRowsDisplayedFormParameter(TableConstants.PAGE));
        action.append(getOnInvokeOrSubmitAction());
        
        return action.toString();
    }
    
    /*
     * Added 16 AUG 2007 - Todd Fredrich - To duplicate previous functionality of getOnInvokeAction().
     */
    public String getOnInvokeOrSubmitAction() {
        String onInvokeAction = getOnInvokeAction();
        if (StringUtils.isNotBlank(onInvokeAction)) {
            return onInvokeAction;
        }
        
        return getSubmitAction();
    }
    
    public String getSubmitAction() {
        StringBuffer result = new StringBuffer();

        String form = BuilderUtils.getForm(model);
        String action = model.getTableHandler().getTable().getAction();
        result.append("document.forms.").append(form).append(".setAttribute('action','").append(action).append("');");
        
        String method = model.getTableHandler().getTable().getMethod();
        result.append("document.forms.").append(form).append(".setAttribute('method','").append(method).append("');");

        result.append("document.forms.").append(form).append(".submit()");
        
        return result.toString();
    }
    
}

说几点细节:比如getHtmlBuilder().table(0).close().tr(4).close().td(8)

close()方法是加上‘>’符号,tr(4)里面的数字没有实际意义,如果system.out打印出来发现那里是缩进了几格。这个htmlBuilder就是像手写html代码一样。可以直接打印看字符串。

另外带上Action


package com.huateng.action;

import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;
import java.util.Map;

public class DataInitAction {

	private List<Map<String, Object>> data = new ArrayList<Map<String,Object>>();
	private int totalRows = 0;
	public String init(){
		Map<String, Object> map = new HashMap<String, Object>();
		map.put("name", "tommy");
		map.put("age", 22);
		data.add(map);
		map = new HashMap<String, Object>();
		map.put("name", "jerry");
		map.put("age", 33);
		data.add(map);
		totalRows = data.size();
		return "succ";
	}
	
	public List<Map<String, Object>> getData() {
		return data;
	}
	public void setData(List<Map<String, Object>> data) {
		this.data = data;
	}
	public int getTotalRows() {
		return totalRows;
	}
	public void setTotalRows(int totalRows) {
		this.totalRows = totalRows;
	}
}

这里没连数据库,翻页什么都做不了。

实际中Action中还有一个方法取得页面页数等数据,是这样的:


/**
     * list列表页面初始化获得页数等信息
     *
     * @param request
     * @param response
     * @return
     * @throws Exception
     */
    protected void ListPageInit(String tableId, PageQueryDTO pageQueryDTO) throws Exception {

        if (pageQueryDTO == null)
            return;

        if (tableId != null)
            this.tableId = tableId;

        HttpServletRequest request = getRequest();

        Limit limit = getLimit(request, tableId);
        pageQueryDTO.setCurrentPage(limit.getPage());

        pageQueryDTO.setRowsDisplayed(getRowsDisplayed(request, tableId));

        pageQueryDTO.setQueryAll(this.isExportView(request, tableId));

        // 是否有排序,如果有,记录排序的字段名、字段别名和排序的种类(降序or升序)
        if (limit.getSort() != null) {
            // 排序的种类
            pageQueryDTO.setSort(limit.getSort().getSortOrder());
            if (TableConstants.SORT_ASC.equals(limit.getSort().getSortOrder())
                    || TableConstants.SORT_DESC.equals(limit.getSort().getSortOrder())) {
                // 排序的字段名
                pageQueryDTO.setSortFieldName(limit.getSort().getProperty());
                // 排序的字段别名
                pageQueryDTO.setSortFieldAliasName(limit.getSort().getAlias());
            }
        }
    }


/**
     * 得到ec分页、排序、索引用的Limit
     *
     * @param request
     * @return
     */
    protected Limit getLimit(HttpServletRequest request, String tableId) {
        if (tableId == null)
            tableId = "ec";
        Context context = new HttpServletRequestContext(request);
        LimitFactory limitFactory = new TableLimitFactory(context, tableId);
        Limit limit = new TableLimit(limitFactory);
        return limit;
    }

/**
     * 得到每页的页数
     *
     * @param request
     * @return
     */
    protected int getRowsDisplayed(HttpServletRequest request, String tableId) {
        if (tableId == null)
            tableId = "ec";
        Context context = new HttpServletRequestContext(request);
        String rowsDisplayed = String.valueOf(getLimit(request, tableId).getCurrentRowsDisplayed());
        Preferences preferences = new TableProperties();
        preferences.init(context, TableModelUtils.getPreferencesLocation(context));
        if ("0".equals(rowsDisplayed)) {
            Object rd = request.getParameterMap().get(tableId + "_" + TableConstants.ROWS_DISPLAYED);
            if (rd != null) {
                rowsDisplayed = ((String[]) rd)[0];
            } else {
                rowsDisplayed = preferences.getPreference(PreferencesConstants.TABLE_ROWS_DISPLAYED);
            }
        }
        return Integer.parseInt(rowsDisplayed);
    }

/**
     * 判断是否是导出操作
     *
     * @param request
     * @return
     */
    protected boolean isExportView(HttpServletRequest request, String tableId) {
        if (tableId == null)
            tableId = "ec";
        Object rd = request.getParameterMap().get(TableConstants.EXPORT_TABLE_ID);

        if (rd != null) {
            String ex = ((String[]) rd)[0];
            return StringUtils.isNotBlank(ex);
        }
        return false;
    }

下载位置http://download.csdn.net/detail/u010653311/6453225

猜你喜欢

转载自blog.csdn.net/u010653311/article/details/13019967