primefaces inputext onblur事件不起作用答案

【问题标题】：primefaces inputext onblur event not workingprimefaces inputext onblur事件不起作用
【发布时间】：2014-11-11 00:59:14
【问题描述】：

您好，我有一个关于模糊事件的 inputText，它将向支持 bean 发送信号，该 bean 包含一个布尔变量，用于确定是否启用另一个输入文本......但我不能让这个工作，这个是我的代码：

<ui:composition xmlns="http://www.w3.org/1999/xhtml"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:p="http://primefaces.org/ui"
template="/Template.xhtml">
<ui:define name="content">
<h:form id="someForm">
<p:growl id="msg" showDetail="true" life="3000"/>
<p:panelGrid border="0" id="panel">
<p:row>
<p:column width="350">
Title
</p:column>
<p:column colspan="2">
<p:inputText id="someId" value="#{someBean.somePropertie}">
<p:ajax event="blur" update="anotherInput" listener="#{someBean.onEvent}" />
</p:inputText>
</p:column>
</p:row>
<p:row>
<p:column width="350">title 2</p:column>
<p:column colspan="2">
<p:inputText id="anotherInput" converter="toUpperCaseConverter" value="#{someBean.somePropertie2}" 
disabled="#{someBean.bDisabled}"
/>
</p:column>
</p:row>
</p:panelGrid>
</h:form>
</ui:define>
</ui:composition>

支持 bean：

@ManagedBean
@SuppressWarnings("serial")
public class SomeBean implements Serializable{

private boolean bDisabled;

private String somePropertie;
private String somePropertie2;

public void onEvent(){

System.out.println("DO SOMETHING");

this.bDisabled = true;

}

... getters and setters of properties and boolean ....

}

这是主要的模板：

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"  
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core" 
xmlns:p="http://primefaces.org/ui"
xmlns:ui="http://java.sun.com/jsf/facelets"
>
<h:head>
<title>..:: XXXXX ::..</title>
<meta http-equiv="Pragma" content="no-cache" />
<link rel="stylesheet" type="text/css" href="#{request.contextPath}/css/default.css"/>
<style type="text/css">
.ui-growl{
position:absolute;
top:20%;
left:50%;
z-index:9999;
}

.ui-widget,.ui-widget .ui-widget {
font-family: Trebuchet MS;
}
</style>
</h:head>
<h:body style="background-color: #E1E1E1;">
<div id="page">
<div id="divHeader" style="height: 70px;">
<ui:insert name="header" >
<ui:include src="header.xhtml" />
</ui:insert>
</div>
<div id="divMenu" style="height: 50px;">
<ui:insert name="menu">
<ui:include src="menu.xhtml" />
</ui:insert>
</div>
<div id="divContent">
<ui:insert id="content" name="content" >
<ui:include src="content.xhtml" />
</ui:insert>
</div>
</div>   
</h:body>
</html>

转换器：

@FacesConverter("toUpperCaseConverter")
public class ToUpperCaseConverter implements Converter {
@Override
public String getAsString(FacesContext context, UIComponent component, Object value) {
return (String) value;
}

@Override
public Object getAsObject(FacesContext context, UIComponent component, String value) {
return (value != null) ? value.toUpperCase() : null;
}

}

有什么想法？？？

请帮忙:(

【问题讨论】：

标签： jsf primefaces

【解决方案1】：

您的问题不完整，因为它没有提供重现错误的所有元素。您还没有提供调用您的元素的页面，也没有提供转换器等。

JSF 的调试器最好的朋友是 firebug。始终检查 javascript 错误并启用网络选项卡以查看每个请求响应正文，其中可能包含“静默”错误消息。

我会冒险尝试猜测您的问题:-)

这是您的代码，稍作改动以在我的 primefaces 4 中运行。

<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
    xmlns:f="http://java.sun.com/jsf/core"
    xmlns:h="http://java.sun.com/jsf/html"
    xmlns:ui="http://java.sun.com/jsf/facelets"
    xmlns:p="http://primefaces.org/ui">
<h:head>
    <title>You NEED a header</title>
</h:head>
<h:body>
    <h:form>
        <ui:include src="index2.xhtml" />   
    </h:form>
</h:body>
</html>

和

<ui:composition
    xmlns="http://www.w3.org/1999/xhtml"
    xmlns:ui="http://java.sun.com/jsf/facelets"
    xmlns:h="http://java.sun.com/jsf/html"
    xmlns:f="http://java.sun.com/jsf/core"
    xmlns:p="http://primefaces.org/ui">
        <p:growl
            id="msg"
            showDetail="true"
            life="3000" />
        <p:panelGrid
            border="0"
            id="panel">
            <p:row>
                <p:column width="350">
Title
</p:column>
                <p:column colspan="2">
                    <p:inputText
                        id="someId"
                        value="#{someBean.somePropertie}">
                        <p:ajax
                            event="blur"
                            update="anotherInput"
                            listener="#{someBean.onEvent}" />
                    </p:inputText>
                </p:column>
            </p:row>
            <p:row>
                <p:column width="350">title 2</p:column>
                <p:column colspan="2">
                    <p:inputText
                        id="anotherInput"
                        value="#{someBean.somePropertie2}"
                        disabled="#{someBean.bDisabled}" />
                </p:column>
            </p:row>
        </p:panelGrid>
</ui:composition>

托管 bean 几乎相同

import java.io.Serializable;

import javax.faces.bean.ManagedBean;

@ManagedBean
@SuppressWarnings("serial")
public class SomeBean implements Serializable {

    private boolean bDisabled;

    private String somePropertie;
    private String somePropertie2;

    public void onEvent() {

        System.out.println("DO SOMETHING");

        this.bDisabled = true;

    }

    public boolean isbDisabled() {
        return this.bDisabled;
    }

    public void setbDisabled(boolean bDisabled) {
        this.bDisabled = bDisabled;
    }

    public String getSomePropertie() {
        return this.somePropertie;
    }

    public void setSomePropertie(String somePropertie) {
        this.somePropertie = somePropertie;
    }

    public String getSomePropertie2() {
        return this.somePropertie2;
    }

    public void setSomePropertie2(String somePropertie2) {
        this.somePropertie2 = somePropertie2;
    }

}

我注意到，如果您不从调用者页面中省略 HEAD 部分，它似乎可以呈现和工作。

但是，如果您忘记了 HEAD 部分（您不能这样做，请参阅 Primefaces FAQ 项目 #2），您将呈现页面（相当），但您会收到一些 javascript 错误和您的页面不起作用。我说的HEAD部分是这个

<h:head>
    <title>You NEED a header</title>
</h:head>

这是没有 HEAD 部分的样子。

对于 HEAD 部分，它似乎可以工作。还要注意微妙的 primefaces 外观和感觉。

【讨论】：

谢谢你的回答，我更新了有问题的代码，我在主标题模板中的标题是你的意思吗？
你的模板是什么样子的？
我在原始问题中发布了:)