jQuery Autocomplete losing text on AutoPostBack

Question

I have a jQuery Autocomplete field on an ASP.Net Webform and everything has been working great until now. I also have a DropDownList that I have a need to fire onSelectedIndexChanged with AutoPostBack.

When I changed my code to do the AutoPostBack, the text field that has the jQuery AutoComplete on it comes back blank. However, if I look at the source of the page, the text is in the text field. If I now post the form, the page will send back a blank field. My Google-Fu is weak on this one, as I could not come up with any workaround for it.

Has anyone had any issues like this with the Autocomplete field getting blanked out on an AutoPostBack, and how did you get around it?

I can post code if it's really necessary, but I'd need to sanitize a lot of it before I could due to company policy.

Answer 1

How is the autocomplete field being initialized? Is it being set to empty string either on page load from server or by the autocomplete jQuery plugin on document.ready?

If the source code for the plug-in is setting the textbox to empty string on document.ready then try the following:

// Store current textbox value in a var
var temp = $('#mytextbox').val();

// Initialize the autocomplete plugin (winging it on the syntax)
$('#mytextbox').autocomplete();

// Reset the value of the textbox.
$('#mytextbox').val(temp);

Answer 2

If you use jQuery Autocomplete plugin 1.1, * Revision: $Id: jquery.autocomplete.js 15 2009-08-22 10:30:27Z joern.zaefferer $

Add "autoPostBackSelection: false," in the options Ex:

$.Autocompleter.defaults = {
    inputClass: "ac_input",
    resultsClass: "ac_results",
    loadingClass: "ac_loading",
    minChars: 1,
    delay: 400,
    autoPostBackSelection: false,
    ...

After, add this just before the "return true; at the end of the "selectCurrent() function.

if (options.autoPostBackSelection == true) {
        __doPostBack($input.id, "");
      }

Example:

function selectCurrent() { ... if (options.autoPostBackSelection == true) { __doPostBack($input.id, ""); } return true; }