Question

在我的laravel应用程序中，当将源与ajax一起使用时，我遇到typeahead.js自动完成的问题，建议菜单不会显示，但是当源指向具有我所有标签（用逗号分隔）的div时，完美，我的意思是这样可以运作：

    <div id="available-tag-data" class="tag-data">
     adventure, literature, poertry               
   </div>

和JS内：

source: substringMatcher(parseTags('available-tag-data'))

并且这种方式不会显示建议菜单（没有控制台错误）：

    source: function (query, result) {

                        $.ajax({
                            url: "/get-tag",
                            data: 'query=' + query,
                            dataType: "json",
                            type: "post",
                            success: function (data) {
                                console.log(data)

                                let myData = []
                                for (let i = 0; i < data.options.length; i++) {
                                    myData.push(data.options[i].name)
                                }

                                console.log(myData)

                                result($.map(myData, function (item) {
                                    return item
                                })

)
                        }
                    })
                }

通过"/get-tag"网址检索的json：

"{"options":[{"name":"adventure"},{"name":"literature"},]}"

这也不起作用：

success: function (data) {
                            console.log('data', data)

                            var newData = [];
                            $.each(data, function () {
                                newData.push(this.name);
                            });

                            result(newData);

                            return;

}

响应：

["adventure","literature"]

听起来像是像第一个示例中那样已经预加载了内容，或者已经在一个已填充的JS数组中，它将起作用（我已经尝试在ajax附带新数据时覆盖该数组），但是不确定，我是什么做错了吗？ json响应应该如何？谢谢

Answer 1

最后我完成了，问题是这段代码：

{
                hint: true,
                highlight: true,
                minLength: 1,
            },

在resource代码之前

我的意思是这是我之前的代码：

$('.taggle_input').typeahead(
            {
                hint: true,
                highlight: true,
                minLength: 1,
            },
            {
                name: 'tags',
                //source: substringMatcher(parseTags('available-tag-data'))
                //source: substringMatcher(myTags)
                source: function (query, result) {
                    console.log(query)
                    $.ajax({
                        url: "/server2",
                        data: 'query=' + query,
                        dataType: "json",
                        type: "post",
                        success: function (data) {
                            console.log(data)
                            result($.map(data, function (item) {
                                return item;
                            }))
                        }
                    })
                }

            })

但现在可以了，希望这对将来的人有帮助

为什么我的typeahead.js在ajax调用中不显示菜单？

1 个答案: