Question

我正在尝试使用myfaces jsf2.2.8 passThroughAttribute将data-priority属性添加到dataTable的列标题＆lt; th＆gt ;.但它似乎没有起作用。奇怪的是，它适用于＆lt; table＆gt;。

以下是jsf代码：

<!DOCTYPE html>
<html 
    xmlns="http://www.w3.org/1999/xhtml"
    xmlns:f="http://xmlns.jcp.org/jsf/core"
    xmlns:h="http://xmlns.jcp.org/jsf/html"
    xmlns:a="http://xmlns.jcp.org/jsf/passthrough"
    xmlns:ui="http://xmlns.jcp.org/jsf/facelets"
    class="ui-mobile">

<h:head>
    <meta content="text/html; charset=iso-8859-1" http-equiv="Content-Type" />
    <meta name="viewport" content="width=device-width, initial-scale=1" /> 
    <link rel="stylesheet" href="#{request.contextPath}#{resource['default:css/itMobile.css']}&amp;v=#{myacctResources['it.css.version']}" type="text/css" />
    <link rel="stylesheet" href="/resources/default/1_0/css/jqueryMobile1.4.5-myam-theme/jquery.mobile.myam.theme.min.css?v=#{myacctResources['it.js.version']}" />
    <link rel="stylesheet" href="/resources/default/1_0/css/jqueryMobile1.4.5-myam-theme/jquery.mobile.icons.min.css?v=#{myacctResources['it.js.version']}" />
    <link rel="stylesheet" href="/resources/default/1_0/css/jquery.mobile.structure-1.4.5.min.css?v=#{myacctResources['it.js.version']}" /> 
    <script type="text/javascript" src="#{request.contextPath}#{resource['default:js/jquery.js']}&amp;v=#{myacctResources['it.js.version']}"></script>  
    <script type="text/javascript" src="/resources/default/1_0/js/jquery.mobile-1.4.5.js?v=#{myacctResources['it.js.version']}"></script>   

    <script>
      //<![CDATA[
      $(document).ready(function(){
      });
      //]]>
    </script>
</h:head>

<h:body>
    <h:dataTable a:data-role="table" a:data-mode="columntoggle" a:data-column-btn-text="col" styleClass="ui-responsive myList" id="myList" value="#{testBean.myListModel}" var="item">

        <h:column rowHeader="true">
            <f:passThroughAttribute name="data-priority" value="1"/>
            <f:facet name="header">
                Seq
            </f:facet>                      
            <h:outputText value="#{item.seq}" />
        </h:column>

        <h:column>
            <f:passThroughAttribute name="data-priority" value="2"/>
            <f:facet name="header">
                Value
            </f:facet>                      
            <h:outputText value="#{item.value}" />
        </h:column>
    </h:dataTable>  
</h:body>
</html>

以下是我得到的结果

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" class="ui-mobile">
<head>
    <meta content="text/html; charset=iso-8859-1" http-equiv="Content-Type" />
    <meta name="viewport" content="width=device-width, initial-scale=1" /> 
    <link rel="stylesheet" href="/javax.faces.resource/css/itMobile.css.jsf?ln=default&amp;v=05152015g" type="text/css" />
    <link rel="stylesheet" href="/resources/default/1_0/css/jqueryMobile1.4.5-myam-theme/jquery.mobile.myam.theme.min.css?v=05152015g" />
    <link rel="stylesheet" href="/resources/default/1_0/css/jqueryMobile1.4.5-myam-theme/jquery.mobile.icons.min.css?v=05152015g" />
    <link rel="stylesheet" href="/resources/default/1_0/css/jquery.mobile.structure-1.4.5.min.css?v=05152015g" /> 
    <script type="text/javascript" src="/javax.faces.resource/js/jquery.js.jsf?ln=default&amp;v=05152015g"></script>    
    <script type="text/javascript" src="/resources/default/1_0/js/jquery.mobile-1.4.5.js?v=05152015g"></script> 

    <script>
      //<![CDATA[
      $(document).ready(function(){
      });
      //]]>
    </script>
