The Filter Select Options is one or multiple dropdown list that contains select options. Any select action will trigger a
selectHandler JavaScript function that will filter out the selected options, and then update the page content accordingly (usually through an AJAX request).
This widget is inspired by Nordstrom that has a live example of the option filter.
We'll charge more ($50/Hr) if more customizations are required.
Usage
1. Add script links
<!-- add the links into the head section of the page -->
<link href="res/ddmenu-ext.css" rel="stylesheet" type="text/css" />
<script src="res/ddmenu-ext.js"></script>
You may have noticed that the script is very similar to the ddmenu script. You are right. The Filter Selects is extended from the ddmenu script.
If you want to know more about each filter options inside the ddmenu-ext.js, you can refer to the ddmenuOptions in ddmenu.
2. Add the dropdown markup
The markup is very similar to the ddmenu structure. For details please refer to the demo.html code in the download package.
3. Implementing the selectHandler
The selectHandler function will be triggered when any options are selected/deselected in the dropdown. It will also excute when the dropdown list is just initiated during page load.
Two parameters, opWrapper and selectedBs, are passed to the selectHandler function:
opWrapper: It is the clicked <div class="dd-inner op-wrapper">...</div> element
which has 4 properties: filterId, bs(the collection of its <b>s), viewall(the b.viewall element), and the chosenFilter wrapper element that contains the chosen filters
(The chosenFilter is inserted into the ddmenu by the script, just before the <div class="dropdown">...</div> element).
selectedBs: The selected options (the <b>s) within the dropdown list (opWrapper)
You may have noticed the var myFilter = new Ddmenu_Extended(filterOptions); in the ddmenu-ext.js.
myFilter is the instance name of the widget. It has a property, opWrappers, that returns all of its <div class="dd-inner op-wrapper">...</div> elements.
We can iterate this collection to filter out all the chosen options.
For details please refer to the source code of the demo.html inside the download package.
4. License:
License is required before the Filter Selects goes live on web server. Otherwise a trial version alert may appear on the page.
The license is issued on a per-domain basis (valid for a domain and its sub-domains). Intranet domains and IP domains should also be licensed.
License Fee: $190.00
You can use the licensed widget multiple times within the website for which you've purchased the license.
When you have acquired the license, open the ddmenu-ext.js file with Notepad, and update the license value accordingly.
var filterOptions =
{
......,
license: "(license key)"
};
FAQ about License
How the license works? Does it go to another web service to verify? Answer
Do I need a license for my dev and testing domain that is different from the final client's domain? Answer
Will it work for sub-domains? Answer
My website is on intranet. Do I need license for using your widgets in my intranet website? Answer
Do you provide developer license that can be applied to multiple websites? Answer
I have multiple domain names pointing to the same website. Can I apply multiple licenses to the same script? Answer
Do I need to renew the license for future upgrades/releases of the widget? Answer
You need to set the acquired license key to the license property in the widget's JavaScript file.
The JavaScript will use its own match pattern code to verify the license with the domain name on the browser's address bar.
The JavaScript file will perform the validation by itself and no other services will be involved.
If the validation failed(the domain name doesn't match the license key), the UI component may periodically display a trial version alert, or even disable some functionalities.
The code is fully functional even if the script is not licensed (though it may periodically show a trial version alert). So usually you don't need the license in your dev phase.
If you are developing under the domain localhost, either the trial version alert will be disabled, or we have provided a license for the localhost that you can find in the
License section of the product's main page.
Yes. If the license is valid for the main domain, it will also be valid for all its sub-domains(such as sub1.mydomain.com, sub2.mydomain.com).
Yes license is required for intranet domains, and you can enter your intranet domain into the For website box after clicking the Buy Now button.
No. It is on a per-domain basis only.
Yes, it is supported. The following links are the instructions:
If your domain2.com will be redirected to your domain1.com, you only need a license for domain1.com. You don't need multiple licenses in this scenario.
If your multiple domains are obviously for the same site, such as menucool.com, menucool.net, menucool.com.us,
you can input the regular price for the first domain, and input 1/2 of the price for the others.
No. The license will be valid forever as long as your domain is not changed.
If your domain name is changed, you need to purchase a separate license for the new domain.