javascript - How can print out my object properties base on my dropdown-menu? -
i have dropdown-menu option : a, b. have 2 objects : a, b.
their property
var = { name:"andrew", age:26, country:"united states" }; var b = { name:"barry", age:23, country:"italy" }; i want display information when selected drop-down menu, , vice of versa.
<!doctype html> <html> <head> <title>json</title> </head> <body> <form> student : <select id="dd" onchange="mystudent()"> <option value="a">a</option> <option value="b">b</option> </select> <p>selected student : <input type="text" id="student" size="2" value="a"> </p> </form> <div id="result">details : <br> </div> </body> <script type="text/javascript"> function mystudent() { var dd = document.getelementbyid("dd"); var selected = dd.options[dd.selectedindex].text; document.getelementbyid("student").value = selected; } var = { name: "andrew", age: 26, country: "united states" }; var b = { name: "barry", age: 23, country: "italy" }; var result = document.getelementbyid("result"); result.innerhtml += json.stringify(a, undefined, 6); </script> </html>i couldn't b display. can please give me hints ?
you never changed document html in mystudent() call.
first, moved code defined selections, selections["a"], , selections["b"] before mystudent() function not undefined.
i moved a , b selections object avoid nasty eval when passing selection json.stringify function. otherwise, in order pass object json.stringify function have needed json.stringify(eval(selected), undefined, 6); ugly , bad practice.
then put code find 1 selected mystudent function.
i'm still not sure purpose of parameters undefined , 6 in json.stringify. more illuminated me might able comment.
the code should work.
<!doctype html> <html> <head> <title>json</title> </head> <body> <form> student : <select id="dd" onchange="mystudent()"> <option value="a">a</option> <option value="b">b</option> </select> <p>selected student : <input type="text" id="student" size="2" value="a"> </p> </form> <div id="result">details : <br> </div> </body> <script type="text/javascript"> var selections = {}; selections["a"] = { name: "andrew", age: 26, country: "united states" }; selections["b"] = { name: "barry", age: 23, country: "italy" }; function mystudent() { var dd = document.getelementbyid("dd"); var selected = dd.options[dd.selectedindex].text; document.getelementbyid("student").value = selected; var result = document.getelementbyid("result"); result.innerhtml = json.stringify(selections[selected], undefined, 6); } var result = document.getelementbyid("result"); result.innerhtml = json.stringify(selections["a"], undefined, 6); </script> </html>
Comments
Post a Comment