Clear form field after select for jQuery UI Autocomplete

Question

We're using JQuery UI Autocomplete and I'm having problems clearing the textbox containing the search term once the query is complete. Here is our JQuery code:

$(document).ready(function () {
        $("form#search input#term").autocomplete({
            source: '<%= Url.Action("Display", "Search") %>',
            delay: 200,
            minLength: 3,
            parse: function (data) {
                var array = new Array();
                for (var i = 0; i < data.length; i++) {
                    array[array.length] = { data: data[i], value: data[i], result: data[i].link };
                }
                return array;
            },
            select: function (event, ui) {
                window.location.href = ui.item.value;
                $(this).val() = "";
                return false;
            }
        });
    });

This code works fine in Firefox, but IE 8 is throwing an exception and gives a dialog asking if I want to use the IE Script Debugger. I saw this Stack Overflow post: Clear form field after select for jQuery UI Autocomplete which says the solution to the problem is to return false from the JQuery select function, but that didn't help. Anyone have suggestions on how to fix this?

Answer 1

Using Jquery 1.5.1 and JQuery-ui 1.8.10, the following works for me:

select: function (event, ui) {
                event.preventDefault() // <===
                window.location.href = ui.item.value;
                $(this).val('');                
            }