jquery - Looping through external JSON file -


i have json file containing 2 different holiday resorts. compare values within 2 dropdown menus 2 values in json file.

for example, if destination dropdown menu has value "caribbean" selected , comfortleveldropdown has value "4" selected, search through external json file, find resort matching descriptions, , display information matching resorts.

html:

        <div class="searchdestination">             <br>             <label><b>select destination: &nbsp;</b></label>             <select id="destination">                 <option value="0">please select:</option>                 <option value="europe">europe</option>                 <option value="africa">africa</option>                 <option value="carribian">the carribian</option>                 <option value="asia">asia</option>             </select>         </div>      <div class="searchcomfortlevel">         <br>         <label><b>select comfort level: &nbsp;</b></label>         <select id="comfortlevel">             <option value="0">please select:</option>             <option value="3">three star</option>             <option value="4">four star</option>             <option value="5">five star</option>>         </select>         </div>          <div id="buttons">         <button id="reset" class="button-error pure-button" style="color:white">reset</button>          <button id="search" class="button-success pure-button" style="margin-left:5px; color:white">search</button>         </div> 

javascript:

$( "#search" ).click(function() {     var destination = $('option:selected', "#destination").attr('value');     var comfortlevel = $('option:selected', "#comfortlevel").attr('value');     $.getjson('resort.json', function (data) {         $.each(resorts, function(i, v) {             if (v.destination == "carribian") {                 alert(v.destination);             }         });     }); }); 

resort.json

{      "resort": [         {             "id":"resort1",             "destination":"carribean",             "name":"les boucaniers",             "location":"martinique",             "comfortlevel": "4",             "activities":["water skiing", "tennis", "scuba diving", "kitesurf", "spa"],             "price":1254,             "startdate":"2016-01-01",             "enddate":"2016-12-31",             "short_description":"the resort of les boucaniers located on laid-back beach-covered south coast of island, , placed martinique holidays both relaxing , awe-inspiring.",             "picture":"images/resort1pic1small.jpg",             "long_description":"a divers' paradise in baie du marin, legendary spot.<br>its bungalows discreetly lodged in tropical garden beside white sand beach in superb marin bay. magical site can enjoy taste of everything, alone or family or friends. try water sports , magnificent club med spa*. you'll enchanted exotic flavours of local cuisine , joyful spirit of caribbean.",             "url":"resorts/resort1.html"         },         {             "id":"resort2",             "destination":"indian ocean",             "name":"la plantation d'albion",             "location":"mauritius",             "comfortlevel": "5",             "activities":["kids club","golf", "scuba diving", "flying trapeze", "tennis", "sailing", "spa"],             "price":2062,             "startdate":"2016-01-01",             "enddate":"2016-12-31",             "short_description":"beautifully located in 1 of last remote creeks on island, la plantation d'albion club med welcomes demanding of guests world of supreme refinement.",             "picture":"images/resort2pic1small.jpg",             "long_description":"in remote beauty spot, savour luxury of mauritian lifestyle. <br> idyllic natural setting enhanced sublime decor designed marc hertrich , nicolas adnet, , resort's top-end comfort reflected in beautifully spacious rooms. exceptional cinq mondes spa* , luxurious overflow pool add ideally zen touch.<br> resort entirely devoted fulfilling guests' desires , offers discreet, personal service in swimming areas, bars , 'table gourmet' restaurants.",             "url":"resorts/resort2.html"         } ]} 

you're looping through wrong data:

$( "#search" ).click(function() {     var destination = $('option:selected', "#destination").attr('value');     var comfortlevel = $('option:selected', "#comfortlevel").attr('value');      $.getjson('resort.json', function (data) {         $.each(data.resort, function(i, v) { // <-- line changed             if (v.destination == "caribbean") { // <-- fixed typo                 alert(v.destination);             }         });     }); }); 

note: sure return json says "resort" not "resorts"? if that's case update line accordingly.


Comments

Popular posts from this blog

how to insert data php javascript mysql with multiple array session 2 -

multithreading - Exception in Application constructor -

windows - CertCreateCertificateContext returns CRYPT_E_ASN1_BADTAG / 8009310b -