i need learn convert json object javascript. in below json there 2 columns, how iterate both columns. kindly me out.
{ "hotels": { "1":{"name": "taj residency","description":" sample description of taj" }, "2":{"name": "gulf zone","description":" sample description of gulf zone"}, "3":{"name": "silver resort","description":" sample description of silver resort"}, "4":{"name": "burj al arab","description":" sample description of burj al arab "}, "5":{"name": "raffles dubai","description":" sample description of raffles dubai"}, "6":{"name": "dubai heights","description":" sample description of dubai heights"}, "7":{"name": "classic tower","description":" sample description of classic tower"}, "8":{"name": "royal","description":" sample description of royal"}, "9":{"name": "al arab residency","description":" sample description of al arab residency"} }, "location": { "1":{"name": "dubai" }, "2":{"name": "sharjah"}, "3":{"name": "abu dhabi"}, "4":{"name": "mumbai"} } }
i able watch output on console of browser, unable show on browser.
please check below code.
<html> <head> <title>assi</title> <meta charset="utf-8" /> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> <script> $(document).ready(function () { $.ajax({ type: 'get', url: 'json.json', data: '', datatype: 'json', success: function (response) { console.log(response); } }); }) </script> </head> <body> </body> </html>
you can try code show on browser
<html> <head> <title>assi</title> <meta charset="utf-8" /> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> <script> $(document).ready(function () { $.ajax({ type: 'get', url: 'json.json', data: '', datatype: 'json', success: function (data) { //console.log(data); $('div.hotels').append('<div></div>').append("<h3>hotels</h3>"); $('div.locations').append('<div></div>').append("<h3>locations</h3>"); $.each(data.hotels,function(i,item){ $('div.hotels').append('<ul></ul>').append("<li>"+item.name+"</li>").append("<li>"+item.description+"</li>"); }); $.each(data.location,function(i,item){ $('div.locations').append('<ul></ul>').append("<li>"+item.name+"</li>"); }); } }); }) </script> </head> <body> <div class="myclass"> <div class="hotels"></div> <div class="locations"></div> </div> </body> </html>
Comments
Post a Comment