我在javaee6和jsf2中开发了一个小应用程序.我想要一个没有按钮的搜索字段(只需键入并按Enter键并给出结果).我在bean中有一个搜索方法:
public Book searchByTitle(String title) {
this.book = bookFacade.searchByTitle(title);
return book;
}
Run Code Online (Sandbox Code Playgroud)
我想通过jsf页面调用此方法(带参数?可能吗?),所以我尝试这样做:
<h:form>
<h:inputText id="search" value="#{bookBean.searchString}"></h:inputText>
<h:commandButton value="Search by title" action="#{bookBean.searchByTitle}">
<f:ajax execute="search" render="output"></f:ajax>
</h:commandButton>
<h2><h:outputText id="output" value="#{bookBean.book.title}"></h:outputText>
</h2>
</h:form>
Run Code Online (Sandbox Code Playgroud)
但这不起作用.在jsf2 xhtml页面中执行搜索字段的正确方法是什么?
编辑:我试图使用/不带参数调用searchByTitle函数.
提前致谢!
第一步,如果您使用的是Java EE 6兼容容器(如GlassFish V3,Resin 4,JBoss AS 6或7等),并且在WEB-INF中放置了类似commons-el.jar的内容,请将其删除.这不是必需的,只会造成伤害.
我想要一个没有按钮的搜索字段(只需键入并按Enter键并给出结果)
在这种情况下,您也不需要命令按钮,但可以使用以下内容:
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
>
<h:head/>
<h:body>
<h:form>
<h:inputText id="search" value="#{bookBean.searchString}"
onkeypress="if (event.keyCode == 13) {onchange(event); return false;}"
onchange="return event.keyCode !== undefined"
>
<f:ajax listener="#{bookBean.updateBook}" render="output" />
</h:inputText>
<h2>
<h:outputText id="output" value="#{bookBean.book}"/>
</h2>
</h:form>
</h:body>
</html>
Run Code Online (Sandbox Code Playgroud)
随着bookBean定义为:
@ViewScoped
@ManagedBean
public class BookBean {
private Map<String, String> exampleData = new HashMap<String, String>() {{
put("dune", "The Dune Book");
put("lotr", "The Lord of the Rings Book");
}};
private String searchString;
private String book;
public void updateBook(AjaxBehaviorEvent event) {
book = exampleData.get(searchString);
}
public String getSearchString() {
return searchString;
}
public void setSearchString(String searchString) {
this.searchString = searchString;
}
public String getBook() {
return book;
}
}
Run Code Online (Sandbox Code Playgroud)
在Facelet中,请注意h:head元素的重要性.没有它,JSF不知道在响应中为AJAX支持插入所需脚本的位置.
在该示例中,只要用户按Enter键,就会onchange在将f:ajax客户端行为添加到所谓的EditableValueHolders时调用JSF生成的默认方法.listener属性导致在AJAX事件上调用方法.由于searchString已绑定到辅助bean的属性,因此您不必将其作为参数提供给侦听器方法.
此方法的一个小缺点是,当您更改搜索字段中的值并只需在其外部单击时,也将调用AJAX调用.
更新
添加onchange处理程序以h:inputText修复上述问题.这由JSF自动链接来自客户端行为的AJAX代码.如果它返回false,则链被中止,因此不会发生AJAX调用.
onchange="return event.keyCode !== undefined"如果处理程序由真实更改事件触发,则处理程序将返回false; 然后事件对象将没有该keyCode属性.
| 归档时间: |
|
| 查看次数: |
12839 次 |
| 最近记录: |