dataGrid列里显示进度条

最新推荐文章于 2021-02-17 02:01:48 发布

congine_mcfeng

最新推荐文章于 2021-02-17 02:01:48 发布

阅读量289

点赞数

分类专栏： JSF 文章标签： Bean JSP XML HTML

本文链接：https://blog.csdn.net/congine_mcfeng/article/details/83524716

版权

JSF 专栏收录该内容

5 篇文章 0 订阅

订阅专栏

[img]http://dl.iteye.com/upload/attachment/188675/7282acde-1192-3416-a17c-7e611a66b7eb.bmp[/img]


<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE HTML PUBLIC "" "">
<f:view xmlns="http://www.w3.org/1999/xhtml"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:w="http://www.apusic.com/jsf/widget"
	xmlns:layout="http://www.apusic.com/jsf/layout"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:ajax="http://www.apusic.com/jsf/ajax" renderKitId="AJAX">
	<w:head>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
	</w:head>
	<w:page title="Insert title here">
		<w:dataGrid paged="true" rows="10" id="grid" var="p" height="260">
			<w:outputColumn header="column1" value="条目#{p[0]}"></w:outputColumn>
			<w:outputColumn header="column2" value="#{p[1]}" width="200"
				clientFormatter="percentFmt"></w:outputColumn>
			<w:outputColumn header="column3" value="#{p[1]}" width="200"
				clientFormatter="percentFmt2"></w:outputColumn>
		</w:dataGrid>
	</w:page>
	<script type="text/javascript">   
		function percentFmt(v){      
				return '<div style="width:'+v*200/100+'px;height:18px;background-color:#FF0000">'            
				+v+'%</div>';   
		}
		function percentFmt2(v){      
				return '<div style="width:'+v*200/100+'px;height:18px;background-color:#FF0000">'            
				+'</div>';   
		}     
	</script>
</f:view>


package com.microjava.bean;

import org.operamasks.faces.annotation.DataModel;
import org.operamasks.faces.annotation.ManagedBean;
import org.operamasks.faces.annotation.ManagedBeanScope;

@ManagedBean(name = "ProgressDataGridBean", scope = ManagedBeanScope.REQUEST)
public class ProgressDataGridBean {

	@DataModel(id = "grid")
	public int[][] gridValues = new int[][] { { 1, 50 }, { 2, 76 }, { 3, 20 },{ 4, 100 },{ 5, 0 },{ 6, 5 },{ 7, 10 }};

}