Topic: Adding options to mdb-select using jQuery
Hi;
We have a requirement to be able to dynamically set a collection of elements in an mdb_select component with the results of an AJAX call. The AJAX call returns a JSON array. We know the JSON is correct because we do an "alert" for each array member and the correct data is shown.
We have tried numerous methods to add the option elements but the mdb-select dropdown is always empty. If I manually add elements they appear fine.
This is the HTML:
DASHBOARD
SEASON
This is the jQuery:
$(document).ready(function(){
getSeasons();
// Get the list of seasons and add them to the season selector.
function getSeasons() {
$('#seasonList').empty();
$.get("/ajax/get_seasons.php",
{
},
function(response) {
var s= document.getElementById('seasonList');
$.each(response, function(i,season) {
s.options[s.options.length]= new Option(season.season_id, season.season_label);
});
});
}
});
Status
Open
Specification of the issue
- User: Pro
- Premium support: No
- Technology: jQuery
- MDB Version: -
- Device: -
- Browser: -
- OS: -
- Provided sample code: No
- Provided link: No
Mirosław Stasiak commented 4 years ago
If you want to dynamically change the data in select, you need to use the method $('.mdb-select').material_select('destroy'); Then update the data and initialize select again $('.mdb-select').material_select();