Combine data from 2 AJAX calls into one array?

Question

The array should be used as Autocomplete suggestions for this searchbox:

<input type="text" class="searchbox" placeholder="Type here...">

I tried to combine AJAX calls but I'm getting these errors:

Cannot read property 'slice' of undefined

Cannot read property 'length' of undefined

If you have an idea of how to properly structure this, please let me know.

Answer 1

You started moving in the right direction – you need an array that both AJAX calls can access, but you are modifying the array wrong – you need to add new elements, not re-assign the whole array, eg:

$.map(list, function(v,i) {
    results.push({
        label: v.Title + ' (' + v.Year + ')',
        value: v.Title
    });
});

Another mistake is initialising autocomplete plug-in before you get the data – it would make more sense to prepare the array first, and then initialise autocomplete when all async tasks (your AJAX calls are async tasks) are done. See this example: multiple ajax calls wait for last one to load, then execute