如何填充 materialize.css 芯片自动完成数据？答案

【问题标题】：How can I populate materialize.css chips autocomplete data?如何填充 materialize.css 芯片自动完成数据？
【发布时间】：2017-01-29 13:24:01
【问题描述】：

有一个预先写好的值的例子：

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

但我需要从包含多个字符串值的数组中动态填充值。我尝试了类似的方法，但它不起作用。

my_data = $.parseJSON(data);                        

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

【问题讨论】：

标签： jquery autocomplete materialize

【解决方案1】：

你可以先创建你的对象，然后再传入：

<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

【讨论】：

我不知道如何，但这确实有效！非常感谢......我花了很多时间试图解决这个问题。再次感谢！

【解决方案2】：

我一直在使用自动完成功能来解决这些芯片问题。这是一个可以帮助其他需要帮助的人的 sn-p。

MySql 查询结果转为 JS Chip 数组格式：

$database = new Database();
$db_link = $database->connect();

$sql = "SELECT Nombre, Descripcion FROM estudio_componente;";

$gsent = $db_link->prepare($sql);
$gsent->execute();

$result = $gsent->fetchAll(PDO::FETCH_ASSOC);

$return_arr = array();

foreach($result as $row) {
 $componentes[$row['Nombre']] = null    ;
}

echo json_encode($componentes);

结果：

{"Sangre":null,"Orina":null,"Glucemia":null}

【讨论】：