PrimeFaces dataTable not updating after Ajax request

Question

I'm currently working with a PrimeFaces dataTable and am trying endlessly to append a new to the dataTable immediately after the user adds it. Server-side, everything is working -- data is saved to both the database and hard disk. I'd like to see a partial-page update following the successful request, and I just can't seem to get it to work. Here is my XHTML code:

<div class="content">
        <div id="mainContent">

            <div class="topNav">
                <h:form id="navForm">
                    <p:commandButton value="Upload"/>
                    <p:commandButton value="New Folder" onclick="createDlg.show();" />
                    <p:commandButton value="Delete Folder" action="#" />
                </h:form>
            </div>

            <div id="filePanel">
                <h:form id="dataTable" prependId="false">     
                    <p:dialog header="Create" widgetVar="createDlg" modal="true" height="200">

                        <p:panel header="New Folder">
                            <h:panelGrid columns="2">
                                <h:outputLabel value="Name:" for="txt_name"></h:outputLabel>
                                <p:inputText id="txt_name" value="#{directoryController.newDir.name}" required="true" />
                                <p:commandButton value="Create" actionListener="#{directoryController.createNew}" update="dGrid" oncomplete="createDlg.hide();"/>
                                <p:ajaxStatus style="width:16px; height:16px;">
                                    <f:facet name="start">
                                        <h:outputText value="Saving..." />
                                    </f:facet>
                                    <f:facet name="">
                                        <h:outputText value="Complete." />
                                    </f:facet>
                                </p:ajaxStatus>
                            </h:panelGrid>
                        </p:panel>

                    </p:dialog>
                    <p:dataTable id="dGrid" value="#{directoryController.itemsByOwner}" var="dir">
                        <p:column selectionMode="multiple"/>
                        <p:column sortBy="#{dir.name}">                                
                            <f:facet name="header">
                                File Name
                            </f:facet>
                            <h:outputText value="#{dir.name}" />
                        </p:column>
                        <p:column>
                            <f:facet name="header">
                                File Size
                            </f:facet>
                        </p:column>
                    </p:dataTable>                                
                </h:form>                    
            </div>
        </div>
    </div>

And finally, here is my backing bean.

public String createNew(){
    newDir.setDateCreated(new Date());
    newDir.setDateModified(new Date());
    newDir.setId(BigDecimal.ZERO);
    newDir.setLocation(ROOT_DIRECTORY + currentUser.getUsername() + "/");
    newDir.setFilesCollection(f);
    newDir.setDescription("");
    newDir.setOwner(currentUser);
    current = newDir;
    create();
    persistDirectoryFromObject(newDir);
    newDir = new Directory();
    RequestContext.getCurrentInstance().addPartialUpdateTarget("dGrid");


    return null;
}

Answer 1

If you are using 3.0.M4 you could do:

... ...

<p:outputPanel autoUpdate="true">

                <p:dataTable id="dGrid" value="#{directoryController.itemsByOwner}" var="dir">
                    <p:column selectionMode="multiple"/>
                    <p:column sortBy="#{dir.name}">                                
                        <f:facet name="header">
                            File Name
                        </f:facet>
                        <h:outputText value="#{dir.name}" />
                    </p:column>
                    <p:column>
                        <f:facet name="header">
                            File Size
                        </f:facet>
                    </p:column>
                </p:dataTable>    
</p:outputPanel>

or you could simply:

<p:commandButton value="Create" action="#{directoryController.createNew}" oncomplete="createDlg.hide();" ajax="false" />