thomas alt
thomas alt

Reputation: 41

How to change selected value of dynamically created bootstrap-select?

I'm making a new web app and I need to dinamically create and populate new bootstrap-select objects with jQuery and asyncronous calls.

I've tried to use .selectpicker('val', ) and .selectpicker().val() methods without success. I also tried this: How to set selected value on select using selectpicker plugin from bootstrap If I use the same code at page loading or in Firefox console it works.

function getOre (select)
{
   ...
   //per ogni ora del giorno
   for (i=0; i<data.length; i++)
   {
      var ora = '<option class="new_ora_options" value='+data[i].id+'>'+data[i].inizio+'</option>';
      select.append(ora);
   }
   ...
}

...
var sel = "<select class='selectpicker ora' id='ora_1'></select>";
$('.table').append(sel);
id_ora = "#new_ora_1";
$(id_ora).selectpicker({noneSelectedText:"Scegli la prenotazione",});
getOre(id_ora);
$(id_ora).selectpicker('refresh');
$(id_ora).selectpicker('val', 4);
....

Thanks

Upvotes: 2

Views: 1698

Answers (1)

thomas alt
thomas alt

Reputation: 41

After several several attempts I founded the problem: the asyncrounous call with select.append(ora) finished after $(id_ora).selectpicker('val', 4). I changed the code inserting the append instruction in the success function of the asyncronous call and all now all is working fine.

Upvotes: 2

Related Questions