提前输入:在外部单击后选择丢失

时间:2018-07-02 14:42:21

标签: javascript jquery typeahead.js bootstrap-typeahead twitter-typeahead

我有一个带有Autosuggest的文本字段,当我第一次单击某个元素时,但是一旦文本字段失去焦点,所选的值就会丢失。直到我再次选择它,它才起作用。

我该如何解决这个问题?

我的代码:

var addresses = new Bloodhound({
    datumTokenizer: Bloodhound.tokenizers.whitespace,
    queryTokenizer: Bloodhound.tokenizers.whitespace,
    remote: {
        url: Routing.generate('symfony_route') + '?q=%QUERY',
        wildcard: '%QUERY'
    }
});

var addItem = '<div class="tt-suggestion tt-selectable tt-add-item" onclick="handleAddressModal($(this));"><i class="fa fa-plus"></i> Neue Adresse hinzufügen</div>';

$('.license_addresses .typeahead').typeahead(null, {
    name: 'addresses',
    source: addresses,
    display: 'company',
    minLength: 0,
    items: 999,
    val: producerValue,
    autoSelect: true,
    showHintOnFocus: true,
    templates: {
        suggestion: function (data) {
            if (data.name.length > 0) {
                return '<div>' + data.company + '<small>' + data.name + ', ' + data.street + ', ' + data.zipcode + ' ' + data.city + '</small></div>';
            } else {
                return '<div>' + data.company + '<small>' + data.street + ', ' + data.zipcode + ' ' + data.city + '</small></div>';
            }
        },
        pending: function (data) {
            return addItem + '<div style="padding: 4px;"><small><i>Suche läuft...</i></small></div>';
        },
        notFound: function (data) {
            return addItem + '<div style="padding: 4px;"><small><i>Keine passenden Einträge gefunden.</i></small></div>';
        },
        header: function (data) {
            return addItem;
        }
    }
});

$('.license_addresses .typeahead').bind('typeahead:select', function (ev, suggestion) {
    var target = $('#' + $(ev.target).attr('data-show-target'));
    console.log(target);
    showSelectedAddress(suggestion.id, target);
});

var promise = addresses.initialize();

promise
    .done(function () {
        console.log('ready to go!');
    })
    .fail(function () {
        console.log('err, something went wrong :(');
    });

谢谢!

0 个答案:

没有答案