ajax - ajaxを使用してJSFデータテーブルを更新する方法

Question

コマンドボタンを押してデータテーブルを使用して入力テキストを動的に追加していますが、行が追加されるたびにページが更新され、ajaxを使用してページを更新せずにデータテーブルに行を追加できます。ここにコードがあります

<h:form>

    <h:dataTable id="table" value="#{dataTableBean.cities}" var="city">
        <h:column>
            <f:facet name="header">
                <h:outputText value="City name" />
            </f:facet>
            <h:inputText value="#{city}" />
        </h:column>
    </h:dataTable>

    <h:commandButton value="Add one more city" id="ajax" update="table"
        actionListener="#{dataTableBean.enlargeList}" />
    <h:commandButton value="Submit" actionListener="#{dataTableBean.processList}" />
</h:form>