Changes for page Suggest Widget

Last modified by Marius Dumitru Florea on 2022/04/19

<
From version < 44.1 >
edited by Oana Florea
on 2010/09/13
To version < 45.1 >
edited by MensoHeus
on 2010/12/11
>
Change comment: There is no comment for this version

Summary

Details

Page properties
Author
... ... @@ -1,1 +1,1 @@
1 -XWiki.OanaTabaranu
1 +XWiki.MensoHeus
Content
... ... @@ -133,7 +133,38 @@
133 133  </results>
134 134  {code}
135 135  
136 +To provide autosuggest to several elements on the form, you can use JavaScript to loop through all the form elements and provide autosuggest if they meet certain conditions. In the example below, if there are form elements with id 'Supplier' in the 'inline' form, they get assigned an autosuggest that uses the Suppliers space as its source. If the element id matches 'Product' the autosuggest is told to use the 'Products' space as it's source instead.
136 136  
138 +This method can be very useful when a form contains a lot of similar elements that require autosuggest. If you make sure the naming is done consistently, you can also use javascript to assign autosuggest based on part of the element id, for example 'all elements ending with _foo' or 'all elements starting with Bar_'. You can use the velocity code from the example above with the code below.
139 +
140 +{code}
141 +(function(){
142 + document.observe('dom:loaded', function () {
143 + myForm = document.getElementById('inline').elements;
144 + for(i=0; i<myForm.length; i++){
145 + if(myForm[i].id =='Supplier'){
146 + mySuggest(myForm[i], 'Suppliers');
147 + }
148 + if(myForm[i].id=='Product'){
149 + mySuggest(myForm[i], 'Products');
150 + }
151 + }
152 + }); // end of doc observe
153 +})();
154 +
155 +function mySuggest(element, space) {
156 + if (!element.suggest) {
157 + element.suggest = new XWiki.widgets.Suggest(element, {
158 + script: "$xwiki.getURL("Sandbox.AutoSuggest", "view")"+ "?xpage=plain&spacename="+space+"&",
159 + varname: "input",
160 + seps: " ,|",
161 + offsety: 13,
162 + minchars: 1
163 + });
164 + }
165 +}
166 +{code}
167 +
137 137  1.1.1.1 Example
138 138  
139 139  * Check out the example for custom information at [Custom Information Example>DevGuide.AjaxSuggestCustomExample]

Get Connected