</head>
<body>
    <table id="myList" class="ui-responsive myList" data-column-btn-text="col" data-mode="columntoggle" data-role="table">
        <thead>
            <tr>
                <th scope="col">Seq</th>
                <th scope="col">Value</th>
            </tr>
        </thead>
        <tbody id="myList:tbody_element"> 
            <tr> 
                <th scope="row">1</th>
                <td>itsy</td>
            </tr>
            <tr>
                <th scope="row">2</th>
                <td>bitsy</td>
            </tr>
            <tr>
                <th scope="row">3</th>
                <td>spider</td>
            </tr>
        </tbody>
    </table>
</body>
</html>

正如您在结果中看到的，表passThroughAttribute正常工作： a：data-role =“table”和＆lt; f：passThroughAttribute name =“data-model”value =“columntoggle”/＆gt;显示在表元素

中

但是th passThroughAttribute不是。

当我使用mojarra 2.2.11尝试相同的jsf页面时，我遇到了其他问题。为h：列指定的passThroughAttribute正被添加到＆lt; th＆gt;。但它也被添加到＆lt; td＆gt;。我只希望它在＆lt; th＆gt;在dataTable上指定的passThroughAttribute将添加到＆lt; table＆gt;，＆lt; thead＆gt;，＆lt; tbody＆gt;和＆lt; tr＆gt;。我只希望它在＆lt; table＆gt;上仅

以下是结果页面：

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" class="ui-mobile">
<head id="j_idt2">
    <meta content="text/html; charset=iso-8859-1" http-equiv="Content-Type" />
    <meta name="viewport" content="width=device-width, initial-scale=1" /> 
    <link rel="stylesheet" href="/javax.faces.resource/css/itMobile.css.jsf?ln=default&amp;v=1_0&amp;v=05152015g" type="text/css" />
    <link rel="stylesheet" href="/resources/default/1_0/css/jqueryMobile1.4.5-myam-theme/jquery.mobile.myam.theme.min.css?v=05152015g" />
    <link rel="stylesheet" href="/resources/default/1_0/css/jqueryMobile1.4.5-myam-theme/jquery.mobile.icons.min.css?v=05152015g" />
    <link rel="stylesheet" href="/resources/default/1_0/css/jquery.mobile.structure-1.4.5.min.css?v=05152015g" /> 
    <script type="text/javascript" src="/javax.faces.resource/js/jquery.js.jsf?ln=default&amp;v=1_0&amp;v=05152015g"></script>  
    <script type="text/javascript" src="/resources/default/1_0/js/jquery.mobile-1.4.5.js?v=05152015g"></script> 

    <script>
      //<![CDATA[
      $(document).ready(function(){
      });
      //]]>
    </script>
</head>
<body>
    <table id="myList" class="ui-responsive myList" data-role="table" data-column-btn-text="col" data-mode="columntoggle">
        <thead data-role="table" data-column-btn-text="col" data-mode="columntoggle">
            <tr data-role="table" data-column-btn-text="col" data-mode="columntoggle">
                <th scope="col" data-priority="1">
                    Seq
                </th>
                <th scope="col" data-priority="2">
                    Value
                </th>
            </tr>
        </thead>
        <tbody data-role="table" data-column-btn-text="col" data-mode="columntoggle">
            <tr data-role="table" data-column-btn-text="col" data-mode="columntoggle">
                <th scope="row" data-priority="1">1</th>
                    <td data-priority="2">itsy</td>
            </tr>
            <tr data-role="table" data-column-btn-text="col" data-mode="columntoggle">
                <th scope="row" data-priority="1">2</th>
                <td data-priority="2">bitsy</td>
            </tr>
            <tr data-role="table" data-column-btn-text="col" data-mode="columntoggle">
                <th scope="row" data-priority="1">3</th>
                <td data-priority="2">spider</td>
            </tr>
        </tbody>
    </table>
</body>
</html>

Answer 1

它现在无法正常工作，因为您在错误的项目上应用了<f:passThroughAttribute/>。在一天结束时，它仍然是h:column呈现为th，这就是为什么你应该在其上应用直通，而不是{{1} }}。所以你应该拥有的是

f:facet

jsf 2.2 passThroughAttribute适用于表但不适用于

1 个答案: