Skip to main content

Create a beautiful pop down list using HTML5 datalist tag


        HTML 5 datalist tag is most widely used in the HTML 5 forms. Datalist got derived from the list of pre-defined elements, which will get displayed when user starts entering the input.  
       Lets learn with one of the practical example;

       You might have seen, while choosing the source station and destination station on the Indian railways website, by just typing few characters of station name, the complete station name can be seen in the list. 

indian railways
Indian Railways

        Above image is best self-explanatory, when user types del, Delhi station is shown in the list.
   
Syntax:

<form>

<input list="stations" name="stations">

<datalist id="stations">

<option value="ADRSH NGR DELHI- ANDI">
<option value="BANDEL JN- BDC">
<option value="BODELI- BDE">
<option value="DELANG- DEG">
<option value="DELHI- DLI">

</datalist>

<input type="submit">

</form>






Popular posts from this blog

eLitmus pH test for freshers

eLitmus has became more famous in conducting pH test for the fresh graduates in India. They will evaluate candidates across India and to provide a standard benchmark against which companies can compare them.


Who can apply

Candidates having/pursuing a degree in BE/B.Tech, MCA, ME/M.Tech or M.Sc(CS/IT) can apply for the pH test.

Companies recruiting from pH test

List of companies

Look at test centers

Check the upcoming pH tests

Look at the testimonials

Read what the candidates appeared for this exam says about eLitmus.

Test Pattern

Test duration : 2 hours
No of questions : 60

It will be asked from 3 categories,

Syllabus

20 : Problem solving
20 : Verbal ( You need to read the paragraph and answer the questions )
20 : Quantitative ( Data interpretation )

Four options will be provided for each question. Test will be conducted online.

Payment methods

Fresh graduates appearing for the test has to pay Rs 920/- as a test fee.

They can pay online or send a DD or in cash at Bangalore eLitmus office.

By Online: If y…