jQuery Autocomplete, passing success data to the select method

Question

I have json response which has some properties. I have created an array for a list. When i click the list item some inputs will be filled by item id.

To do this, i am thinking passing full data object to the select method, then if clicked some item from list, i will search for id in data object and if i found, i will print them all to the inputs. But i couldn't success to pass fullObj data to the select method. It returns not defined error. Here is my code:

$( "#musteriId" ).autocomplete({
    source: function( request, response ) {
        $.ajax({
            url : '/musteri-bul',
            dataType: "json",
            data: {
                name_startsWith: request.term,
            },
            success: function( data ) {
                //console.log(data);
                var arr = [];
                var i = 0;
                var fullObj = data;
                $.each(data, function(index, value){
                    console.log(index);
                    var obj = {
                        label: index
                    };
                    arr[i] = obj;
                    i++;
                });
                response(arr, fullObj);
            }
        });
    },
    minLength: 3,
    select: function(event, ui ) {
        console.log(fullObj);
    },
});

Answer 1

I have solved it. I just added some properties to the obj then pass.

$( "#musteriId" ).autocomplete({
    source: function( request, response ) {
        $.ajax({
            url : '/musteri-bul',
            dataType: "json",
            data: {
                name_startsWith: request.term,
            },
            success: function( data ) {

                var arr = [];
                var i = 0;
                var fullObj = data;
                $.each(data, function(index, value){
                    $.each(value, function(idx, v){
                        var obj = {
                            label: idx,
                            value: v,
                            phone: 12313
                        };
                        if(idx == "isim"){
                            arr[i] = obj;
                            i++;
                        }
                    });
                });
                response(arr, fullObj);
            }
        });
    },
    minLength: 3,
    select: function(event, ui ) {
        console.log(ui);
    },
});

Answer 2

First, make the ajax call, then, on success callback, start autocomplete with the in-hand data:

$.ajax({
    url : '/musteri-bul',
    dataType: "json",
    data: {
        name_startsWith: request.term,
    },
    success: function( data ) {
        //console.log(data);
        var arr = [];
        var i = 0;
        var fullObj = data;
        $.each(data, function(index, value){
            console.log(index);
            var obj = {
                label: index
            };
            arr[i] = obj;
            i++;
        });

        $( "#musteriId" ).autocomplete({
            source: arr,
            minLength: 3,
            select: function(event, ui) {
                console.log(fullObj);
            },
        });
    }
});