您好,登錄后才能下訂單哦!
這篇文章主要介紹“JSF如何動態生成固定表頭和行標的DataTable”,在日常操作中,相信很多人在JSF如何動態生成固定表頭和行標的DataTable問題上存在疑惑,小編查閱了各式資料,整理出簡單好用的操作方法,希望對大家解答”JSF如何動態生成固定表頭和行標的DataTable”的疑惑有所幫助!接下來,請跟著小編一起來學習吧!
自己在寫JSF動態生成DataTable的時候也查閱了很多相關文章, 以及實現固定表頭等等。
在解決固定表頭問題上我是用的兩張表(加行標是3張表)實現的, 因為我發現如果用JSF1.1的化實現固定表頭幾乎不可能(如果有人有好的想法, 比如用JS比較在行的朋友請告訴我解決方法, 謝謝)
實現給每個Header加上一個CommandLink的時候我遇到了很大的問題, 就是無論如何通過JSF動態生成的這些CommandLink都沒有辦法觸發事件(并不報錯), 這個問題足足折磨了我3天。。。
***終于發現問題的所在, 是因為我在生成CommandLink的時候沒有給每個CommandLink SetID。。。 就加上這句話,問題立馬解決。
我原來的代碼是鏈接數據庫的, 但是這樣的化大家也沒有辦法參考, 所以我對代碼少加修改, 就算是個小例子吧, 可重用。
希望大家對我的代碼提出JSF動態生成固定表頭和行標的DataTable的意見,一起進步,謝謝。
<%@ taglib uri="http://java.sun.com/jsf/core" prefix="f"%> <%@ taglib uri="http://java.sun.com/jsf/html" prefix="h"%> <Script language="JavaScript"> var tdW; //Scroll function f_scroll(Col_T,Row_T,DivNm){ if(Col_T!=''){ document.getElementById(Col_T).scrollLeft = document.getElementById(DivNm).scrollLeft; } if(Row_T!=''){ document.getElementById(Row_T).scrollTop = document.getElementById(DivNm).scrollTop; } } Script> <html> <f:view> <head> <title>TABLEtitle> <link rel="stylesheet" type="text/css" href="styles.css"> head> <body> <h:form> <font size="2" color="black" style="position:absolute; left: 35; top: 5; width:200; height:20"> <h:outputText value="Please Enter:" /> font> <h:inputText value="" size="20" style="position:absolute; left: 110; top: 5; width:150; height:20" /> <h:commandButton value="Search" action="" style="position:absolute; left: 270; top: 5; width:50; height:20" /> <table BORDER=0 STYLE="POSITION: ABSOLUTE; LEFT: 0px; TOP: 30px; right: 0px; bottom: 0px;"> <tr> <td STYLE="text-align: right;"> td> <td> <Div ID="Table2" STYLE="position: relative; top: 0; border-left: 0.5pt solid black; border-right: 0.5pt solid black; height: 17.75px; width: 285px; overflow-x: hidden;"> <h:dataTable value="#{myBean.myHeader}" var="myHeader" binding="#{myBean.headerDataTable}" bgcolor="white" border="1" cellspacing="1" rendered="true" styleClass="orders" headerClass="ordersHeader" rowClasses="evenColumn,oddColumn" style="position:absolute; left: 0; top: 0; width: 100; height: 10; border-collapse:collapse;" id="ree"> h:dataTable> Div> td> tr> <tr> <td STYLE="vertical-align: top;"> <Div ID="Table3" STYLE="border-bottom: 0.5pt solid black; border-top: 0.5pt solid black; width: 25.5px; height: 265px; overflow-y: hidden; position: relative; left: 0;"> <h:dataTable value="#{myBean.myNum}" var="myNum" binding="#{myBean.numDataTable}" bgcolor="white" border="1" cellspacing="1" rendered="true" styleClass="orders" headerClass="ordersHeader" rowClasses="evenColumn,oddColumn" style="position:absolute; left: 0; top: 0; width: 32; height: 5; border-collapse:collapse;" id="dee"> h:dataTable> Div> td> <td STYLE="vertical-align: top;"> <Div ID="Table4" onScroll="f_scroll('Table2','Table3','Table4');" STYLE="height: 281px; width: 300px; overflow-y: scroll; overflow-x: scroll;"> <h:dataTable value="#{myBean.myList}" var="myItem" binding="#{myBean.dynamicDataTable}" bgcolor="white" border="1" cellspacing="1" rendered="true" styleClass="orders" headerClass="ordersHeader" rowClasses="evenColumn,oddColumn" style="position:absolute; left: 0; top: 0; width: 100; height: 5; border-collapse:collapse;"> h:dataTable> Div> td> tr> table> h:form> body> f:view> html>
到此,關于“JSF如何動態生成固定表頭和行標的DataTable”的學習就結束了,希望能夠解決大家的疑惑。理論與實踐的搭配能更好的幫助大家學習,快去試試吧!若想繼續學習更多相關知識,請繼續關注億速云網站,小編會繼續努力為大家帶來更多實用的文章!
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。