Skip to content
Advertisement

How to create HTML select option from JSON hash?

I have a simple JSON code:

[{'1':'Name'}, {'2', 'Age'}, {'3','Gender'}]

I have a select tag in my HTML:

<select name="datas" id="datas"></select>

I need a simple way to create HTML select box from this JSON, like this:

<select name="datas" id="datas">
    <option value="1">Name</option>
    <option value="2">Age</option>
    <option value="3">Gender</option>
</select>

Advertisement

Answer

Just for kicks here is an answer in pure javascript, also you probably do not need an array for this just a simple object will suffice

    <select name="datas" id="datas"></select>
    <script>

        html = "";
        obj = {
            "1" : "Name",
            "2": "Age",
            "3" : "Gender"
        }
        for(var key in obj) {
            html += "<option value=" + key  + ">" +obj[key] + "</option>"
        }
        document.getElementById("datas").innerHTML = html;

    </script>
User contributions licensed under: CC BY-SA
9 People found this is helpful
Advertisement