首页 > 解决方案 > 如何在 Materialise CSS 中删除 Autocomplete 上的图像 url?

问题描述

我有这个 JavaScript 方法,它department使用 API 从表中获取所有数据:

<script type="text/javascript">
  $(document).ready(function() {
      //Autocomplete
      $(function() {
        $.ajax({
          type: 'GET',
          url: 'http://127.0.0.1/EnrollmentSystem/api/department/read.php',
          success: function(response) {
            var departmentArray = response;
            var dataDepartment = {};
            //console.log(departmentArray['records']['0'].name);
            console.log(departmentArray['records'].length);
            for (var i = 0; i < departmentArray['records'].length; i++) {
              console.log(departmentArray['records'][i]);
              dataDepartment[departmentArray['records'][i].name] = departmentArray['records'][i].name; //departmentArray[i].flag or null
            }
            $('input.autocomplete_department').autocomplete({
              data: dataDepartment,
            });
          }
        });
      });
  });
</script>

我用这个在我的页面上调用它:

<div class="row lt-row-content input-field">
    <div class="col s12 m3 l3 lt-input-field">Department</div>
    <div class="col s12 m8 l8 lt-input-field"><input type="text" name="" id="autocomplete-input" class="autocomplete_department lt-input-field"></div>
</div>

我担心的是如何删除自动完成中显示的图像?

在此处输入图像描述

至于我的对象,只有我包含在我的模型中的id名称

class Department{
    private $conn;
    private $table_name = "department";

    public $id;
    public $name;

    public function __construct($db){
        $this->conn = $db;
    }
...

这是的输出console.log(departmentArray['records'][i]);

在此处输入图像描述

标签: javascriptajaxautocompletematerialize

解决方案


寻找与原始帖子类似的答案。如果原始帖子是关于 Jquery 自动完成的,camaulay 给出的答案是正确的。它不是。原始帖子是关于 Materializecss 自动完成的,它应该是数据而不是自动完成元素列表的来源。` // 从https://materializecss.com/autocomplete.html
复制/粘贴

  $(document).ready(function(){
    $('input.autocomplete').autocomplete({
      data: {
        "Apple": null,
        "Microsoft": null,
        "Google": 'https://placehold.it/250x250'
      },
    });
  });`[codepen example.][1]

请参阅"Apple": null-值是在 Materializecss 自动完成中抑制图像的方式。


推荐阅读