jQuery autocomplete works with a local string but not when the same String is called off the server

Question

This is related to the question I asked at http://stackoverflow.com/questions/2802948/how-to-make-an-ajax-call-immediately-on-document-loading

I am trying to get a String delimited by | characters from the server to use as input for jQuery's .autocomplete() plugin. If I have a local variable declared in the code then it works fine, but if I try to define this variable using an ajax call to the server it doesn't work even though the alert shows that I have populated the variable "dataArray" with exactly the same characters.

My code (that doesn't work) is:

$(document).ready(function(){
    $.ajax({
        type: "GET",
        url: "../AutoComplete",
        success: function(data) {
            var dataArray = data;
            alert(dataArray);
            $("#example").autocomplete(dataArray);
        }
    });
});

The value that is printed in the alert is:

"Manuscript|Text|Information Object|Basketball|Ball|Sporting Equipment|Tarantula|Spider|Australian Spider|Cricket Player|Medieval Artefact|Person|Sportsperson|Leonardo Da Vinci|Country|Language|Inventor|Priest|Electronics Manufacturer|Object|letter|Artefact|governance model|Organism|Animal".split("|");

If instead I do this (although this not a solution):

$(document).ready(function(){
        $.ajax({
            type: "GET",
            url: "../AutoComplete",
            success: function(data) {
                var dataArray = "Manuscript|Text|Information Object|Basketball|Ball|Sporting Equipment|Tarantula|Spider|Australian Spider|Cricket Player|Medieval Artefact|Person|Sportsperson|Leonardo Da Vinci|Country|Language|Inventor|Priest|Electronics Manufacturer|Object|letter|Artefact|governance model|Organism|Animal".split("|");                  
                alert(dataArray);
                $("#example").autocomplete(dataArray);
            }
        });
    });

The autocomplete works fine?

Answer 1

Hi again :-)

It looks like your server is returning the string plus the piece of javascript code. The alert ends up with Animal".split("|"); You have to execute that line as javascript code.

Try to rewrite your code like this:

success: function(data) {
    var dataArray = eval(data);
    $("#example").autocomplete(dataArray);
}

Answer 2

Do not put the split in the output from the ../AutoComplete script. Also, get rid of the quotes.

In other words, make ../AutoComplete return:

Manuscript|Text|Information Object|Basketball|Ball|Sporting Equipment|Tarantula|Spider|Australian Spider|Cricket Player|Medieval Artefact|Person|Sportsperson|Leonardo Da Vinci|Country|Language|Inventor|Priest|Electronics Manufacturer|Object|letter|Artefact|governance model|Organism|Animal

Then, do:

dataArray = data.split("|");

Answer 3

Is ../AutoComplete returning .split("|");?