keyup event does not occur.

[burton999]

Hi.

I am using richfaces 4.2.0.Final.

I want to process when user input text immediately.

my code is following.

<h:inputText id="category_name" value="#{editCategory.editingCategory.name}" valueChangeListener="#{editCategory.processTextValueChange}" size="60" maxlength="128" >

    <a4j:ajax event="keyup" render="SaveButton" limitRender="true" execute="@this" />

</h:inputText>

<a4j:commandButton id="SaveButton" action="#{editCategory.save}" value="#{msg['webui.common.save']}" disabled="#{!editCategory.modifyed}" />

@ManagedBean(name = "editCategory")

@SessionScoped

public class EditCategoryPage implements Serializable {

    public void processTextValueChange(ValueChangeEvent event) {

        if ("category_name".endsWith(event.getComponent().getId())) {

            this.editingCategory.name = (String)event.getNewValue();

        }

    }

    ...

}

When I enter the first character, processTextValueChange was not called.

But I enter the second character, processTextValueChange was called.

Why won't the processTextValueChange method be called at first?

[sunkaram]

Why are you using both valueChangeListener and ajax event here?

Not sure about requirement, but

1. If you have to deal with old and new values of the component use valueChangeListener alone

2. If you have to call a bean method for each keyup event jsu use ajax

I assume your requirment is 2nd one.

<h:inputText id="category_name" value="#{editCategory.editingCategory.name}" size="60" maxlength="128" >

    <a4j:ajax event="keyup" action="#{editCategory.processTextValueChange}"  render="SaveButton" limitRender="true" execute="@this" />

</h:inputText>

<a4j:commandButton id="SaveButton" action="#{editCategory.save}" value="#{msg['webui.common.save']}" disabled="#{!editCategory.modifyed}" />

@ManagedBean(name = "editCategory")

@SessionScoped

public class EditCategoryPage implements Serializable {

    public String processTextValueChange() {

       System.out.println("New input value is : "+editingCategory.getName());

       return null;

    }

    ...

}

[burton999]

Thank you for your quick reply.

I did not understand valueChangeListener and "a4j:ajax".

Input the text box each time, I want to update object on server side.

I changed my code according to your advice.

<h:inputText id="category_name" value="#{editCategory.editingCategory.name}" size="60" maxlength="128" >

    <a4j:ajax event="keyup" action="#{editCategory.processTextValueChange}"  render="SaveButton" limitRender="true" execute="@this" />

</h:inputText>

<a4j:commandButton id="SaveButton" listener="#{editCategory.save}" value="#{msg['webui.common.save']}" disabled="#{!editCategory.modifyed}" />

But When I enter the first character, processTextValueChange was not called.

I was generating the first event compulsorily and solved this problem.

<h:inputText id="category_name" value="#{editCategory.editingCategory.name}" size="60" maxlength="128" onfocus="$(this).trigger('keyup');">

    <a4j:ajax event="keyup" action="#{editCategory.processTextValueChange}"  render="SaveButton" limitRender="true" execute="@this" />

</h:inputText>

<a4j:commandButton id="SaveButton" listener="#{editCategory.save}" value="#{msg['webui.common.save']}" disabled="#{!editCategory.modifyed}" />

I'm not sure why it work like this.

[sunkaram]

I don't see any problem with the code. Not sure why its not working in first case..

try using <f:ajax instead of <a4j:ajax

[burton999]

Root cause of this issue seems to be nested form tag.

My application consisting of some xhtml and there are nested form tag.

I resolved this issue by ridding of nested form tag.

Than you for your advice.