Google Closure: Setting Input for AutoComplete Dynamically

The Google Closure (GC) Javascript Library makes it very easy to create an AutoComplete UI, as this demo shows - http://closure-library.googlecode.com/svn/trunk/closure/goog/demos/autocomplete-basic.html .

Basically, all we have to do is define an array and pass it on as one of the parameters. I'd like to be able to update the array dynamically and have AutoComplete show the changes immediately.

Example, if there are two arrays

list1 = ["One", "Two", "Three"]
list2 = ["1", "2", "3"]

and an Au开发者_如何学JAVAtoComplete has been initialized using list1,

var suggest = new goog.ui.AutoComplete.Basic(list1, document.getElementById('input'), false);

how can I update the existing AutoComplete (suggest) to use list2?

There isn't a public API to do this. You can create a subclass with a method that changes the protected matcher_ variable like this:

this.matcher_ = new goog.ui.AutoComplete.ArrayMatcher(list2, false);

If you want to dynamically update from a remote source, use goog.ui.AutoComplete.Remote.

Here is what i use to to be able to update the the array with the basic Auto Complete

/**
 * Set the post data for the matcher.
 * @param {string} content Post data.
 */
goog.ui.AutoComplete.Basic.prototype.setContent = function(content) {

  this.matcher_.setContent(content);
};
/**
 * Set the post data.
 * @param {string} content Post data.
 */
goog.ui.AutoComplete.ArrayMatcher.prototype.setContent =function(content) {
    this.rows_ = content;
  this.content_ = content;
};

then from your code you would call suggest.setContent(myarray) when ever you want to update the list

Firstly get the matcher by using getMatcher(), then set the new rows by using the setRows(newRows).