Datalist | SoloLearn: Learn to code for FREE!



Is there away to abbreviate the code for sequential/ordered data in the datalist? so no take many place like this.

12/6/2019 4:27:31 AM

Muhamad Luthfi

6 Answers

New Answer


Muhamad Luthfi , there is a way to simply this but you'll need to have some js knowledge. here is code: markup: <select id="years"></select> script: window.onload=()=>{ const years= document.querySelector('#years'); /*select <select> element from DOM*/ /*use loop to generate year values*/ for(let y=1949;y<2021;y++) { let opt= document .createElement('option'); /*create an option element*/ opt.textContent=y; opt.value=y; /*set visible content (text) and value attribute */ years.appendChild(opt); /*append created <option> element to <select> as child*/ } } IMPORTANT : <datalist> is not supported by most of the mobile browsers.So I'm using select tag instead of <input> and <datalist> it works by dynamically creating DOM elements and appending them to <select> tag. You can try same logic with datalist but it will not work on mobile phones If you have any doubts regarding this code feel free to ask -`)


I'm not sure there is, but also, the value for your 1973 is "!973" so it is not showing up in the datalist.


Muhamad Luthfi , Can you please link your code. the link you provided seems to be broken. I might try to help if you link the code back. 😊


👌 Already reposted, the problem is in the "tahun lahir" form.


Ok, thank you for your help and info, i'll try it 😊


Thanks for correction Joshua!