jQuery自动完成与远程json数据

时间:2011-12-16 20:55:13

标签: jquery facebook-graph-api autocomplete jquery-autocomplete jquery-ui-autocomplete

jQuery(document).ready(function () {

var aToken = document.getElementById('aToken').value;

    jQuery("#name_inp").autocomplete("https://graph.facebook.com/me/friends?access_token="+aToken, {
       width: 500,
       height: 200,
   max: 5000,
        dataType: 'json',
        cacheLength: 100,
       minChars: 1,
        parse: function (data) {
    alert(data);
            var rows = new Array();
           data = data.data;
       console.log(data);
            for (var i = 0; i < data.length; i++) {
                rows[i] = { data: data[i], value: data[i].name, result: data[i].name };
           }
             return rows;
         },
        formatItem: function (data, i, n, value, text, a, b, c, d) {
            var x = getImage(data.id);
             return "<div class='test2' onclick='return getId("+data.id+");'><span>" + data.name + "</span></div>";
       },

   }
     )
 });

上面的代码有助于从远程图形api调用中获取用户朋友列表。可以使用任何一个帮助来保存json数据并使用用户查询进行搜索并从保存的变量中填充。

这样可以节省时间并准确填充结果。

谢谢..

1 个答案:

答案 0 :(得分:1)

代码本身很有说服力:)

希望它有所帮助!

jQuery(function ($) {

var aToken = $('#aToken').val();

$.get("https://graph.facebook.com/me/friends", {access_token: aToken}, function(result){

        var ppl = new Array();
        for(var i = 0; i < result.data.length; i++){
            ppl[i] = result.data[i].name;
        }

        $("#name_inp").autocomplete({
                                source: ppl,
                                width: 500,
                                height: 200,
                                max: 5000,
                                dataType: 'json',
                                cacheLength: 100,
                                minChars: 1
                            });
}, 'json');
});