Dojo Filtering Select
In this section, you will learn about the dojo filtering select.
FilteringSelect: The FilteringSelect is same as html select tag, but it populated dynamically. It works to user friendly with large data set. It loads the data on the page which have to be needed. It looks as a combo box but the combo box do not allow to user to enter the outside of data in the combo box. It allows only the selection facility. But filteringselect allows to user to enter your text in the filteringselect.
Try Online: Filtering Select
Here is the code of Program:
<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>Simple FilterSelect Example</title> <style type="text/css"> @import "../dijit/themes/soria/soria.css"; @import "/resources/dojo.css"; </style> <script type="text/javascript" src="dojo.xd.js" djConfig="parseOnLoad: true"></script> <script type="text/javascript"> dojo.require("dojo.parser"); dojo.require("dijit.form.FilteringSelect"); </script> </head> <body class="soria"> <select dojoType="dijit.form.FilteringSelect" name="countryName" autocomplete="true" value="sel"> <option value="sel" selected="selected">Austria</option> <option value="1" >Australia</option> <option value="2" >Canada</option> <option value="3" >Germany</option> <option value="4" >Japan</option> <option value="5" >United Kingdom</option> <option value="6" >United States of America</option> <option value="7" >Afghanistan</option> <option value="8" >Albania</option> <option value="9" >Algeria</option> <option value="10" >American Samoa</option> <option value="11" >Andorra</option> <option value="12" >Angola</option> </select> </body> </html>
OutPut:
When you run the following example, you get:
If you click on the combo box, you get the following:
If you enter only the "A" then you get all the list which is related to "A"