1

我正在使用这个插件来创建自动完成和标签的组合功能。我的输入字段代码和与之相关的脚本

<input id="form-tags-4" name="tags-4" type="text" value="">
<script type="text/javascript">
  $(function() {

    $('#form-tags-4').tagsInput({
      'autocomplete': {

        source: [
          'apple',
          'banana',
          'orange',
          'pizza'
        ]
      } 
    });
  });
</script>

它适用于静态数据,但是我希望应该存储存储在数据库源动态数据中的静态数据。

目前我的动态数据在 $normal_skill 中,其格式如下所示

Array
(
    [0] => stdClass Object
        (
            [normal_skill] => HTML
        )

    [1] => stdClass Object
        (
            [normal_skill] => CSS
        )

    [2] => stdClass Object
        (
            [normal_skill] => Javascript
        )
)

我试图从 normal_skill 收集数据并将其放入这样的数组中

$items = array();
foreach($normal_skill as $n_skill) {
 $items[] = $n_skill->normal_skill;
}

在用 $items 替换源之后,我调用了 $items 来代替源,自动建议和标签功能停止工作。

为了进行测试,我打印了 $items,它显示了数据,但是当用源替换时,就没有数据了。控制台也没有显示任何特定错误。

谁能告诉我如何用我的数据替换源,我希望它也可以执行逐字母搜索。例如:- 如果我输入“h”,那么以 h 开头的单词应该自动提示,但是现在所有包含“h”的单词都会显示出来

4

1 回答 1

0

您是否尝试将其传递给 javascript json_encode()

<input id="form-tags-4" name="tags-4" type="text" value="">
<script type="text/javascript">
  $(function() {

    $('#form-tags-4').tagsInput({
      'autocomplete': {
        source: <?= json_encode($items) ?>
      } 
    });
  });
</script>

如果它是一个远程源。

$items = array();
foreach($normal_skill as $n_skill) {
 $items[] = $n_skill->normal_skill;
}
exit(json_encode($items));

然后在您的 javascript 中,将其设置为源文件:

<script type="text/javascript">
  $(function() {

    $('#form-tags-4').tagsInput({
      'autocomplete': {
        source: './tags.php'
      } 
    });
  });
</script>
于 2018-03-12T11:01:43.773 回答