Jakarta ee JSF2搜索框_Jakarta Ee_Jsf 2

Jakarta ee JSF2搜索框

jakarta-ee jsf-2

Jakarta ee JSF2搜索框,jakarta-ee,jsf-2,Jakarta Ee,Jsf 2,我用javaee6和jsf2开发了一个小应用程序。我想要一个没有按钮的搜索字段（只需键入并按enter键并给出结果）。我在bean中有一个搜索方法： public Book searchByTitle(String title) { this.book = bookFacade.searchByTitle(title); return book; } 我想通过jsf页面调用这个方法（带参数？可能吗？），所以我尝试这样做： <h:form>

我用javaee6和jsf2开发了一个小应用程序。我想要一个没有按钮的搜索字段（只需键入并按enter键并给出结果）。我在bean中有一个搜索方法：

public Book searchByTitle(String title) {
    this.book = bookFacade.searchByTitle(title);
    return book;
}

我想通过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>

但这是行不通的。在jsf2 xhtml页面中搜索字段的正确方法是什么

编辑：我尝试调用searchByTitle函数（带/不带参数）

提前谢谢

在jsf页面中使用以下代码：

<h:form>
    <h:inputText id="search" value="#{bookBean.searchString}"></h:inputText>
    <h:commandButton value="Search by title" action="#{bookBean.searchByTitle(bookBean.searchString)}">
        <f:ajax execute="search" render="output"></f:ajax>
    </h:commandButton>
    <h2><h:outputText id="output" value="#{bookBean.book.title}"></h:outputText>
    </h2>
</h:form>

编辑：

首先，就从jsf页面传递参数而言，只有当您想将一个bean的属性传递给另一个bean时，才应该使用它。在您的例子中，它不是必需的，因为您正在设置同一个bean的属性（searchString），并将其传递给同一个bean

你的第二个问题：你想让搜索在没有搜索按钮的情况下工作：你可以通过在

h:inputText

中添加

valueChangeListener

来实现。并将

f:ajax的event
属性设置为blur

<h:form>
    <h:inputText id="search" value="#{bookBean.searchString}" valueChangeListener="#{bookBean.searchStringChanged}">
        <f:ajax execute="search" render="output" event="blur" />
    </h:inputText>
    <h2><h:outputText id="output" value="#{bookBean.book.title}" />
    </h2>
</h:form>

第一步，如果您正在使用与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>

在Facelet中，注意h:head
元素的重要性。没有它，JSF就不知道在响应中插入AJAX支持所需的脚本
在本例中，只要用户按下enter键，就会调用JSF在将f:ajax
客户端行为添加到所谓的EditableValueHolder
s时生成的默认onchange
方法。listener属性导致在AJAX事件上调用方法。由于searchString
已绑定到支持bean的属性，因此不必将其作为参数提供给侦听器方法
这种方法的一个小缺点是，当您更改搜索字段中的值并在其外部单击时，也会调用AJAX调用
更新
将onchange
处理程序添加到h:inputText
修复了上述问题。JSF会自动将其与来自客户端行为的AJAX代码链接起来。如果返回false，链将中止，因此AJAX调用不会发生
如果处理程序由实际更改事件触发，则处理程序onchange=“return event.keyCode！==undefined”
将返回false；事件对象将不再具有keyCode
属性。
谢谢，它可以工作！（不幸的是，出现了另一个错误，所以我的代码也应该可以工作）还有两个问题：它值得使用吗？我的意思是我可以将searchString传递给bean中的搜索方法。（是的，我想传递参数（-：）第二个问题：我如何隐藏命令按钮？再次感谢！它很好而且简单，我不传递不必要的参数（-）：上下文参数完全没有必要。OP已经在使用Java EE 6。为什么模糊？我以为OP要求按enter键？是相同的吗？>为什么模糊？我以为OP要求按enter键？是相同的吗？
-只要焦点从输入组件移开，就会触发模糊。现在按enter键将触发ger是一个完整的表单提交。我想这就是为什么使用了valueChangeListener
，因为这样的完整表单提交不会调用f:ajax侦听器。我认为这不是OP要求的。
public void searchStringValueChanged(ValueChangeEvent vce)
{
    searchByTitle((String) vce.getNewValue);
}

<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>

@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;
    }

}