A standout amongst the most utilized Javascript gadgets over the previous decade has been the content box autocomplete gadget. Each Javascript structure has their own particular autocomplete gadget and a considerable lot of them have gotten to be truly praiseworthy. Much like the placeholder first experience with markup, an every now and again utilized usefulness has been moved from a Javascript-just utility to HTML through the new DATALIST component.
<datalist> …. </datalist>
The HTML <datalist> Element holds a set of <option> elements that speak to the qualities accessible for different controls.
The <datalist> tag defines an arrangement of predefined choices for an input component.
The <datalist> tag is utilized to give an “autocomplete” offer on input components. Clients will see a drop-down arrangement of predefined choices as they input information.
You can utilize the input component’s schedule ascribe to tie it together with a datalist component.
Here is the Syntax for DATALIST Element
Supported Browser
|
1
2
3
4
5
|
<datalist>Â Â Â Â Â Â Â Â <option value="option value"></datalist> |
Below is complete syntax along with example
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
|
<!DOCTYPE html><html>Â Â Â Â Â Â Â Â <head>Â Â Â Â Â Â Â Â Â <title>Title name will go here</title>Â Â Â Â </head>Â Â Â Â Â Â Â Â <body>Â Â Â Â Â Â Â Â Â Â Â Â Â Â Â Â <input list="country">Â Â Â Â Â Â Â Â Â Â Â Â Â Â Â Â <datalist id="country">Â Â Â Â Â Â Â Â Â Â Â Â Â Â Â Â <option value="India">Â Â Â Â Â Â Â Â Â Â Â Â <option value="Australia">Â Â Â Â Â Â Â Â Â Â Â Â <option value="Sourth Africa">Â Â Â Â Â Â Â Â Â Â Â Â <option value="Canada">Â Â Â Â Â Â Â Â Â Â Â Â <option value="America">Â Â Â Â Â Â Â Â </datalist>Â Â Â Â Â Â Â Â Â Â Â Â Â Â Â Â <input type="submit" value="submit"/>Â Â Â Â Â Â Â Â Â Â Â Â </body>Â Â Â Â </html> |
