jquery - Using json encoded data from ajax post to populate radio buttons -
i need populate radio buttons select shipping method , price data depending on country order shipped to. doing ajax call.
$('#shippingcountry').change(function() { // dropdown list of countries var selc = $(this).val(); $.ajax({ type : 'post', url : 'formprocess.php', data: {country: selc}, datatype : 'json', encode : true }).done(function(data) { //console.log(data.msg); // data.msg thing returned // here need construct list of radio boxes... }); });
the thing returned data.msg
. populated like:
[ {"id":"9","name":"zone 1 standard","charge":"23.00"}, {"id":"11","name":"zone 1 fedex","charge":"37.00"}, {"id":"10","name":"zone 1 express","charge":"44.50"} ]
i need take data , make radio buttons each returned item like:
<label class="uit-option gblock"> <input type="radio" name="shippingmethod" value="9"> <span class="radio-option"></span> zone 1 standard $23.00 </label>
any appreciated.
i'd map data array of elements. shouldn't hard
var radios = data.msg.map(function(datum) { var label = $('<label>').addclass('ui-option gblock').text(datum.name + ' $' + datum.charge), input = $('<input>').attr({ type: 'radio', name: 'shippingmethod', value: datum.id }), span = $('<span>').addclass('radio-option'); return label.prepend(input, span); });
Comments
Post a Comment