为什么JQuery数据表不能使用richfaces <a4j:repeat>？

我使用的是JSF2.2和Richfaces 4，我尝试使用Jquery的Datatables创建一个表。因为我所有的数据都是动态的，所以我必须使用它。但它给了我一个jsf空表。为什么JQuery数据表不能使用richfaces <a4j:repeat>？

这是我的JSF页面：

<ui:composition xmlns="http://www.w3.org/1999/xhtml" 
xmlns:h="http://java.sun.com/jsf/html" 
xmlns:f="http://java.sun.com/jsf/core" 
xmlns:ui="http://java.sun.com/jsf/facelets" 
xmlns:a4j="http://richfaces.org/a4j" 
xmlns:p="http://java.sun.com/jsf/passthrough" 
xmlns:rich="http://richfaces.org/rich"> 
<h:head> 
    <script type="text/javascript" src="js/jquery.dataTables.min.js"></script> 
    <link rel="stylesheet" type="text/css" href="css/jquery.dataTables.css"/> 
<script> 
$(document).ready(function() { 
    $('#example').dataTable(); 
}); 
</script> 
</h:head> 
<h:body> 
    <h:form> 
     <h:panelGroup id="tableau"> 
      <table id="example" class="display compact" cellspacing="0" 
       width="100%"> 


       <a4j:repeat value="#{auditController.findAllEntityList()}" 
        var="entity" rowKeyVar="rowentity"> 


        <thead> 
         <tr> 
          <a4j:repeat 
           value="#{Controller.findP(entity).entrySet().toArray()}" 
           var="entete1"> 
           <th><h:outputLabel value="#{entete1.key}" 
             rendered="#{rowentity eq 0 and entete1.key !='class'}" /></th> 
          </a4j:repeat> 
         </tr> 
        </thead> 
        <tbody> 
         <tr> 
          <a4j:repeat 
           value="#{Controller.findP(entity).entrySet().toArray()}" 
           var="entete"> 
           <td><h:outputLabel value="#{entete.value}"/></td> 
          </a4j:repeat> 
          </tr> 
        </tbody> 
       </a4j:repeat> 

      </table> 
     </h:panelGroup> 
    </h:form> 
</h:body>

没有jQuery的它完美的作品。

来源

2015-02-12 TinyOS

看，如果源代码包含您的数据。也许这只是一个CSS问题。并不'jquery.dataTables'需要'jquery'也被加载？ – 2015-02-12 08:49:58

正如我所说的，当我使用一个html表格时，jsf向我显示该表格与来自我的javabean的数据，但是当我使用数据表格时，情况并非如此。我认为它不兼容像这样的richfaces组件，不是吗？注意：使用数据库，它为我提供了一个没有jQuery功能的小型css表格。 – TinyOS 2015-02-12 09:25:53

'A4J'将完成它的工作来创建页面HTML。一旦完成并且HTML被完全加载，'jquery'就会开始工作。所以我唯一可以看到的问题是所创建的HTML与您的调用不兼容。（或者jquery库加载不好） – 2015-02-12 09:38:13

我通过<ui:repeat>更换<a4j:repeat>和它的作品good.So我的代码如下所示：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<ui:composition xmlns="http://www.w3.org/1999/xhtml" 
xmlns:h="http://java.sun.com/jsf/html" 
xmlns:f="http://java.sun.com/jsf/core" 
xmlns:ui="http://java.sun.com/jsf/facelets" 
xmlns:p="http://java.sun.com/jsf/passthrough" 
xmlns:c="http://java.sun.com/jsp/jstl/core"> 
<h:head> 
    <title>test-test</title> 
    <link rel="stylesheet" type="text/css" href="css/jquery.dataTables.css" /> 
    <link rel="stylesheet" type="text/css" href="css/shCore.css" /> 
    <link rel="stylesheet" type="text/css" href="css/demo.css" /> 
    <style type="text/css" class="init"> 
</style> 
    <script type="text/javascript" language="javascript" src="js/jquery.js"></script> 
    <script type="text/javascript" language="javascript" src="js/jquery.dataTables.js"></script> 
    <script type="text/javascript" language="javascript" src="js/shCore.js"></script> 
    <script type="text/javascript" language="javascript" src="js/demo.js"></script> 
    <script type="text/javascript" language="javascript"> 
$(document).ready(function() { 
$('#example').dataTable({ 
    "bPaginate": true, 
    "bFilter": false, 
    "bInfo": false, 
    "bProcessing" : false, 
    "bJQueryUI" : true, 
    "sEmptyTable" : "No messages found", 
    });}); 


</script> 
</h:head> 
<h:body class="exampleLos"> 
    <h:form> 
    <h:panelGroup id="tableau"> 
      <table id="example" class="display compact" cellspacing="0" width="100%"> 
       <ui:repeat var="entity" 
        value="#{Controller.fAllList()}" varStatus="KeyVarSta"> 
        <thead> 
         <tr> 
          <ui:repeat 
           value="#{Controller.fPropreties(KeyVarSta.index).entrySet().toArray()}" var="entete1"> 
           <th><h:outputLabel value="#{entete1.key}" rendered="#{KeyVarSta.index == 0 and entete1.key !='class'}" /></th> 
          </ui:repeat> 
          <th><h:outputLabel value="Rev" rendered="#{KeyVarSta.index == 0}" /></th> 
          <th><h:outputLabel value="Rev Date" rendered="#{KeyVarSta.index == 0}" /></th> 
          <th><h:outputLabel value="Rev User" rendered="#{KeyVarSta.index == 0}" /></th> 
          <th><h:outputLabel value="Rev Type" rendered="#{KeyVarSta.index == 0}" /></th> 
         </tr> 
        </thead> 
        <tbody> 
         <tr> 
          <ui:repeat 
           value="#{Controller.fPropreties(KeyVarSta.index).entrySet().toArray()}" var="entete"> 
           <td><h:outputLabel value="#{entete.value}"rendered="#{entete.key !='class'}" /></td> 
          </ui:repeat> 
          <td><h:outputLabel 
            value="#{Controller.findREny(KeyVarSta.index).rev}" /></td> 
          <td><h:outputLabel 
            value="#{Controller.findREny(KeyVarSta.index).revdate}"> 
           </h:outputLabel></td> 
          <td><h:outputLabel 
            value="#{Controller.findREny(KeyVarSta.index).username}" /></td> 
          <td><h:outputLabel 
            value="#{Controller.findREnyType(KeyVarSta.index).name()}" /></td> 
         </tr> 
        </tbody> 
       </ui:repeat> 
      </table> 
     </h:panelGroup> 
    </h:form> 
</h:body>

来源

2015-02-12 20:49:55 TinyOS

为什么JQuery数据表不能使用richfaces <a4j:repeat>？

回答

相关问题