Success callback is rebound on every keyup, causing a recursive call to itself

[skwp]

If you put a console.log inside the success callback (options.success), you'll notice that you're rebinding the callback on every keyup event. Which means on the first autocomplete, your callback is called once, second time twice, then three times, etc.

This is probably not dangerous, but possibly a performance issue and could lead to subtle bugs.

In either case, the success callback should only be bound a single time, when the box is initialized. The only reason you can't do that is because it currently relies on the value of the box in order to put it back after clearing it. The box seems to be cleared by select.trigger("liszt:update") - not sure why that clears the box, or why we can't just leave the search term in the box if nothing is autocompleted.

Not sure what to do about this without understanding why the trigger is clearing out the box, but happy to help if someone points me in the right direction. Thanks!

[perryzheng]

You can try something like this.

items = callback(data);
var tempValue = field.attr('value');
if (tempValue == val) {
    $.each(items, function (value, text) {
        if ($.inArray(value + "-" + text, selected_values) === -1) {
            return $("<option />").attr('value', value).html(text).appendTo(select);
        }
    });
    select.trigger("liszt:updated");
    field.attr('value', val);
    field.css('width', 'auto');
    return field;
} else {
   console.log("tempValue: " + tempValue + "  val: " + val);
}

Two things I did:

1. I got rid of the recursive success(data) call.
2. I only do select.trigger("liszt:updated") if the what the user typed up to that point matches exactly val at the point. Sometimes they could get out of sync. And if you open up your browser, you could see console.log(...) gets called multiple types.

[plentz]

+1