[jira] [Created] (TAP5-2402) autocomplete typeahead suggestions appear/disappear with keystrokes

["George Christman (JIRA)" <ji...@apache.org>]

George Christman created TAP5-2402:
--------------------------------------

             Summary: autocomplete typeahead suggestions appear/disappear with keystrokes
                 Key: TAP5-2402
                 URL: https://issues.apache.org/jira/browse/TAP5-2402
             Project: Tapestry 5
          Issue Type: Bug
          Components: tapestry-core
    Affects Versions: 5.4
            Reporter: George Christman


The tapestry autocomplete mixin uses typeahead.js 0.9.3 which seems to have a bug where the suggestions appear/disappear which each key stroke. This seems to have been resolved in the latest version of typeahead.js 0.10.5. I have successfully implemented it locally and resolved the issue. I'm recommending we upgrade the typeahead.js and it's connector to the latest version. 

https://twitter.github.io/typeahead.js/
https://twitter.github.io/typeahead.js/releases/latest/typeahead.bundle.js

Below is a working connector. 

define(["t5/core/dom", "t5/core/ajax", "./jquery", "t5/core/utils", "./vendor/handlebars-v2.0.0", "./vendor/typeahead.bundle"], function(dom, ajax, $, _arg) {
    var exports, extendURL, init;

    extendURL = _arg.extendURL;
    init = function(spec) {
        var $field;

        $field = $(document.getElementById(spec.id));

        var suggestions = new Bloodhound({
            datumTokenizer: Bloodhound.tokenizers.obj.whitespace('value'),
            queryTokenizer: Bloodhound.tokenizers.whitespace,
            limit: 5,
            dupDetector: function(remoteMatch, localMatch) {
                return remoteMatch.value === localMatch.value;
            },
            remote: {
                url: spec.url,
                replace: function(uri, query) {
                    console.log(query);
                    return extendURL(uri, {
                        "t:input": query
                    });
                },
                filter: function(response) {                   
                    return response.matches;
                }
            }
        });
        suggestions.initialize();

        return $field.typeahead(
                {
//we may want to somehow make these options available through a json configuration.
                    hint: false,
                    highlight: true,
                    minLength: spec.minChars,
                }, {
            displayKey: 'value',
            hint: true,
            highlight: true,
            minLength: spec.minChars,
            source: suggestions.ttAdapter()
        });
    };
    return exports = init;
});



--
This message was sent by Atlassian JIRA
(v6.3.4#6332)