How to render data in a drop down using JQuery and Ajax in Backbone.Marionette -


i'm using backbone , marionette web app, i'm trying populate drop down menu json after option has been selection.

so user selects account type, ajax request fired , data returned.

however i'm stuck @ populating relevant drop downs returned data.

this ajax request triggered after user selects account:

   accountselect: function () {                  var accountcode = $("select#accountcombo").val().tostring();                 var jsonurl = "webapp/json?accountcode=" + accountcode;                 $.ajax({                     url: jsonurl,                     type: "post",                     data: {                         accountcode: $("select#accountcombo").val()                     },                     datatype: "text",                     success:function(data)                     {                             return                             {                              states: _.pluck(data.states, 'state'),                             products: _.pluck(data.products, 'product')                               };                             $('#select#statecombo').selectpicker('render');                             $('#select#productcombo').selectpicker('render');                         //  this.render();                     },                  });                } 

so looking @ console see request works, data returned, success:function element isn't working. drop downs populated default on load work fine , not sure i'm missing.

this html states i'm trying populate (held in template):

    <div id ="states"><h2>states</h4>     <% _.each(states, function(item){ %>     <li value="<%= item %>"><%= item %></li>     <% });%>     </div>   

the json in following format if helps:

{     "states": [         {             "state": "al",             "products": [                 {                     "product": "phone",                     "types": [                         {                             "type": "smarta1",                             "typerelease": [                                 2013,                                 2014                             ]                         }                     ]                 }             ]         }             ] } 

sorry, i'v made mistake

try

// data response var states =  _.pluck(data.states, 'state'); var products =  _.pluck(data.products, 'product'); // create select inner html var statescontent = _.map(states, function(val){ return '<option>'+val + '</option>';}).join(); var productscontent = _.map(products, function(val){ return '<option>'+val + '</option>';}).join(); // rerender select $('select#statecombo').html(statescontent).selectpicker('render'); $('select#productcombo').html(productscontent).selectpicker('render'); 

Comments

Popular posts from this blog

Android layout hidden on keyboard show -

google app engine - 403 Forbidden POST - Flask WTForms -

c - Why would PK11_GenerateRandom() return an error -8023? -