Search code examples
ajaxautocompleteprototypejsscriptaculous

scriptaculous ajax autocomplete empty response


I’m working with the ajax-autocompleter which works great. My aim is to redirect between an editing function for an existing item, or a creating function for a not-found item.

I insert a specific id to each li, and I can therefore use it for the editing function with an afterUpdateElement option.

But if no results are found, the list is empty, and I can’t find any way to tell the afterUpdateElement script that no results were found. Indeed, no afterUpdateElement is called, since there is no selection. So afterUpdateElement is useless…

I was thinking about testing the full value sent by the ajax request. But I didn’t find how to grab it…


Solution

  • So, I finally found a way to check if results were selected or not (with the huge help of Gwyohm) :

    1. First of all, we set up an hidden field which will record if a result was selected (true/false). By default, it is set to FALSE.
    2. The afterUpdateElement is only used after a selection. So we use this aferUpdateElement to turn our hidden field to TRUE.
    3. If the user changes the search field value, for a brand new value not selected, no afterUpdateElement is used, and our hidden value is still set to TRUE. The solution to that problem is to listen to a key pressed. If a key is pressed, then the hidden field turns back to FALSE. This works for all keys, even the Enter key actually used to make a selection. So this is an exception we should remove from our keypress listener. So, finally let's have a look to our extra function :

      $(id-of-text-field).observe("keyup", function(e) {

      if (window.event) keycode = window.event.keyCode;
      else if (e) keycode = e.which;
      if (keycode!=13) {

      $(id-of-hidden-field).value="FALSE";

      }

      }.bindAsEventListener($(id-of-text-field)));

    We can then use the hidden field to know if the text value should be edited or created...

    Beware : with this solution, if the user types a value matching an existing value, without selecting it, it will be considered as a new value, and will lead to a duplicate entry if you add this value to your database. (but this was ok for me, as I was working with names, and two different people may have the same name...)