Ajax更新中断了Primefaces数据表功能

Question

在我的应用程序中，我有一个PF布局，在西部有一个树节点，在中部有一个内容部分，我想在其中使用ajax技术动态加载不同的页面
为了获得它，这个内容部分包含一个ui:include标记和EL表达式。当用户单击树节点按钮时，页面会正确地呈现在中间（这很好！）。但datatable的一些功能（如排序）已损坏或丢失<此外，如果从web浏览器中完全刷新页面，一切正常。

为了给你们一个清晰的例子，我简化了我的项目
索引。xhtml：

    <p:layout fullPage="true">
        <p:layoutUnit position="north" size="100" header="Top">
        </p:layoutUnit>

        <p:layoutUnit position="west" size="100" resizable="true"> 
            <h:form>
            <p:tree id="menuTree" 
                    value="#{menuController.root}"
                    var="node" 
                    selection="#{menuController.selectedNode}"
                    selectionMode="single">  
                <p:ajax event="select" update=":content" listener="#{menuController.setPage(node)}" />
               <p:treeNode>
                   <h:outputText value="#{node}" />
               </p:treeNode>
            </p:tree>
            </h:form>
        </p:layoutUnit>
        <p:layoutUnit position="east" size="50"/>

        <p:layoutUnit position="south" size="60"/>

        <p:layoutUnit position="center" id="centerlayout">   
            <h:panelGroup id="content">
            <c:if test="${not empty menuController.page}">
                <ui:include src="#{menuController.page}.xhtml" />
            </c:if>
            </h:panelGroup>
        </p:layoutUnit>
    </p:layout>
</h:body>

我想指出的是，我曾尝试用EL更改ui:include，并使用容器h:panelGroup和静态ui:include的条件呈现，但问题仍然存在。

Tree菜单的后备bean：

@Named
@SessionScoped
public class MenuController implements Serializable {

private TreeNode root;  
private TreeNode selectedNode;
private String pageName;

public MenuController() {  
    root = new DefaultTreeNode("Root", null);  
    TreeNode node0 = new DefaultTreeNode("Node 0", root);  

    TreeNode node00 = new DefaultTreeNode("/list", node0);  
    TreeNode node01 = new DefaultTreeNode("/list2", node0);     
}  

public TreeNode getRoot() {  
    return root;  
} 

public TreeNode getSelectedNode() {
    return selectedNode;  
}  

public void setSelectedNode(TreeNode selectedNode) {  
    this.selectedNode = selectedNode;        
}     

public void setPage(String page){
    this.pageName = page;       
}
public String getPage(){       
    return this.pageName;
}     

包含数据表列表的页面。xhtml（请注意，列表2.xhtml是相等的，将一些文本更改为“观看”内容更新）：

<ui:composition>  

<h:form id="ItemListForm">

    <p:panel header="Title">

        <p:dataTable id="datalist" value="#{itemController.items}" var="item"
                     selectionMode="single" selection="#{itemController.selected}"
                     rowKey="#{item.itemid}"
                     paginator="true"
                     rows="10"
                     rowsPerPageTemplate="10,20,30" >

            <p:column sortBy="#{item.itemid}" filterBy="#{item.itemid}">
                <f:facet name="header">
                    <h:outputText value="Id"/>
                </f:facet>
                <h:outputText value="#{item.itemid}"/>
            </p:column>
            <p:column sortBy="#{item.productid}" filterBy="#{item.productid}">
                <f:facet name="header">
                    <h:outputText value="ProductId"/>
                </f:facet>
                <h:outputText value="#{item.productid}"/>
            </p:column>
            <p:column sortBy="#{item.name}" filterBy="#{item.name}">
                <f:facet name="header">
                    <h:outputText value="Name"/>
                </f:facet>
                <h:outputText value="#{item.name}"/>
            </p:column>
            <p:column sortBy="#{item.description}" filterBy="#{item.description}">
                <f:facet name="header">
                    <h:outputText value="Description"/>
                </f:facet>
                <h:outputText value="#{item.description}"/>
            </p:column>
        </p:dataTable>
    </p:panel>
</h:form>

ItemController bean：

@Named
@SessionScoped
public class ItemController implements Serializable {
private Item selected;
private List<Item> items;


public ItemController() {
    this.items = new ArrayList<>();
    this.items.add(new Item("1", "1", "Product 1", "testing sorting"));
    this.items.add(new Item("3", "3", "Product 3", "testing sorting"));
    this.items.add(new Item("2", "2", "Product 2", "testing sorting"));
    this.items.add(new Item("4", "4", "Product 4", "testing sorting"));
    this.items.add(new Item("5", "5", "Product 5", "testing sorting"));
    this.items.add(new Item("6", "6", "Product 6", "testing sorting"));
}

public Item getSelected() {
    return selected;
}

public void setSelected(Item selected) {
    this.selected = selected;
}    

public List<Item> getItems() {
    return items;
}

class项非常简单：

public class Item implements Serializable {

private String itemid;

private String productid;

private String name;

private String description;


public Item() {
}

public Item(String itemid) {
    this.itemid = itemid;
}

public Item(String itemid, String productid, String name, String description) {
    this.itemid = itemid;
    this.productid = productid;
    this.name = name;
    this.description = description;
}

public String getItemid() {
    return itemid;
}

public void setItemid(String itemid) {
    this.itemid = itemid;
}

public String getProductid() {
    return productid;
}

public void setProductid(String productid) {
    this.productid = productid;
}

public String getName() {
    return name;
}

public void setName(String name) {
    this.name = name;
}

public String getDescription() {
    return description;
}

public void setDescription(String description) {
    this.description = description;
}

最后，我正在使用：
JavaEE 7
PrimeFaces 3.5社区
JSF 2.2
Glassfish 4
NetBeans 7.3.1
Safari浏览器




Answer 1

很抱歉，我英语说得不好，但这是因为PF在页面中只包含成功呈现页面上存在的组件所需的javascript。如果您使用例如ui:include将组件直接包含到页面中，则页面将不包含用于呈现该组件的js

Answer 2

问题是，taht Primefaces 3.5与glassfish 4切换到Primefaces 4.0-SNAPSHOT不匹配，我想它可能会工作