2009-11-30 7 views
6

私はselectonemenuを持っています。ここでは、選択の変更によってユーザーが関連するページに移動する必要があります。ValueChangeEventからJSFページをリロードする方法は?

したがって、selectonemenuコントロールを使用してコマンドボタンのアクション処理をシミュレートするにはどうすればいいですか?

答えて

13

これはJavascriptの回りを回ることはできません。基本的には、Javascriptにリクエストをサーバー側に提出させる必要があります。 HTML <select>要素(JSF h:selectOneMenuによって生成された要素)では、onchange属性を使用することをお勧めします。このイベントにアタッチしたJSは、ユーザーが要素の値を変更するたびに呼び出されます。

<h:selectOneMenu onchange="this.form.submit();"> 

か、書面で怠惰している場合、この速記にも正しいです:

<h:selectOneMenu onchange="submit()"> 

これがされているのと同じ形式(内部firstnext HTML input type="submit"要素と組み合わせてフォームを送信しますJSFによって生成されますh:commandButton)。

<h:form> 
    <h:selectOneMenu value="#{bean.page}" onchange="submit()" required="true"> 
     <f:selectItem itemLabel="Select page.." /> 
     <f:selectItems value="#{bean.pages}" /> 
    </h:selectOneMenu> 
    <h:commandButton value="submit" action="#{bean.submit}" /> 
    <h:commandButton value="other" action="#{bean.other}" /> <!-- won't be submitted --> 
</h:form> 

あなたは場所を取るべきfaces-config.xmlに定義したようなもののナビゲーションアクションを発生させるアクションメソッドのロジックを記述する必要があります。例:

public String submit() { 
    return this.page; 
} 

あなたがない、あなたはまた、valueChangeListenerを乱用して先に行くことができ、commandButtonを使いたいならば:

あなたが持っている豆で
<h:form> 
    <h:selectOneMenu value="#{bean.page}" onchange="submit()" 
     valueChangeListener="#{bean.change}" required="true"> 
     <f:selectItem itemLabel="Select page.." /> 
     <f:selectItems value="#{bean.pages}" /> 
    </h:selectOneMenu> 
</h:form> 

public void change(ValueChangeEvent event) { 
    String page = (String) event.getNewValue(); // Must however be the exact page URL. E.g. "contact.jsf". 
    FacesContext.getCurrentInstance().getExternalContext().redirect(page); 
} 

また、既に希望のURLがf:selectItemの値であれば、先に進むこともできますJSのみ、Beanアクションはありません:

<h:selectOneMenu value="#{bean.page}" 
    onchange="window.location = this.options[this.selectedIndex].value"> 
    <f:selectItem itemLabel="Select page.." /> 
    <f:selectItem itemLabel="home" itemValue="home.jsf" /> 
    <f:selectItem itemLabel="faq" itemValue="faq.jsf" /> 
    <f:selectItem itemLabel="contact" itemValue="contact.jsf" /> 
</h:selectOneMenu> 
4
<h:selectOneMenu onchange="document.getElementById('myform').submit();" ...> 
関連する問題