Autocompleter remote call?

[m.curtis]

I've got the autocompleter working based off the code in the
functional tests for a stored javascript response. Does anyone have
any example code for hooking it up to a remote JSON request?

I saw in the docs that findChoices will refresh the autocomplete, but
it seems like there should be a remote option for the autocompleter
itself?

Thanks!

[m.curtis]

I ended up patching autocompleter to accomplish this for the time
being, if anybody has a different/better way of accomplishing this,
please let me know.

https://github.com/mcurtis/scripty2

[Tom Gregory]

I know I'm kinda resurrecting an dead thread here (frankly, they're
all a bit dead)...

I've been tackling this remote autocompleter problem as I'd like to
use scripty2 for a new project, but need this feature (and an in-place-
editor). I've looked at your code (@mcurtis), and think there is a
simpler way that doesn't require a fork, which I would prefer as it's
more future-proof.

// This declaration is the same as the second functional test
// (the one w/ objects), except that a) choices starts as empty
// and b) choiceValue can return null.
var ac = new S2.UI.Autocompleter('autocomplete', {
choices: [],
choiceValue: function(choice) { return choice ? choice.name :
null; },
choiceTemplate: (new Template('#{text} <em>(#{object.login})</
em>'))
});

// Override findChoices for remote call
ac.findChoices = function () {
new Ajax.Request('/person/autocomplete2?
search='+this.input.getValue(), {
// TODO: use prototype's Ajax.Responders for spinner
onSuccess: function(response){
this.setChoices(response.responseJSON);
}.bind(ac)
});
}.bind(ac);

My gotchas were these: 1) I've been away from javascript for a while,
and forgot that Prototype's evalJSON() requires key names to be in
double quotes, (2) to set my content-type to 'application/json', (3)
forgetting to include the CSS theme package from the functional test.

I'm still grappling with a third frustration, which is that in Safari
(v5.05) the created menu is offset by the applied style value of left
& top. It seems the positioning is not correct when the defer()-ed
placement function is run (which is after dom:load, according to the
console output order), but is correct by the time window.load is
handled. (There is no issue in Firefox 5; the order is different: the
layout defer() runs before dom:load, but the layout info is still
correct at both times.)

Originally, I only saw this behavior when using the Ajax version;
everything was correctly placed when using the local version--however,
I've been able to duplicate it for the local version too, so I'm
wondering if there is a race condition between the rendering needed
for getLayout() and defer().

TAG