我有一个selectonemenu,其中选择的更改应该将用户导航到相关页面。
那么,如何使用selectonemenu控件模拟命令按钮的动作处理(或者有更优雅的方法来实现这一点)?
答案 0 :(得分:13)
你不能为此拍摄Javascript。基本上你需要让Javascript将请求提交给服务器端。在HTML <select>
元素(由JSF h:selectOneMenu
生成)中,您最好使用onchange
属性。只要用户更改元素的值,就会调用附加到此事件的任何JS。
<h:selectOneMenu onchange="this.form.submit();">
如果你在写作时很懒,这个简写也是正确的:
<h:selectOneMenu onchange="submit()">
这将在同一表单(由JSF input type="submit"
生成)中提交表单与第一个下一页HTML 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;
}
如果您不想要使用commandButton
,那么您也可以继续滥用valueChangeListener
:
<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>
答案 1 :(得分:4)
<h:selectOneMenu onchange="document.getElementById('myform').submit();" ...>