从数据库而不是数组加载数据

Question

我正在使用 jQuery 插件 Tag-it 自动完成表单输入字段中的标签。该插件加载存储在数组中的可用标签。

$("#mytags").tagit({
    availableTags: ["c++", "java", "php", "javascript", "ruby", "python", "c"]
});

我从插件的 javascript 代码中复制了以下函数，我相信它是加载标签的主要函数：

tag_input.autocomplete({
            source: options.availableTags, 
            select: function(event,ui){
                if (is_new (ui.item.value)) {
                    create_choice (ui.item.value);
                }
                // Cleaning the input.
                tag_input.val("");

                // Preventing the tag input to be update with the chosen value.
                return false;
            }
        });

该插件工作正常并自动完成 availableTags 数组中的标签，但是我想对其进行一些小更改。 我不想从数组中加载标签，而是想从 mySQL 数据库表中加载标签。该表具有以下结构：

标签：

tag_id      tag_name
1            c++
2            java
3            php
4            javascript
5            ruby

那么如何从数据库（使用 PHP）自动加载标签名称，而不是从上面的数组加载？谢谢。

Answer 1

是的，你可以喜欢：

而不是

source: options.availableTags

使用这个：

source: function(request, response) {
    var term = request.term // This will hold the text you typed in autocomplete
    $.get(url, data, function(data){
        // Build an array to return
        var dataToReturn = [];
    });
    response(dataToReturn);
}

Answer 2

该插件似乎基于 jQuery UI Autocomplete，因此代码中的源参数可以是数组、字符串或回调。请参阅

http://jqueryui.com/demos/autocomplete/#remote

了解相应的文档。基本上，您可以将带有 url 的字符串放入服务脚本，该脚本会解析插件分配的 $_GET['term'] 并返回标签数组。

Answer 3

您可以使用 PHP 动态构建

$("#mytags").tagit({
    availableTags: ["c++", "java", "php", "javascript", "ruby", "python", "c"]
});

JavaScript 代码。此博客条目包含一个函数这应该大致就是你所需要的。

Answer 4

查看使用远程数据源的示例。 source 参数是执行 MySQL 查询并返回数据的 php 脚本的名称。

Answer 5

我用以下代码解决了同样的问题：

$('#tags').tagit({
    tagSource: function(request, response) {
        var term = request.term;
        $.get("/suggestTags?term=" + term, function(data){
            var dataToReturn = data;
            response(dataToReturn); 
        });
    }
});