Datalist tag:-
किसी<input> element में predefined options define करने के लिए HTML5 आपको <datalist> tag provide करती है। <datalist> tag input elements के लिए autocomplete feature की तरह काम करता है। इससे input तेजी से प्राप्त करने में मदद मिलती है और user experience भी improve होता है। कई बार user अनजाने में incorrect information input कर देता है। Incorrect information से कई प्रकार की समस्या generate हो सकती है। <datalist> tag द्वारा आप user को correct information input करने में मदद करते है। जब भी user कोई input type करने का प्रयास करता है तो पहले से define किये गए options की list show हो जाती है। इस list में से user उस option को choose करता है। इस प्रकार आप user द्वारा होने वाली typing mistakes से बच जाते है।
Note:- सभी browsers <datalist> tag को support नहीं करते है। Apple Safari और Internet Explorer के द्वारा ये tag support नहीं किया जाता है। दूसरे browsers के भी पुराने versions में यह element support नहीं करता है।
Example:-
<form>
<input type=”text” name=”CountrySearch” list=”CountryList”>
<datalist id=”CountryList”>
<option value=”America”>
<option value=”Russia”>
<option value=”China”>
<option value=”India”>
</datalist>
</form>
Datalist tag:-
HTML5 provides you with <datalist> tag to define predefined options in an <input> element. The <datalist> tag works like an autocomplete feature for input elements. This helps in receiving input faster and also improves user experience. Many times the user unknowingly inputs incorrect information. Incorrect information can generate many types of problems. Through <datalist> tag you help the user to input correct information. Whenever the user tries to type any input, a list of previously defined options is shown. The user chooses that option from this list. In this way you are saved from typing mistakes made by the user.
Note:-Not all browsers support the <datalist> tag. This tag is not supported by Apple Safari and Internet Explorer. This element is not supported even in older versions of other browsers.
Example:-
<form>
<input type=”text” name=”CountrySearch” list=”CountryList”>
<datalist id=”CountryList”>
<option value=”America”>
<option value=”Russia”>
<option value=”China”>
<option value=”India”>
</datalist>
</form>