I just answered my own question. Here's the scenario and what I did
to the autocomplete plugin:
I have an autocomplete field and a hidden field next to it. The
autocomplete field is for names, and the hidden field is for the id of
the name, which is used to query the database for the record. These
were the constraints on the fields:
- values must be selected from the autocomplete, which sets the hidden
field's value as the id of that particular entry (basically making the
text input into a select input...but allowing people to type)
- if a user does anything to the input box but doesn't select a field
from the autocomplete, then it should clear the hidden id field
The autcomplete plugin's result() function only calls when the user
selects something from the autocomplete, so if the user selects
something then CHANGES the value but doesn't re-select from the
autocomplete, the value of the hidden input remains.
This is what I changed in the plugin. There are several parts:
1) first, I define a new variable, selectionMade, for the object
around line 80, right under where hasFocus is defined:
var hasFocus = 0;
var selectionMade = 0;
2) next, I tell the function that tracks keypresses to set
selectionMade to 0 every time a key is pressed that changes the value
of the input, around line 155:
default:
selectionMade = 0;
clearTimeout(timeout);
timeout = setTimeout(onChange, options.delay);
break;
3) I then add a line that sets selectionMade to 1 whenever something
is selected. This can be placed anywhere in the selectCurrent()
function. I put mine around line 225
$input.val(v);
selectionMade = 1;
hideResultsNow();
4) Finally, I add an if check on the .blur() function on the input
object. This checks to see if selectionMade is 1 or 0. If it is 0,
it triggers result() but sends undefined data. This should happen
around line 170, and must be inside if(!config.mouseDownOnSelect)
if(!config.mouseDownOnSelect) {
hideresults();
if (selectionMade == 0) {
$input.trigger("result", [0, ""]);
}
}
5) Now, all you have to do is add a check in your application under
the result() function. If data[1] is whatever value you pass when
selectionMade == 0, you can execute code that does whatever you want
it to do. For my purposes, I want it to clear the hidden id field,
and clear the input field to indicate that nothing is selected.
There is one problem. For some reason, when I do $input.trigger
("result", [0, ""]);, typeof data == "undefined", not "0". This is
probably because I just don't understand how the data is passed, but
it would be nice if I could pass a concrete value, so that instead of
checking if data[1] is undefined, I could check if it is 0 or some
other integer or string.
Let me know if anyone has any improvements. This is my first foray
into modifying a jquery plugin, so it's almost guaranteed that I'm
doing something wrong.
Hope this helps!
On Feb 6, 10:57 am, Han <hgc...@gmail.com> wrote:
> Has anyone figured out a solution to this?
>
> I'm trying to modify the autocomplete plugin so that it triggers a
> different function (something like clearField() instead of result())
> when you click anywhere outside of the autocomplete search. You can
> then write some javascript to clear the hidden field and do whatever
> else you want it to do in your document.
>
> I basically want to constrain the user to select something that the
> autocomplete returns, and nothing else.
>
> On Jan 26, 7:37 pm, Aaron Jensen <aaronjen...@gmail.com> wrote:
>
> > Yeah, we've run into this same trouble as well. It would be nice if
> > there was a hook to handle this built intoAutocomplete.
>
> > On Mon, Jan 26, 2009 at 3:18 AM, Styx <pawel.chuchm...@gmail.com> wrote:
>
> > > It dosen't work.
> > > For example: I use tab key to navigate. If focus is set to input, id
> > > will be empty. If I don't want change my input, id also shouldn't be
> > > change.
> > > IAnother example: If my result work and set id properly, if I keypress
> > > shift or ctrl, id field will be cleared.
>
> > > On 24 Sty, 00:20, Jörn Zaefferer <joern.zaeffe...@googlemail.com>
> > > wrote:
> > >> You could add another keyup-event-handler to the input field, and
> > >> clear the id field. As long as that runs before the result-handler is
> > >> setting the data, it should give you the result you need.
>
> > >> Jörn
>
> > >> On Fri, Jan 23, 2009 at 5:09 PM, Styx <pawel.chuchm...@gmail.com> wrote:
>
> > >> > Hi.
>
> > >> > I have two fileds. For exmple:
>
> > >> > $("#name").autocomplete('seatch.php');
> > >> > $("#id").result(function(event, data, formatted) {
> > >> > if (data) {
> > >> > $("#id").val(data[1]);
> > >> > }
>
> > >> > If i select sometfing inautocompletefield, my id field will have id
> > >> > of this item. After submit I have two fields - one wieth name, and one
> > >> > with id. I can for example update dabase use id.
>
> > >> > But if I write inautocompletesomethig, which isn't in result, my
> > >> > function isn't triggered. If i edit existing data, after submit I have
> > >> > field "id" with some value, and filed "name" with new value. I don't
> > >> > know, that I shoul add my "name" to database, or do something else.
>
> > >> > What I should do to clear field "id" when "name" is write by me and
> > >> > dosen't exist in result of 'search.php'?
>
> > >> > regards,
> > >> > pch
