jQuery Autocomplete Problem - Not treating Arrays correctly.

Question

I am using jQuery Autocomplete and MVC to populate a dropdownlist with a bunch of column names.

Whenever a user changes the value of a DropDownBox on my form I make a request to my controller to return a new list of columns (as an array, wrapped in a JSON Result) that will populate my AutoComplete boxes.

My Problem is that the autocomplete doesn't make a distinction between words and and instead insists on doing it character by c,h,a,r,a,c,t,e,r. It's very annoying. Here is the code:

function PopulateColumnsList(list) { 
    $(".columnDropdown").setOptions({ data: list });
}

$(document).ready(function() {
    $(".columnDropdown").autocomplete("", {
        width: 320,
        max: 14,
        highlight: false,
        minChars: 0,
        scroll: true,
        scrollHeight: 300
    });

    $("#Data").change(function() {
        $.ajax({
            url: "/Home/ColumnNamesForDataSelect",
           type: "GET",
           data: { DataSelectID: parseInt($('#Data').val()) },
            success: PopulateColumnsList
       });
  });

});

The Get Returns this response:

["Memo","Balance"]

Butmy AutoComplete will show each of these as single letters rather than two: Memo, Balance. I thought this was correct as the example code shows a similar way to return the result.

Any ideas?

Thanks in Advance.

Answer 1

Well, you are binding to the onChange() event, which would be letter by letter. I ran into something similar, and wanted the entire value. I handled this by overriding the parse() function and specifying my XML parser/format, then I overided the result() function to parse the row[] data that I set back in the parse() function.

http://stackoverflow.com/questions/1114056/how-do-you-use-post-with-jquery-autocompleter

So basically, I always have row[] with Data and Name from the selection (u can do JSON too).

And, you will also need to override the formatItem() function to handle your new row[] array.

Answer 2

Possible for you to show an example of what you want? I am not following a hundred percent.

My autocomplete is just the user starts typing in a textbox and it looks at the letters that are being typed in and returns possible words with that result.

The way I am doing it is this

// javscript file
$("#id").autocomplete("AutoFill", { delay: 1 });


// view
public ContentResult AutoFill(string q)
{
    var result = // go to database and grab all words that Start with whatever is in q.

    string sendBack = null;
    for (int i = 0; i < result.Count; i++)
    {
        sendBack += result[i] + Environment.NewLine;
    }
    return Content(sendBack);

}

Not sure if that helps you at all.

Answer 3

I realize this may be crazy talk, nor is it much of an answer, but since it seems to be iterating over the items in each subscript of the response, have you tried wrapping your response in another array like, [["Memo","Balance"]]?

Answer 4

There are several jQuery autocompleters out there. It would help if you would mention which one you are using. For example, it doesn't look like http://docs.jquery.com/Plugins/Autocomplete/setOptions is the setOptions you are using?