Wednesday, March 28, 2018

javascript - select option on change



i have json data like this:



[{
"user_id": "113",
"employe_first_name": "Asaladauangkitamakan",
"employe_last_name": "Nasibb"
}, {
"user_id": "105",
"employe_first_name": "Ryan",
"employe_last_name": "Friday"
}, {
"user_id": "87",
"employe_first_name ":"hendi ",
"employe_last_name ":"kenther"
}
]


how to 'create' select option with javascript (option value = user_id, and text = employe_first_name) that load when document ready, and fill another field with selected value


Answer



var data = [ {"user_id":"113","employe_first_name":"Asaladauangkitamakan","employe_last_name":"Nasibb"}, {"user_id":"105","employe_first_name":"Ryan","employe_last_name":"Friday"},   {"user_id":"87","employe_first_name":"hendi","employe_last_name":"kenther"} ];
var select = document.createElement("select");
for(var i = 0; i < data.length; i++){
var option = document.createElement("option");
option.value = data[i].user_id;
option.innerHTML = data[i].employe_first_name;
select.appendChild(option);
}
select.addEventListenter("change", function(event) {
var selected_value = event.target.value;
document.getElementById("another_field").value = selected_value;
});
someDiv.appendChild(select); // Add the select menu to the DOM

No comments:

Post a Comment

plot explanation - Why did Peaches&#39; mom hang on the tree? - Movies &amp; TV

In the middle of the movie Ice Age: Continental Drift Peaches' mom asked Peaches to go to sleep. Then, she hung on the tree. This parti...