Primefaces 数据表 JSF2.0答案

【问题标题】：Primefaces Datatable JSF2.0Primefaces 数据表 JSF2.0
【发布时间】：2011-12-25 05:39:02
【问题描述】：

我一直在开发 JSF 接口，并使用 primefaces 成功创建了两个数据表，它们从 SAP / oracle ondemand crm 系统中提取数据。然而，一切都不是那么顺利，我在许多地区的数据表上都遇到了麻烦。

如果我将命令按钮添加到数据表的列中，我似乎无法为其分配唯一 ID（不能使用 rowindexvar，因为它不能用于处理）。基本上我需要将两个按钮插入和更新设置为不可见，直到在第二个数据表中选择了一行，此时上述数据表中相关表的按钮被启用并变为可点击。
我似乎无法让 rowselect 的突出显示颜色来改变它的颜色，它保持着一种奇怪的黄色缩进颜色，这不足以真正让用户知道他们已经选择了该行。
当我放大数据表时，列溢出数据表，（由于列数）我真的找不到解决方法。

我对所有这些问题进行了广泛的搜索，但无济于事，所以我希望这里的 some1 甚至“Cagatay Civici”可以在某些方面帮助我，我真的很感谢你的帮助。

这是我的 XHTML

<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:p="http://primefaces.prime.com.tr/ui"
      xmlns:f="http://java.sun.com/jsf/core">
    <h:head>
        <p:themeSwitcher initialText="Change Skin"  buttonPreText="Skin: "/>   
        <title>Elpone Facelet</title>
        <style type="text/css"> 
            td{ font-family:sans-serif; font-size: 10px;}
            h{ font-family:sans-serif; font-size: 10px; font-weight: bold;}
            body{background-color: grey;}
            #bannerImage{width:100%; height:160px;}
            .ui-datatable .ui-state-highlight {
            background-color:#83AAB4;}
           #buttonPanel{visibility:hidden;} 



        </style>
    </h:head>
    <h:body >
        <div id="bannerContainer">
        <h:graphicImage id="bannerImage" alt="ban_eloma" url="/resources/Eloma_banner1.jpg"/> 
        </div>

      <h:form>
                <p:panel header="SAP Accounts" id="sapPanel">    

            <p:growl id="growl" showDetail="true" />            

            <p:dataTable style="width:101%;"
                scrollable="false"    
                rowIndexVar="rowID"   
                id="debTable"
                var="debitors" 
                value="#{tableBean.deblst}"  
                paginator="true"
                rows="8"
                selection="#{tableBean.selectedRec}"
                rowSelectListener="#{tableBean.onRowSelect}"   
                update="debAccTable"
                selectionMode="single"
                paginatorTemplate="{CurrentPageReport}  {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}"  
                rowsPerPageTemplate="8,15,20"

                >



                <p:column>

                    <f:facet name="header">
                        <h:outputText value="Kunnr" />
                    </f:facet>
                    <h:outputText value="#{debitors.debitorPK.kunnr}"/>
                </p:column>   

                <p:column>
                    <f:facet name="header">
                        <h:outputText value="SAP gelöscht"/>
                    </f:facet>
                    <h:outputText value="#{debitors.loevm}"/>
                </p:column>
                <p:column>
                    <f:facet name="header">
                        <h:outputText value="Name1"/>
                    </f:facet>
                    <h:outputText value="#{debitors.name1}"/>
                </p:column>  

                <p:column>
                    <f:facet name="header">
                        <h:outputText value="Name2"/>
                    </f:facet>
                    <h:outputText value="#{debitors.name2}"/>
                </p:column>

                <p:column>
                    <f:facet name="header">
                        <h:outputText value="Name3"/>
                    </f:facet>
                    <h:outputText value="#{debitors.name3}"/>
                </p:column> 

                <p:column>
                    <f:facet name="header">
                        <h:outputText value="#{bundle.ListDebitorTitle_ort01}"/>
                    </f:facet>
                    <h:outputText value="#{debitors.ort01}"/>
                </p:column>

                <p:column>
                    <f:facet name="header">
                        <h:outputText value="#{bundle.ListDebitorTitle_pstlz}"/>
                    </f:facet>
                    <h:outputText value="#{debitors.pstlz}"/>
                </p:column>

                <p:column>
                    <f:facet name="header">
                        <h:outputText value="#{bundle.ListDebitorTitle_smtpaddr}"/>
                    </f:facet>
                    <h:outputText value="#{debitors.smtpaddr}"/>
                </p:column>

                <p:column>
                    <f:facet name="header">
                        <h:outputText value="#{bundle.ListDebitorTitle_stras}"/>
                    </f:facet>
                    <h:outputText value="#{debitors.stras}"/>
                </p:column>

                <p:column>
                    <f:facet name="header">
                        <h:outputText value="#{bundle.ListDebitorTitle_land1}"/>
                    </f:facet>
                    <h:outputText value="#{debitors.land1.country}"/>
                </p:column>

                <p:column>
                    <f:facet name="header">
                        <h:outputText value="#{bundle.ListDebitorTitle_telf1}"/>
                    </f:facet>
                    <h:outputText value="#{debitors.telf1}"/>
                </p:column>

                <p:column>
                    <f:facet name="header">
                        <h:outputText value="#{bundle.ListDebitorTitle_telfx}"/>
                    </f:facet>
                    <h:outputText value="#{debitors.telfx}"/>
                </p:column>
                <p:column>
                    <f:facet name="header">
                        <h:outputText value="Hauptzielgruppe"/>
                    </f:facet>
                    <h:outputText value="#{debitors.brsch.maintarget}"/>
                </p:column>
                 <p:column >
                    <f:facet name="header">
                        <h:outputText value="Unterzielgruppe"/>
                    </f:facet>
                    <h:outputText value="#{debitors.brsch.subtarget}"/>
                </p:column>




                <p:column>
                    <h:panelGrid columns="2" styleClass="actions" id="buttonPanel">  

                      <p:commandButton id="insertbutton" update=":form:display" value="Insert" title="Insert"> 
                 </p:commandButton>  
                        <p:commandButton disabled="#{tableBean.isButtonDisabled}" id="var22" update=":form:display" value="Update" title="Update"> 
                 </p:commandButton>  
                    </h:panelGrid>  
                </p:column> 

            </p:dataTable>
</p:panel>  

          <div style="background-color:#D01C2E; width:100%; height:12px;"></div>

            <p:panel header="Related Accounts">    
                 <p:dataTable id="debAccTable"                
                var="debAcc" 
                rows="5"
                paginator="true"
                update="debTable"
                value="#{tableBean.debAcclst}"
                selection="#{tableBean.selectedAccRec}"
                rowSelectListener="#{tableBean.onDecAccSelect}"  
                selectionMode="single"          
                paginatorTemplate="{CurrentPageReport}  {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}"  
                rowsPerPageTemplate="3,5,10"
                 >                
        <p:column selectionMode="single">


            </p:column>
                <p:column>
                    <f:facet name="header">
                        <h:outputText value="#{bundle.ListDebAccTitle_id_row_id}"/>
                    </f:facet>
                    <h:outputText value="#{debAcc.id.row_id}"/>
                </p:column>
                <p:column>
                    <f:facet name="header">
                        <h:outputText value="#{bundle.ListDebAccTitle_accountname}"/>
                    </f:facet>
                    <h:outputText value="#{debAcc.accountname}"/>
                </p:column>
                <p:column>
                    <f:facet name="header">
                        <h:outputText value="#{bundle.ListDebAccTitle_streetaddress}"/>
                    </f:facet>
                    <h:outputText value="#{debAcc.streetaddress}"/>
                </p:column>
                <p:column>
                    <f:facet name="header">
                        <h:outputText value="#{bundle.ListDebAccTitle_odkundennummer}"/>
                    </f:facet>
                    <h:outputText value="#{debAcc.odkundennummer}"/>
                </p:column>
                <p:column>
                    <f:facet name="header">
                        <h:outputText value="#{bundle.ListDebAccTitle_plz}"/>
                    </f:facet>
                    <h:outputText value="#{debAcc.plz}"/>
                </p:column>
                <p:column>
                    <f:facet name="header">
                        <h:outputText value="#{bundle.ListDebAccTitle_city}"/>
                    </f:facet>
                    <h:outputText value="#{debAcc.city}"/>
                </p:column>
                <p:column>
                    <f:facet name="header">
                        <h:outputText value="#{bundle.ListDebAccTitle_name2}"/>
                    </f:facet>
                    <h:outputText value="#{debAcc.name2}"/>
                </p:column>
                <p:column>
                    <f:facet name="header">
                        <h:outputText value="#{bundle.ListDebAccTitle_name3}"/>
                    </f:facet>
                    <h:outputText value="#{debAcc.name3}"/>
                </p:column>
                <p:column>
                    <f:facet name="header">
                        <h:outputText value="#{bundle.ListDebAccTitle_hauptzielgruppe}"/>
                    </f:facet>
                    <h:outputText value="#{debAcc.hauptzielgruppe}"/>
                </p:column>
                <p:column>
                    <f:facet name="header">
                        <h:outputText value="#{bundle.ListDebAccTitle_unterzielgruppe}"/>
                    </f:facet>
                    <h:outputText value="#{debAcc.unterzielgruppe}"/>
                </p:column>
                <p:column>
                    <f:facet name="header">
                        <h:outputText value="#{bundle.ListDebAccTitle_email}"/>
                    </f:facet>
                    <h:outputText value="#{debAcc.email}"/>
                </p:column>
                <p:column>
                    <f:facet name="header">
                        <h:outputText value="#{bundle.ListDebAccTitle_tel}"/>
                    </f:facet>
                    <h:outputText value="#{debAcc.tel}"/>
                </p:column>
                <p:column>
                    <f:facet name="header">
                        <h:outputText value="#{bundle.ListDebAccTitle_saploeschen}"/>
                    </f:facet>
                    <h:outputText value="#{debAcc.saploeschen}"/>
                </p:column>
                <p:column>
                    <f:facet name="header">
                        <h:outputText value="#{bundle.ListDebAccTitle_fax}"/>
                    </f:facet>
                    <h:outputText value="#{debAcc.fax}"/>
                </p:column>
                <p:column>
                    <f:facet name="header">
                        <h:outputText value="#{bundle.ListDebAccTitle_deb}"/>
                    </f:facet>
                    <h:outputText value="#{debAcc.deb}"/>
                </p:column>

            </p:dataTable> 
            </p:panel>
        </h:form>
    </h:body>
</html>

我认为您不需要 Tablebean，因为一切背后的逻辑都运行良好，它只是显示问题和 XHTML 属性。但是，如果需要，我会提供。还要注意，在 XHTML 中，我目前正在处理很多事情，所以那里可能有一些多余的东西。

【问题讨论】：

标签： xhtml jsf-2 datatable primefaces

【解决方案1】：

您使用的是哪个版本的 primefaces？

1) 我现在使用的是 PrimeFaces 3.0，我很确定每个表格单元格都会呈现一个唯一的 ID。因此，表格单元格内的元素也应该获得唯一的 ID。我想您的问题是您需要知道按钮的 ID 才能更新其状态。我想最简单的方法是更新整个数据表组件而不是更新按钮。您可以考虑查看已添加到数据表中的输入和输出方面：http://www.primefaces.org/showcase/ui/datatableEditing.jsf

2) 对我来说似乎是 CSS 的问题。您是否尝试过将自己的样式应用到 CSS 类 ui-state-highlight？您可以使用 Firebug 之类的工具来找出未应用您的样式的原因。也许你需要制定一些规则!important。

3) 我不确定您所说的“放大桌子”是什么意思。但我想将您自己的 CSS 样式应用于表格可能是解决您的问题的方法。

祝你好运.-)

【讨论】：