Implement contains/endswith behavior in model based autoSuggest Lov (Input list and combo box)

Hello All

Hope Everyone knows about list of values and autoSuggest beahvior of ADF Framework,
For those who are new to framework can look at this post
ADF Basics : Implementing auto suggest behavior in ADF Faces lov (list of values)

ADF Basics| Tip to Hide af:inputListOfValues search popup at runtime

Hello All

Previously I have posted about a requiremnt of  hiding af:inputListOfValues search icon using CSS
ADF Skinning | Hiding search icon of af:inputListOfValues using CSS & StyleClass

In that solution search icon doesn't appear on page but it is a part of JSF component tree so when user press TAB+SPACE after entering a value in lov component then search popup appears on screen as this action invokes search icon click event

Recently a Friend of mine came across another requirement that was not showing lov popup at all as only autoSuggest behavior was required , so for this first way is to use autoSuggest behavior in an af:inputText compoent using Lov bindings and second way is to short circuit component life cycle

ADF Basics: Use transient attribute to show description of selected value in case of input and combo Lov

In ADF often We apply LOV on a ID attribute to show it's Description to user, This works good in case of choice list (selectOneChoice) but if we use Input Text with List of Values (<af:inputListOfValues>) or Combo Box with List of Values (<af:inputComboboxListOfValues>) then after selection ID appears on page instead of  Description like this

So to avoid this we apply LOV on a transient attribute that shows Description and sets ID value DB attribute, See how to implement this

Open af:inputListOfValues popup by calling JavaScript programmatically

af:inputListOfValues provides option to open Lov values in a popup and allow user to search, We can open this popup by clicking on magnifying glass icon

Recently I have seen a thread on OTN forum where user wants to open lov popup on a button click after checking some conditions and also found a post by Frank Nimphius Where he used javascript to open Lov popup on double click of mouse.
So guess what I have done ? ;)
Just called that javascript fucntion programmatically on button click

Hiding search icon of af:inputListOfValues using CSS & ADF Skin

Hello All,
Hope all are doing good, this post talks about skinning inputListOfValues to hide its search icon (magnifying glass)
we can use the auto-suggest feature in inputListOfValues so if we don't want to display that default search icon then what to do?

• inputListOfValues looks like this in ADF Faces

•  I have created a page and dropped 2 inputListOfValues on page

•  there is 2 types of requirement about hiding search icon
1. Hide icon of all inputListOfValues(LOVs) available on page or application
2. Hide icon of some selected fields
• to do this we have to create a CSS (skin) in application

• give relevant name of CSS file and set this file as default skin of application

• Now to hide icon of the selected inputListOfValues component in an application, go to the source of CSS file and just write this code
   



.TagSearchIconHidden af|inputListOfValues::search-icon-style
{
display: none;
} 



• Now go to the page and paste TagSearchIconHidden in StyleClass property of lov component to hide its icon, run your page and see, I have done this in my first LOV

•  Now to hide icons of all lov component just change CSS file with this script



af|inputListOfValues::search-icon-style
{
  background-image: none; 
}



• Now no need to set StyleClass, it is applicable to all lov components of the application

 Cheers :-)