Uploaded image for project: 'RichFaces'
  1. RichFaces
  2. RF-12114

Richfaces 4.2 rich:autocomplete don't fire ajax on blur event

    Details

    • Steps to Reproduce:
      Hide

      Test code:

      testAutocomplete.xhtml

      <!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:a4j="http://richfaces.org/a4j"
      	xmlns:rich="http://richfaces.org/rich"	 
      	>
      <h:head>
      	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
      </h:head>
       
      <f:view>
      	<h:form>
      		<table>
      			<tr>
      				<td>
      					rich:autocomplete + a4j:ajax event="blur"
      				</td>
      				<td>  
      		            <rich:autocomplete id="autocompleteNomeId"
      		            	value="#{testAutocomplete.name}" 
      		             	required="true"
      		            	autocompleteMethod="#{testAutocomplete.autocompleteName}"
      		            	var="result"
      		                fetchValue="#{result}"
      		                requestDelay="100"
      				showButton="true">
      				<a4j:ajax event="blur" listener="#{testAutocomplete.onBlurListener1}" render="outId1">
      				</a4j:ajax>
      						
      			    	<h:column>
      			        	<h:outputText value="#{result}" />
      			    	</h:column>
      		
      			</rich:autocomplete>
      				
      				</td>
      			</tr>
      			<tr>
      				<td>result</td>
      				<td>
      					<h:inputText value="#{testAutocomplete.selected1}" id="outId1" />
      				</td>
      			</tr>
       
      	
      			<tr>
      				<td>
      					rich:autocomplete onblur + jsFunction
      				</td>
       
      				<td>  
      					<a4j:jsFunction name="blurFunction" actionListener="#{testAutocomplete.onBlurListener2}" render="outId2">
      					</a4j:jsFunction>
      					
      		            <rich:autocomplete id="autocompleteJSId"
      		            	value="#{testAutocomplete.name}" 
      		             	required="true"
      		            	autocompleteMethod="#{testAutocomplete.autocompleteName}"
      		            	var="result"
      		                fetchValue="#{result}"
      		                requestDelay="100"
      				showButton="true"
      				onblur="blurFunction();">
      								    
      			    	<h:column>
      			        	<h:outputText value="#{result}" />
      			    	</h:column>
      	
      				</rich:autocomplete>
      				
      				</td>
      			</tr>
      			
      			<tr>
      				<td>result</td>
      				<td>
      					<h:inputText value="#{testAutocomplete.selected2}" id="outId2" />
      				</td>
      			</tr>
      		
      		</table>
      	
      	</h:form>
      </f:view>
      </html>	
      		
      

      Managed Bean

      package copaiba.managedBean.teste;
       
      import java.io.Serializable;
      import java.util.ArrayList;
      import java.util.Collection;
      import java.util.Iterator;
      import java.util.List;
       
      import javax.faces.bean.ManagedBean;
      import javax.faces.bean.ViewScoped;
       
      @ManagedBean(name = "testAutocomplete")
      @ViewScoped
      public class TestAutocomplete implements Serializable {
       
      	private String name;
      	private String selected1;
      	private String selected2;
       
      	public String getName() {
      		return name;
      	}
       
      	public void setName(String name) {
      		this.name = name;
      	}
       
      	public String getSelected1() {
      		return selected1;
      	}
       
      	public void setSelected1(String selected1) {
      		this.selected1 = selected1;
      	}
       
      	public String getSelected2() {
      		return selected2;
      	}
       
      	public void setSelected2(String selected2) {
      		this.selected2 = selected2;
      	}
       
      	public List<String> autocompleteName(Object suggest) {
      		String pref = (String) suggest;
      		ArrayList<String> result = new ArrayList<String>();
       
      		Collection<String> listNames = new ArrayList<String>();
      		listNames.add("Abraham");
      		listNames.add("Lincoln");
      		listNames.add("Peter");
      		listNames.add("John");
       
      		Iterator<String> iterator = listNames.iterator();
      		while (iterator.hasNext()) {
      			String elem = ((String) iterator.next());
      			if (elem.indexOf(pref) != -1) {
      				result.add(elem);
      			}
      		}
      		return result;
      	}
       
      	public void onBlurListener1() {
      		System.out.println("Hit 1");
      		setSelected1(getSelected1() + " hit");
      	}
       
      	public void onBlurListener2() {
      		System.out.println("Hit 2");
      		setSelected2(getSelected2() + " hit");
      	}
      }
       
      
      

      Show
      Test code: testAutocomplete.xhtml <!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:a4j="http://richfaces.org/a4j" xmlns:rich="http://richfaces.org/rich" > <h:head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> </h:head>   <f:view> <h:form> <table> <tr> <td> rich:autocomplete + a4j:ajax event="blur" </td> <td> <rich:autocomplete id="autocompleteNomeId" value="#{testAutocomplete.name}" required="true" autocompleteMethod="#{testAutocomplete.autocompleteName}" var="result" fetchValue="#{result}" requestDelay="100" showButton="true"> <a4j:ajax event="blur" listener="#{testAutocomplete.onBlurListener1}" render="outId1"> </a4j:ajax> <h:column> <h:outputText value="#{result}" /> </h:column> </rich:autocomplete> </td> </tr> <tr> <td>result</td> <td> <h:inputText value="#{testAutocomplete.selected1}" id="outId1" /> </td> </tr>   <tr> <td> rich:autocomplete onblur + jsFunction </td>   <td> <a4j:jsFunction name="blurFunction" actionListener="#{testAutocomplete.onBlurListener2}" render="outId2"> </a4j:jsFunction> <rich:autocomplete id="autocompleteJSId" value="#{testAutocomplete.name}" required="true" autocompleteMethod="#{testAutocomplete.autocompleteName}" var="result" fetchValue="#{result}" requestDelay="100" showButton="true" onblur="blurFunction();"> <h:column> <h:outputText value="#{result}" /> </h:column> </rich:autocomplete> </td> </tr> <tr> <td>result</td> <td> <h:inputText value="#{testAutocomplete.selected2}" id="outId2" /> </td> </tr> </table> </h:form> </f:view> </html> Managed Bean package copaiba.managedBean.teste;   import java.io.Serializable; import java.util.ArrayList; import java.util.Collection; import java.util.Iterator; import java.util.List;   import javax.faces.bean.ManagedBean; import javax.faces.bean.ViewScoped;   @ManagedBean(name = "testAutocomplete") @ViewScoped public class TestAutocomplete implements Serializable {   private String name; private String selected1; private String selected2;   public String getName() { return name; }   public void setName(String name) { this.name = name; }   public String getSelected1() { return selected1; }   public void setSelected1(String selected1) { this.selected1 = selected1; }   public String getSelected2() { return selected2; }   public void setSelected2(String selected2) { this.selected2 = selected2; }   public List<String> autocompleteName(Object suggest) { String pref = (String) suggest; ArrayList<String> result = new ArrayList<String>();   Collection<String> listNames = new ArrayList<String>(); listNames.add("Abraham"); listNames.add("Lincoln"); listNames.add("Peter"); listNames.add("John");   Iterator<String> iterator = listNames.iterator(); while (iterator.hasNext()) { String elem = ((String) iterator.next()); if (elem.indexOf(pref) != -1) { result.add(elem); } } return result; }   public void onBlurListener1() { System.out.println("Hit 1"); setSelected1(getSelected1() + " hit"); }   public void onBlurListener2() { System.out.println("Hit 2"); setSelected2(getSelected2() + " hit"); } }  
    • Workaround Description:
      Hide

      Use "onblur" attribute on rich:autocomplete to call a javascript that calls an actionLister instead of calling the listener directly on <a4j:ajax>

      Show
      Use "onblur" attribute on rich:autocomplete to call a javascript that calls an actionLister instead of calling the listener directly on <a4j:ajax>

      Description

      rich:autocomplete donĀ“t call actionListener on blur event

        Gliffy Diagrams

          Attachments

            Issue Links

              Activity

                People

                • Assignee:
                  bleathem Brian Leathem
                  Reporter:
                  ivancosta Ivan Costa
                • Votes:
                  2 Vote for this issue
                  Watchers:
                  6 Start watching this issue

                  Dates

                  • Created:
                    Updated:
                    Resolved: