Search code examples
jqueryautocompletematerialize

How can I populate materialize.css chips autocomplete data?


There is an example with pre-written values:

$('.chips-autocomplete').material_chip({
    autocompleteData: {
      'Apple': null,
      'Microsoft': null,
      'Google': null
    }
  });

But I need to populate values dynamically from array which contains several string values. I tried something like this, but it doesn't work.

my_data = $.parseJSON(data);                        

$('.chips-autocomplete').material_chip({
    autocompleteData: {
        $.each(my_data, function(index, value) {
            value : null;                           
        });
    }                                                       
});

Solution

  • You can create your object first before passing it in:

    <div class="chips chips-autocomplete"></div>
    
    var my_data = {
      "0":"Apple",
      "1":"Microsoft",
      "2":"Google"
    }
    
    var myConvertedData = {};
    
    $.each(my_data, function(index, value) {
      myConvertedData[value] = null;
    });
    
    $('.chips-autocomplete').material_chip({
      autocompleteData: myConvertedData
    });
    

    JSFiddle