ajax - How to grep JSON on change of select box with jquery -
i'm still bit of newbie when comes finding data , displaying json object, take questions it's worth , i'll try detailed possible.
i need bit of writing jquery take value of option in select box on change event , filter list populated json object.
basically i'm trying eventually, multi dimensional faceted navigational model takes json object , allows user filter list on change event.
i realize bit vague, i'll try , answer you're questions as possible.
here's have far js:
function getbeers(){ $.grep(getbeertype, function(key, val){ $.getjson('includes/data.json', function(data) { var beers = []; $.each(data, function(key, val) { beers.push('<li id="' + key + '">' + val + '</li>'); }); $('<ul/>', { html: items.join('') }).appendto('#beerlist'); }); }); }; $("#beerselector").change(function(){ var getbeertype = $(this).val(); getbeers(getbeertype); }); and json:
{"beers":[ { "name":"surly wet", "type":"ale" }, { "name":"spaten oktoberfest", "type":"lager" }, { "name":"pliny elder", "type":"ale" }, { "name":"summit ipa", "type":"ale" }, { "name":"surly coffee bender", "type":"porter" }, { "name":"lagunitas ipa", "type":"ale" } ]} and html:
<label for="beerselector">what's favorite beer type?</label> <select id="beerselector"> <option value="">i beer</option> <option value="ale">ales</option> <option value="lager">lagers</option> </select> <div id="beerlist"></div>
Comments
Post a Comment