jQuery   发布时间:2022-03-30  发布网站:大佬教程  code.js-code.com
大佬教程收集整理的这篇文章主要介绍了jquery – Ajax调用填充Typeahead Bootstrap大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。
我想要做的是通过Ajax获取一个json对象,并使用一种值填充Bootstrap Typeahead.

这是我的代码

nameTypeHead: function () {
        var _self = this,searchInput = $('#nameTypeHead'),arr = [];

        function getArray() {
            $.ajax({
                url: '/Home/AutoComplete',type: 'post',dataType: 'json',data: { searchText: searchInput.val() },success: function (data) {
                    $.each(data,function () {
                        arr.push(this.Name);
                    });
                    return arr;
                }
            });
        }

        searchInput.typeahead({
            source: getArray()
        });
    }

我收到arr为null的错误

我也尝试用.parseJSON()但没有成功:

$.each($.parseJSON(data),function () {
   arr.push(this.Name);
});

我可以做什么来显示我的Json对象的值在类型中的值?

如果在Ajax成功的话我把alert(JSON.Stringify(data));它正确地提醒我的Json对象.

解决方法

我从头开始:
$('#typeahead').typeahead({

    source: function (query,process) {
        return $.getJSON(
            'path/to/lookup',{ query: query },function (data) {
                return process(data);
            });
    }

});

数据是一个简单的JSON数组,如:

[
   "John","Jane","Alfredo","GiovAnni","SupeRMAN"
 ]

如果您的数据数组具有不同的结构,只需将其重新排列,然后再传递给process()方法即可.

你可以找到一个实例here.

编辑 – 基于你的json数据:

[
    {'id':'0','name':'John'},{'id':'1','name':'Jane'},{'id':'2','name':'Alfredo'},...
}

getJSON回调成为:

function (data) {

    var newData = [];

    $.each(data,function(){

        newData.push(this.Name);

    });

    return process(newData);

});

大佬总结

以上是大佬教程为你收集整理的jquery – Ajax调用填充Typeahead Bootstrap全部内容,希望文章能够帮你解决jquery – Ajax调用填充Typeahead Bootstrap所遇到的程序开发问题。

如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。