alexgorbatchev/jquery-textext

autocomplete / suggestions - typing something completely different than available tags will empty dropdown on arrow click

Opened this issue · 1 comments

As the titel suggests I have an issue with the dropdown menu of jquery textext autocomplete. Plugins used: tags autocomplete arrow

Right now my application is set up with 4 available tags on initialisation. Typing any letter that any tag contains results in autocompleting the right suggestions. Clicking on the arrow shows all 4 tags. But when I type for example the letter 'q' (which is not present in any tag), press backspace key and then click the arrow it doesn't show anything.

This behaviour is even showing on the jQuery TextExt site itself. Main page: http://textextjs.com/

Any help on how I could fix this would be great.

Hello

I've also encountered this. it seems to be because, on enter, the tags plugin clears the input field regardless of whether a tag was recognised.

I put together a workaround below. Not perfect but it seems to be working

My workaround was to add the following to the textext settings:

ext: {
      tags: {
        onGetFormData : function(e, data, keyCode)
        {
            var self       = this,
                // Return as normal here
                inputValue = self.val(),
                formValue  = self._formData
                ;

            data[200] = self.formDataObject(inputValue, formValue);
        },

        addTags: function(tags)
        {
            if(!tags || tags.length == 0)
                return;

            var self      = this,
                core      = self.core(),
                container = self.containerElement(),
                i, tag
                ;

            for(i = 0; i < tags.length; i++)
            {
                tag = tags[i];

                if(tag && self.isTagAllowed(tag))
                            {
                    container.append(self.renderTag(tag));
                                    // Clear if a tag was added
                                    self.val('');
                            }
            }

            self.updateFormCache();
            core.getFormData();
            core.invalidateBounds();
        }
      }
    }