FWC:SmartSelect is avaible right now! Download FWC:SmartSelect
FlyWeb FlyWeb :ComponentsFWC:SmartSelect @ FlyWeb :Components
En | Ru




The FWC:SmartSelect library also gives large scales to work with AJAX-based cascade lists loading. There is two functions which response for data loading: loadOptions_JS and loadOptions_PHP.

Attention!
In the second version of library the AJAX-functions have been expanded.
This article is not finished yet, the description of new aspects will appear in the near future.

This is how they works:

FWC_sSelect.loadOptions_JS({xml-file}[,{attribute name}][,{array of values}][,{callback-function}])

This function performs more simple work: it loads xml-file and, if the second and third parameters is set, deletes from this file all fwc:option tags which attribute doesn't equal to any value in array, referenced in third parameter. Usually as array FWC_sSelect.value property is transferred. This function is convenient, when it isn't required complex data processing, when all data are prepared in one small XML-file, which can be loaded and processed on client side.

Here is example. Let's assume, that it is necessary for us, that the user first choose the continent, then the country, and after city. The first we should do is to prepare XML-file with data. For example, let's create some files. The one of them will contain continents and countries, the others will contain lists of cities for each country.


The call of functions with different parameters is set to attributes-holders onclose and onchange of corresponding lists. Source files: ajaxjs_cont.xml, ajaxjs_country.xml, ajaxjs_res.xml, data/


FWC_sSelect.loadOptions_PHP([{xml-file},{xPath-expression}][,{method}][,{phpfile},{parameters}][,{callback-function})

The second function works similarly, just instead of attribute parameters and array of values here is parameter setting XPath-expression transferred together with the reference to XML-file to the built-in PHP-parser.

You can also use your own PHP-parser (for example to load data from database or raw XML-files), just set path to it in corresponding parameter. The following two parameters is used to set method type (the POST is by default) and the set of parameters in JavaScript hash-object format ({param:'value',param2:'value2'}) (don't confuse with JSON!) However don't forget, that in this case it should return a correct XML-code or JSON-Array. About the rules of the list description through XML and JSON-Array read in first and second articles of documentation.

To form XPath-expression based on value of any object in the list you can use the following function:

FWC_sSelect.value2xpath({attribute}[, {array of values}][, {additional string}])

Array of default values is value attribute of current object. For example:
// obj.value == [1,2,3]
alert(obj.value2xpath('world',this.value,'or contains('a',.)'));
// -> //*["world='1' or world='2' or world='3' or contains('a',.)"]


In both functions you can set callback-function, which will be executed right after loading items in the list, in the last parameter.

If you don't wish to use built in loaders loadOptions_ *(), you can manually transfer JSON-line or XML-object to internal function appendOptions() which is using by built-in loaders after loading data. In the second parameter callback-function transferred. For example:
myCombo.appendOptions('[["I"],["Love"],["Beer"]]',function(){myCombo.showHideOptions('show')});
© 2007 «Alexander Zinchuk» / FlyWeb :Components. License: MIT. Site by: FlyWeb / Design: Yaroslav Birzool.