Author: SeanRogers Date: 2010-11-25 00:17:35 -0500 (Thu, 25 Nov 2010) New Revision: 20167 Added: modules/docs/trunk/Component_Reference/src/main/docbook/en-US/extras/exam-Component_Reference-richautocomplete-Customizing_the_filter.xml_sample Modified: modules/docs/trunk/Component_Reference/src/main/docbook/en-US/chap-Component_Reference-Rich_inputs.xml Log: Added clientFilter to rich:autocomplete Modified: modules/docs/trunk/Component_Reference/src/main/docbook/en-US/chap-Component_Reference-Rich_inputs.xml =================================================================== --- modules/docs/trunk/Component_Reference/src/main/docbook/en-US/chap-Component_Reference-Rich_inputs.xml 2010-11-25 04:37:19 UTC (rev 20166) +++ modules/docs/trunk/Component_Reference/src/main/docbook/en-US/chap-Component_Reference-Rich_inputs.xml 2010-11-25 05:17:35 UTC (rev 20167) @@ -69,12 +69,26 @@ </para> --> <para> - Users can type into the combo-box's text field to enter a value, which also searches through the suggestion items in the drop-down box. By default, the first suggestion item is selected as the user types. This behavior can be deactivated by setting <code><varname>selectFirst</varname>="false"</code>. + Users can type into the text field to enter a value, which also searches through the suggestion items in the drop-down box. By default, the first suggestion item is selected as the user types. This behavior can be deactivated by setting <code><varname>selectFirst</varname>="false"</code>. </para> <para> Setting <code><varname>autoFill</varname>="true"</code> causes the combo-box to fill the text field box with a matching suggestion as the user types. </para> </section> + + <section id="sect-Component_Reference-richautocomplete-Customizing_the_filter"> + <title>Customizing the filter</title> + <para> + The <sgmltag>&lt;rich:autocomplete&gt;</sgmltag> component uses the JavaScript <function>startsWith()</function> method to create the list of suggestions. The filtering is performed on the client side. Alternatively, use the <varname>clientFilter</varname> attribute to specify a custom filtering function. The custom function must accept two parameters: the <varname>subString</varname> parameter is the filtering value as typed into the text box by the user, and the <varname>value</varname> parameter is an item in the list of suggestions against which the <varname>subString</varname> must be checked. Each item is iterated through and passed to the function as the <varname>value</varname> parameter. The custom function must return a boolean value indicating whether the passed item meets the conditions of the filter, and the suggestion list is constructed from successful items. + </para> + <example id="exam-Component_Reference-richautocomplete-Customizing_the_filter"> + <title>Customizing the filter</title> + <para> + This example demonstrates how to use a custom filter with the <varname>clientFilter</varname> attribute. The custom filter determines if the sub-string is contained anywhere in the suggestion item, instead of just at the start. + </para> + <programlisting language="XML" role="XML"><xi:include parse="text" href="extras/exam-Component_Reference-richautocomplete-Customizing_the_filter.xml_sample" xmlns:xi="http://www.w3.org/2001/XInclude" /></programlisting> + </example> + </section> <!-- TODO <section id="sect-Component_Reference-richautocomplete-richautocomplete_events"> Added: modules/docs/trunk/Component_Reference/src/main/docbook/en-US/extras/exam-Component_Reference-richautocomplete-Customizing_the_filter.xml_sample =================================================================== --- modules/docs/trunk/Component_Reference/src/main/docbook/en-US/extras/exam-Component_Reference-richautocomplete-Customizing_the_filter.xml_sample (rev 0) +++ modules/docs/trunk/Component_Reference/src/main/docbook/en-US/extras/exam-Component_Reference-richautocomplete-Customizing_the_filter.xml_sample 2010-11-25 05:17:35 UTC (rev 20167) @@ -0,0 +1,13 @@ +<script> + function customFilter(subString, value){ + if(subString.length>=1) { + if(value.indexOf(subString)!=-1) + return true; + }else return false; + }; +</script> +<h:form> + <rich:autocomplete mode="client" minChars="0" autofill="false" + clientFilter="customFilter" + autocompleteMethod="#{autocompleteBean.autocomplete}" /> +</h:form>