php - typeahead bootstrap 无法处理来自 php 页面的动态数据

Question

我想在输入文本上使用提前输入，但它不起作用。

我的 html :

<link rel="stylesheet" type="text/css" href="<?php echo base_url('asset/css/typeahead.css')?>">

<?php foreach ($driver as $d) { ?>
    <input type="text" class="form-control input-lg typeahead" autocomplete="off" data-provide="typeahead" data-source="<?php echo $d['email']; }; ?>" id="email"  name="email">

<script src="<?php echo base_url('asset/js/typeahead.bundle.min.js') ?>"></script>

我的 Controller :

$this->db->select("*");
$this->db->from('user');
$query = $this->db->get();
$data['driver'] = $query->result_array();

当我开始输入输入文本时，它什么也没显示，它应该是 select 查询提供的 email 列表的下拉列表。没有错误返回。

Answer 1

你的代码有问题。您正在为每个 $driver 循环并在数据源中显示其电子邮件 ID，并且输入标签未关闭。

使用 Bootstrap typeaded

1. 获取来自 $driver 的所有电子邮件的列表使用以下代码
   $emails = array_column($driver, 'email');
2. 创建一个包含所有电子邮件的字符串。所有电子邮件都应该用双引号 ( " ) 括起来，并用逗号 ( , ) 分隔
   $csv = "\"" . implode("\",\"", $emails) . "\"";
3. 现在创建输入标签
   <input type="text" class="form-control input-lg typeahead" autocomplete="off" data-provide="typeahead" data-source='[<?php echo $csv; ?>]' id="email" name="email">
   请记住 data-source属性以单引号作为开始和结束。