JSF<h:dataTable>分页，编辑，修改

最近做了个JSF的分页，找了些资料，最终实现，

HTML代码：

<t:saveState value="#{user.list}"></t:saveState><!-- 保持数据表状态-->
                <h:panelGrid>
                <h:dataTable id="schame" value="#{user.list}" var="ub" border="1" binding="#{user.table}"<!-- binding用来和后台交互，不可少-->
                    cellpadding="0" cellspacing="0" width="800px" rows="4"  ><!-- rows每页多少行-->
                    <h:column>
                        <f:facet name="header">
                            <h:outputText value="序号" />
                        </f:facet>
                        <h:outputText value="#{user.row}" style="width:50px"></h:outputText>
                    </h:column>
                    <h:column>
                        <f:facet name="header">
                            <h:outputText value="所属对象" />
                        </f:facet>
                        <h:outputText styleClass="output" value="#{ub.object}"></h:outputText>
                        <h:inputText styleClass="shr" value="#{ub.object}" ></h:inputText>
                    </h:column>
                    <h:column>
                        <f:facet name="header">
                            <h:outputText value="中文名" />
                        </f:facet>
                        <h:outputText styleClass="output" value="#{ub.cnname}"></h:outputText>
                        <h:inputText styleClass="shr" value="#{ub.cnname}"></h:inputText>
                    </h:column>
                    <h:column>
                        <f:facet name="header">
                            <h:outputText value="英文名" />
                        </f:facet>
                        <h:outputText styleClass="output" value="#{ub.enname}"></h:outputText>
                        <h:inputText styleClass="shr" value="#{ub.enname}" ></h:inputText>
                    </h:column>
                    <h:column>
                        <f:facet name="header">
                            <h:outputText value="数据类型" />
                        </f:facet>
                        <h:outputText styleClass="output" value="#{ub.property}"></h:outputText>
                        <h:inputText styleClass="shr" value="#{ub.property}" ></h:inputText>
                    </h:column>
                    <h:column>
                        <f:facet name="header">
                            <h:outputText value="父对象" />
                        </f:facet>
                        <h:outputText styleClass="output" value="#{ub.fatherObject}"></h:outputText>
                        <h:inputText styleClass="shr" value="#{ub.fatherObject}" ></h:inputText>
                    </h:column>
                    <h:column>
                        <f:facet name="header">
                            <h:outputText value="所属层级" />
                        </f:facet>
                        <h:outputText styleClass="output" value="#{ub.level}"></h:outputText>
                        <h:inputText styleClass="shr" value="#{ub.level}" ></h:inputText>
                    </h:column>
                    <h:column>
                        <f:facet name="header">
                            <h:outputText value="操作" />
                        </f:facet>
                        <h:commandButton value="删除"
                        οnclick="if (!confirm('请确认是否删除,删除后不能恢复！')) return false" action="#{user.delete}">
                        </h:commandButton>
                    </h:column>
                    <f:facet name="footer" >
                        <t:dataScroller id="ds_sataion" for="schame" fastStep="2"
                            paginatorMaxPages="6" paginator="true" style="position:center;">
                            <f:facet name="first">
                                <h:outputText value="首页   " />
                            </f:facet>
                            <f:facet name="last">
                                <h:outputText value="尾页   " />
                            </f:facet>
                            <f:facet name="previous">
                                <h:outputText value="上一页   " />
                            </f:facet>
                            <f:facet name="next">
                                <h:outputText value="下一页   " />
                            </f:facet>
                        </t:dataScroller>
                    </f:facet>
                </h:dataTable>
                </h:panelGrid>

<h:panelGroup>
                    <h:commandButton id="sel" value="查询" action="#{user.select}"></h:commandButton>
                    <h:commandButton value="新建" οnclick="showAdd()"/>
                    <input type="button" value="修改" οnclick="showUpdate()"/>
                    <h:commandButton value="保存" action="#{user.update}"/>
                    <h:commandButton value="下载为Excel" action="#{user.downLoad}"></h:commandButton>
                </h:panelGroup>

编辑js:用的是output和input切换方法，css控制input开始为隐藏

function showUpdate(){
    $(".output").css('display','none');
    $(".shr").css('display','inline');
}

css:

.shr{display:none;width: 110px}

分页jar包：我忘了，具体都哪个了

tomahawk-1.1.8

t标签web.xml配置内容：

<!-- tomahawk -->
    <filter>
    <filter-name>MyFacesExtensionsFilter</filter-name>
    <filter-class>org.apache.myfaces.component.html.util.ExtensionsFilter</filter-class>
    <init-param>
        <param-name>maxFileSize</param-name>
        <param-value>20m</param-value>
        <description>Set the size limit for uploaded files.
            Format: 10 - 10 bytes
                    10k - 10 KB
                    10m - 10 MB
                    1g - 1 GB
        </description>
    </init-param>
</filter>
<!--</span><span style="COLOR: #008000"> extension mapping for adding <script/>, <link/>, and other resource tags to JSF-pages  </span><span style="COLOR: #008000">-->
<filter-mapping>
    <filter-name>MyFacesExtensionsFilter</filter-name>
    <!--</span><span style="COLOR: #008000"> servlet-name must match the name of your javax.faces.webapp.FacesServlet entry </span><span style="COLOR: #008000">-->
    <servlet-name>Faces Servlet</servlet-name>
</filter-mapping>
<!--</span><span style="COLOR: #008000"> extension mapping for serving page-independent resources (javascript, stylesheets, images, etc.)  </span><span style="COLOR: #008000">-->
<filter-mapping>
    <filter-name>MyFacesExtensionsFilter</filter-name>
    <url-pattern>/faces/myFacesExtensionResource/*</url-pattern>
</filter-mapping>