Question

I want to load data to datatable when commandButton pressed in primefaces. When page load first, the datatable must be empty but after clicked the commandButton, the datatable must be loaded! How can I do. I’m newbie at the primefaces.

Answer 1

From what you described in your question, here is a sample (This is just a working sample of what @Manuel described). Since the List on the backing bean is empty, at initial render, the datatable will be empty. When you click the commandbutton, it will fire the doPopulateList() method. This method will then populate the list. Finally, the update attribute will cause the datatable to reload the list from the backing bean. This time the List will be populated with 4 records.

<h:body>
    <h:form>
        <p:dataTable id="fooTable" value="#{dataTableBean.dataTableList}" var="record">
            <p:column><h:outputText value="#{record}"/></p:column>
        </p:dataTable>

        <p:commandButton value="Populate DataTable" actionListener="#{dataTableBean.doPopulateList()}" update="fooTable"/>
    </h:form>
</h:body>

DataTableSample backing bean:

@ManagedBean
@ViewScoped
public class DataTableBean implements Serializable {
    List<String> dataTableList = new ArrayList<String>();

    /**
     * @return the dataTableList
     */
    public List<String> getDataTableList() {
        return dataTableList;
    }

    /**
     * @param dataTableList the dataTableList to set
     */
    public void setDataTableList(List<String> dataTableList) {
        this.dataTableList = dataTableList;
    }

    public void doPopulateList(){
        dataTableList.add("Record1");
        dataTableList.add("Record2");
        dataTableList.add("Record3");
        dataTableList.add("Record4");
    }
}