json - JQuery radio button filters not working -
i doing simple filter using radio buttons, have 3 radio buttons in group. want append different data in unordered list(ul) based on radio button selection.i using 3 buttons filter between veg,non-veg , both(none).the code using
$(document).ready(function(){ $(".getmenu").click(function(){ $.getjson("data.json",function(result){ $.each(result, function(i, field){ var cat=field.category; var t=field.type; //putting case //radio filter 1 if($('.veg').checked) { if(t=="veg"){ switch(cat){ case "soups": $(".soup").append(field.menu_item + "<br />"); break; case "main course": $(".main").append(field.menu_item + "<br />"); break; case "starters": $(".starter").append(field.menu_item + "<br />"); break; } } } ////radio filter 2 else if($('.nveg').checked){ if(t=="non-veg"){ switch(cat){ case "soups": $(".soup").append(field.menu_item + "<br />"); break; case "main course": $(".main").append(field.menu_item + "<br />"); break; case "starters": $(".starter").append(field.menu_item + "<br />"); break; } } } //radio filter 3 else { switch(cat){ case "soups": $(".soup").append(field.menu_item + "<br />"); break; case "main course": $(".main").append(field.menu_item + "<br />"); break; case "starters": $(".starter").append(field.menu_item + "<br />"); break; } } }
and if not putting filter able append data json. file looks this:
[ {"category":"soups","menu_item":"tomato soup","type":"veg"}, {"category":"starters","menu_item":"summer salad","type":"veg"}, {"category":"main course","menu_item":"black beans chicken","type":"non-veg"}, {"category":"soups","menu_item":"lentil soup","type":"veg"} ]
checking of radio inputs should if ($('.veg').is(':checked') {...}
Comments
Post a Comment