Datalist

Question

Is there away to abbreviate the code for sequential/ordered data in the datalist? so no take many place like this.
https://code.sololearn.com/WdClaf1R0oW3/?ref=app

Answer 1

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

Answer 2

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 -`)

Answer 3

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

Answer 4

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

Answer 5

Thanks for correction Joshua!

Answer 6

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. 😊