这个例子在jsf下通过JSF 动态生成DataTable 固定表头 固定行标 点击表头可排序 希望可以供大家学习和参考
自己在写动态生成DataTable的时候也查阅了很多相关文章 以及实现固定表头等等
在解决固定表头问题上我是用的两张表(加行标是张表)实现的 因为我发现如果用JSF的化实现固定表头几乎不可能(如果有人有好的想法 比如用JS比较在行的朋友请告诉我解决方法 谢谢)
实现给每个Header加上一个CommandLink的时候我遇到了很大的问题 就是无论如何我动态生成的这些CommandLink都没有办法触发事件(并不报错) 这个问题足足折磨了我天
最后终于发现问题的所在 是因为我在生成CommandLink的时候没有给每个CommandLink SetID 就加上这句话问题立马解决
我原来的代码是链接数据库的 但是这样的化大家也没有办法参考 所以我对代码少加修改 就算是个小例子吧 可重用
希望大家对我的代码提出宝贵意见一起进步谢谢
Dynamicjsp
<%@tagliburi=prefix=f%>
<%@tagliburi=prefix=h%>
<Scriptlanguage=JavaScript>
vartdW;
//Scroll
functionf_scroll(Col_TRow_TDivNm){
if(Col_T!=){
documentgetElementById(Col_T)scrollLeft=documentgetElementById(DivNm)scrollLeft;
}
if(Row_T!=){
documentgetElementById(Row_T)scrollTop=documentgetElementById(DivNm)scrollTop;
}
}
</Script>
<html>
<f:view>
<head>
<title>TABLE</title>
<linkrel=stylesheettype=text/css>
</head>
<body>
<h:form>
<fontsize=color=black
style=position:absolute;left:;top:;width:;height:>
<h:outputTextvalue=PleaseEnter:/></font>
<h:inputTextvalue=size=
style=position:absolute;left:;top:;width:;height:/>
<h:commandButtonvalue=Searchaction=
style=position:absolute;left:;top:;width:;height:/>
<tableBORDER=
STYLE=POSITION:ABSOLUTE;LEFT:px;TOP:px;right:px;bottom:px;>
<tr>
<tdSTYLE=textalign:right;>
<!Tablestart>
<!Tableend>
</td>
<td>
<!Tablestart>
<DivID=Table
STYLE=position:relative;top:;borderleft:ptsolidblack;
borderright:ptsolidblack;height:px;width:px;overflowx:hidden;>
<h:dataTablevalue=#{myBeanmyHeader}var=myHeader
binding=#{myBeanheaderDataTable}bgcolor=whiteborder=
cellspacing=rendered=truestyleClass=orders
headerClass=ordersHeaderrowClasses=evenColumnoddColumn
style=position:absolute;left:;top:;
width:;height:;bordercollapse:collapse;
id=ree>
</h:dataTable>
</Div>
<!Tableend>
</td>
</tr>
<tr>
<tdSTYLE=verticalalign:top;>
<!Tablestart>
<DivID=Table
STYLE=borderbottom:ptsolidblack;bordertop:ptsolidblack;
width:px;height:px;overflowy:hidden;position:relative;left:;>
<h:dataTablevalue=#{myBeanmyNum}var=myNum
binding=#{myBeannumDataTable}bgcolor=whiteborder=
cellspacing=rendered=truestyleClass=orders
headerClass=ordersHeaderrowClasses=evenColumnoddColumn
style=position:absolute;left:;top:;width:;height:;bordercollapse:collapse;
id=dee>
</h:dataTable>
</Div>
<!Tableend>
</td>
<tdSTYLE=verticalalign:top;>
<!Tablestart>
<DivID=TableonScroll=f_scroll(TableTableTable);
STYLE=height:px;width:px;overflowy:scroll;overflowx:scroll;>
<h:dataTablevalue=#{myBeanmyList}var=myItem
binding=#{myBeandynamicDataTable}bgcolor=whiteborder=
cellspacing=rendered=truestyleClass=orders
headerClass=ordersHeaderrowClasses=evenColumnoddColumn
style=position:absolute;left:;top:;width:;height:;bordercollapse:collapse;>
</h:dataTable>
</Div>
<!Tableend>
</td>
</tr>
</table>
</h:form>
</body>
</f:view>
</html>
MyBeanjava
packagemypackage;
importjavautilArrayList;
importjavautilList;
importjavaxfacesapplicationApplication;
importponentUIColumn;
importponentUIOutput;
importlHtmlCommandLink;
importlHtmlDataTable;
importlHtmlOutputText;
importntextFacesContext;
importjavaxfaceselMethodBinding;
importjavaxfaceselValueBinding;
importjavaxfaceseventActionEvent;
publicclassMyBean{
privateList<List<String>>myList;
privateList<List<String>>myHeader;
privateList<List<Integer>>myNum;
privateHtmlDataTabledynamicDataTable;
privateHtmlDataTableheaderDataTable;
privateHtmlDataTablenumDataTable;
privatestaticinttempWidth=;
//LoadDatafromDataBasetoEveryDataTable
publicvoidloadMyList()throwsException{
myList=newArrayList<List<String>>();
introw=;
while(row>){
intcolumn=;
Stringstr=o;
List<String>tmpvector=newArrayList<String>();
while(column>){
tmpvectoradd(str);
column;
}
row;
myListadd(tmpvector);
}
}
publicvoidloadMyHeader()throwsException{
myHeader=newArrayList<List<String>>();
Stringstr=*****;
intcolumn=;
List<String>tmpvector=newArrayList<String>();
while(column>){
tmpvectoradd(str);
column;
}
myHeaderadd(tmpvector);
}
publicvoidloadMyNum()throwsException{
myNum=newArrayList<List<Integer>>();
introw=;
while(row<){
List<Integer>tmpvector=newArrayList<Integer>();
tmpvectoradd(row);
myNumadd(tmpvector);
row++;
}
}
//initializeEveryDataTabletotheFront
publicvoidpopulateDynamicDataTable(){
if(myList!=null&&myListsize()>){
dynamicDataTable=newHtmlDataTable();
intcolumns=((List)myListget())size();
Systemoutprintln(DisplayCloumn:+columns);//
for(inti=;i<columns;i++){
ValueBindingmyItem=
FacesContextgetCurrentInstance()getApplication()createValueBinding(#{myItem[+i+]});
UIColumncolumn=newUIColumn();
HtmlOutputTextoutputText=newHtmlOutputText();
outputTextsetValueBinding(valuemyItem);
outputTextsetStyle(width:+tempWidth+);
columngetChildren()add(outputText);
columnsetId(col_+i);//YoushouldsetIDofeverycomponentwhichyoucreateintheBackingBean
dynamicDataTablegetChildren()add(column);
}
}
}
publicvoidpopulateHeaderDataTable(){
if(myHeader!=null&&myHeadersize()>){
headerDataTable=newHtmlDataTable();
intcolumns=((List)myHeaderget())size();
FacesContextfacesContext=FacesContextgetCurrentInstance();
Applicationapplication=facesContextgetApplication();
for(inti=;i<columns;i++){
HtmlCommandLinkcommandLink=
(HtmlCommandLink)applicationcreateComponent(HtmlCommandLinkCOMPONENT_TYPE);
StringvalueBindingExpression=#{myHeader[+i+]};
ValueBindingvalueBinding=applicationcreateValueBinding(valueBindingExpression);
commandLinksetValueBinding(valuevalueBinding);
commandLinksetId(head_comankLink_+i);//Themostimportant!!!Ifyoudontputitnothingisgonnahappen
commandLinksetStyle(color:blue);
commandLinksetStyle(width:+tempWidth+);
commandLinkgetAttributes();
Class[]params={ActionEventclass};
MethodBindingactionListener=
applicationcreateMethodBinding(#{myBeansetSelectedDocumentId}params);
commandLinksetActionListener(actionListener);
commandLinksetImmediate(true);
UIColumncolumn=newUIColumn();
columngetChildren()add(commandLink);
columnsetId(head_+i);
headerDataTablegetChildren()add(column);
}
}
}
publicvoidpopulateNumDataTable(){
if(myNum!=null&&myNumsize()>){
numDataTable=newHtmlDataTable();
UIOutputoutput=newUIOutput();
ValueBindingmyItem=
FacesContextgetCurrentInstance()getApplication()createValueBinding(#{myNum[]});
outputsetValueBinding(valuemyItem);
//Setcolumn
UIColumncolumn=newUIColumn();
columngetChildren()add(output);
columnsetId(num);
numDataTablegetChildren()add(column);
}
}
//TestActionsandActionListeners
publicvoidsetSelectedDocumentId(ActionEventevent)throwsException
{
}
//Getters
publicHtmlDataTablegetDynamicDataTable()throwsException{
if(dynamicDataTable==null){
loadMyList();//Reloadtogetmostrecentdata
populateDynamicDataTable();
}
returndynamicDataTable;
}
publicHtmlDataTablegetHeaderDataTable()throwsException{
if(headerDataTable==null){
loadMyHeader();//Reloadtogetmostrecentdata
populateHeaderDataTable();
}
returnheaderDataTable;
}
publicHtmlDataTablegetNumDataTable()throwsException{
if(numDataTable==null){
loadMyNum();//Reloadtogetmostrecentdata
populateNumDataTable();
}
returnnumDataTable;
}
publicList<List<Integer>>getMyNum(){
returnmyNum;
}
publicList<List<String>>getMyHeader(){
returnmyHeader;
}
publicList<List<String>>getMyList(){
returnmyList;
}
//Setters
publicvoidsetDynamicDataTable(HtmlDataTabledynamicDataTable){
thisdynamicDataTable=dynamicDataTable;
}
publicvoidsetHeaderDataTable(HtmlDataTableheaderDataTable){
thisheaderDataTable=headerDataTable;
}
publicvoidsetMyHeader(List<List<String>>myHeader){
thismyHeader=myHeader;
}
publicvoidsetNumDataTable(HtmlDataTablenumDataTable){
thisnumDataTable=numDataTable;
}
publicvoidsetMyNum(List<List<Integer>>myNum){
thismyNum=myNum;
}
publicvoidsetMyList(List<List<String>>myList){
thismyList=myList;
}
}
facesconfigxml
<?xmlversion=encoding=UTF?>
<!DOCTYPEfacesconfigPUBLIC//SunMicrosystemsInc//DTDJavaServerFacesConfig//ENfacesconfig__dtd>
<facesconfig>
<managedbean>
<managedbeanname>myBean</managedbeanname>
<managedbeanclass>mypackageMyBean</managedbeanclass>
<managedbeanscope>session</managedbeanscope>
</managedbean>
</facesconfig>
stylescss
orders{
border:thinsolidblack;
}
ordersHeader{
textalign:center;
fontstyle:;
color:Snow;
fontsize:px;
background:Teal;
}
evenColumn{
textalign:center;
fontsize:px;
background:#FFFFF;
}
oddColumn{
textalign:center;
fontsize:px;
background:white;
}