使用JSF中的javascript傳遞的變量觸發commandButton操作

Question

我正在嘗試從我的Ajax調用。 xhtml頁面到我的后台ManagedBean函數如下所示：

.xhtml表單代碼

            <h:form id = "jsfform">
                <h:commandButton id="button" action="#{cellBean.children()}">
                    <f:ajax render=":results" />
                </h:commandButton> </h:form>
            <h:panelGroup id="results">
                <th>Child cells</th>
                <td>
                <ui:repeat value="#{cellBean.childCells}" var="cell">
                        <tr>#{cell.cellName}</tr>
                </ui:repeat>
                </td>
            </h:panelGroup>

托管bean的功能代碼

 public List<Cell> children(){
    this.childCells.add(new Cell("cell1"));
    return this.childCells;
}

上面的代碼工作正常，因為每次觸發commandButton時，一個新的“ Cell ”對象被添加到列表中並在我的表單中異步呈現。

我使用棘手的方式從javascript觸發commandButton （這在我看來不是最好的選擇）

document.getElementById('jsfform:button').onclick();

我現在想要實現的是做類似的事情，但是使用帶有參數的cellBean.children函數（列表中的字符串），將它傳遞給支持bean函數並執行操作，我該怎么辦？ 顯然我不能像以前那樣觸發commandButton，因為我無法傳遞這樣的參數

例：

        <h:form id = "jsfform">
            <h:commandButton id="button" action="#{cellBean.children(a_list)}">
                <f:ajax render=":results" />
            </h:commandButton> </h:form>
        <h:panelGroup id="results">
            <th>Child cells</th>
            <td>
            <ui:repeat value="#{cellBean.childCells}" var="cell">
                    <tr>#{cell.cellName}</tr>
            </ui:repeat>
            </td>
        </h:panelGroup>


public List<Cell> children(List<String> alist){
    this.childCells.add(new Cell("cell1"));
    return this.childCells;
}

提前致謝。

=============== 更新 ==================

按照這個例子 ，我到目前為止嘗試的是：

.xhtml表單

 <h:form id = "jsfform">
                <h:inputHidden id="childCells" value="#{cellBean.childCellsStr}" />
                <h:inputHidden id="parentCells" value="#{cellBean.parentCellsStr}" />
                <h:commandButton id="button"  style="display: none" action="#{cellBean.children()}">
                    <f:actionListener binding="#{cellBean.checkBtnDisable()}" /> 
                    <f:ajax render=":ajaxform"/>
                </h:commandButton>

Javascript代碼

  // json1 && json2 are two json strings
document.getElementById('jsfform:childCells').value = json1;
document.getElementById('jsfform:parentCells').value = json2;
//trigger the button of the form with javascript
document.getElementById('jsfform:button').onclick();

管理Bean

private String childCellsStr;
private String parentCellsStr;
//getters && setters

不幸的是，即使設置了inputHidden字段的值， 也不會觸發支持bean設置器，並且值為null

Answer 1

我所要做的就是在標記中添加execute參數（遵循本教程 ）。 現在調用setter並且backing beans獲取我想要的值

.xhtml代碼

<h:form id = "jsfform">
                <h:inputHidden id="childCells" value="#{cellBean.childCellsStr}" />
                <h:inputHidden id="parentCells" value="#{cellBean.parentCellsStr}" />
                <h:commandButton id="button"  style="display: none" action="#{cellBean.children()}">
                    <f:actionListener binding="#{cellBean.checkBtnDisable()}" /> <!--first call the children function, then call the checkBtnDisable -->
                    <f:ajax execute="childCells parentCells" render=":ajaxform"/>
                </h:commandButton>
            </h:form>

Javascript代碼

    document.getElementById('jsfform:childCells').value = json1;
document.getElementById('jsfform:parentCells').value = json2;
//trigger the button of the form with javascript
document.getElementById('jsfform:button').onclick();

Java Bean

private String childCellsStr;
private String parentCellsStr;
//getters && setters