/
UX Improvements for AjaxDropdownPreloader JS class [5.3.0-B1]
UX Improvements for AjaxDropdownPreloader JS class [5.3.0-B1]
The "AjaxDropdownPreloader" class is used to change options in dependent dropdown, when main dropdown value changes. The "Country" and "State" dropdown are good example, where available states change depending on selected country.
Initially during new record creation:
- main dropdown has options to select from, but no option is selected
- dependent dropdown has no options at all
In this situation user isn't aware of fact, that selecting option in main dropdown would populate options in dependent dropdown. In fact user might not be aware that dropdowns are connected at all.
We need to:
- allow using descriptive title for case, when value in main field needs to be selected, e.g. "Please select Other Field Title first"
- allow showing useful initial text, when value in main field was selected, e.g. "Please select ..."
Solution
All changes below are to be made in "AjaxDropdownPreloader" class only.
- when 1st constructor parameter turns out to be a non-empty object instead of a string, then set class properties specified in this object via $.extend(this, $urls) call instead of assigning them from parameters (beware of default value for "HasEmpty" property) - 0.4h
- add new class properties (defaults chosen to avoid BC breaks): - 0.1h
- EmptyTitle - defaults to an empty string
- EmptyFilterTitle - defaults to an empty string
- in the "AjaxDropdownPreloader.ProcessXMLNode" method: - 0.5h
- when adding an empty option use value from "AjaxDropdownPreloader.EmptyTitle" instead of an empty string
- if value in main field (filter field) is empty then use "AjaxDropdownPreloader.EmptyFilterTitle" property instead of "AjaxDropdownPreloader.EmptyTitle" property
Quote: 1.5h*1.4=2h