成功使用Ajax后，不显示使用typeahead建议的jQuery自动完成

Question

我使用typeahead.js为我的多个输入放置标签。标签输入功能正常，除了不会自动完成建议。有什么办法可以解决这个问题？

我已经尝试了大多数与问题相关的解决方案，这些解决方案已经在此站点上，但是目前仍然无法显示自动完成建议。我总是对成功的ajax响应感到困惑，仅此而已。

我的jquery：

<script>
$("#s_to").tagsinput({
        tagClass: 'uk-badge',
        typeaheadjs: {
            source: function(query) {
                console.log(query);
                url = "<?php echo base_url(); ?>index.php/<?php echo $loc_pts; ?>/ajax_email";
                var s_to = extractLast(query);
                ajax_status = "fail";
                $.ajax({
                    url: url,
                    method: "POST",
                    data: {
                        s_to: s_to
                    },
                    async: false,
                    dataType: "json",
                    success: function(json){
                        return json.s_to;
                    }
                });
            }
        }
    });
</script>

我的输入：

<input required type="text" name="s_to" id="s_to" class="controls uk-autocomplete-results" value="<?php echo $s_client_email; ?>" autocomplete="on" data-provide="typeaheadjs" />

我的相关脚本：

<script src="<?php echo base_url(); ?>assets/bower_components/typeahead.js/typeahead.jquery.min.js"></script>

console log output screen shot

假定该输入能够接收多个输入，并且选择的每个输入将显示在标签内。更难的是没有错误消息显示。因此，我知道我的ajax正确完成了。

Answer 1

主要问题是您没有在正确的范围内返回数组。您的return json.s_to;在ajax成功函数中，但是您需要在父范围中返回该值。因此，代码应如下所示：

$("#s_to").tagsinput({
    tagClass: 'uk-badge',
    typeaheadjs: {
        source: function(query) {
            console.log(query);
            url = "<?php echo base_url(); ?>index.php/<?php echo $loc_pts; ?>/ajax_email";
            var s_to = extractLast(query);
            ajax_status = "fail";
            var toReturn = [];
            $.ajax({
                url: url,
                method: "POST",
                data: {
                    s_to: s_to
                },
                async: false,
                dataType: "json",
                success: function(json) {
                    toReturn = json.s_to;
                }
            });
            /* This is the correct scope to return the array */
            return toReturn;
        }
    }
});