Очистить текстовое поле после выбора jquery typeahead.js

Благодаря замечательным предложениям, указанным в SO, я смог взломать тип, который будет обновлять таблицу при выборе. Последний шаг, который мне нужно сделать, - очистить текстовое поле во время/после выбора. Я попробовал добавить вещи в таблицу onchange event, перехватить событие select и т. Д. Ничего не работает. Единственная другая ссылка, которую я могу найти здесь для этого, не имеет ответа. Есть ответы на автозаполнение, но я не могу их адаптировать. Любая помощь будет принята с благодарностью.Очистить текстовое поле после выбора jquery typeahead.js

$(document).ready(function() { 

    var ds = [ 
      @if (ViewData.ModelState.IsValid) 
      { 
       var index = 0; 
       foreach (var person in Model) 
       { 
        var jaUser = "{ name: \" " + person.UserName + "\", mobi: \"" + person.MobilePhone + "\" }"; 
        if (index > 0) { jaUser = ',' + jaUser; } 

            @Html.Raw(jaUser)          
        index++; 
       } 
      } 
    ]; 

    var d = new Bloodhound({ 
     datumTokenizer: Bloodhound.tokenizers.obj.whitespace('name'), 
     queryTokenizer: Bloodhound.tokenizers.whitespace, 
     local: ds 
    }); 
    d.initialize(); 

    $('#contactSearch').typeahead(
{ 
    hint: true, 
    highlight: true, 
    minLength: 1, 
}, 
{ 
    name: 'd', 
    displayKey: 'name', 
    source: d.ttAdapter(), 
    templates: { 
     empty: 'not found', //optional 
     suggestion: function (el) { 
      return "<span onclick=\"addUser2list('" + el.name + "');\"><img src='" + el.mobi + "' />" + el.name + "</span>" 
     } 
    } 
} 
); 


}); 


function addUser2list(mobnum){ 
    if (mobnum.length > 0){ 
     row = $("<tr></tr>"); 
     col1 = $("<td>col1</td>"); 
     col2 = $("<td>"+ mobnum +"</td>"); 
     col3 = $("<td>col3</td>"); 
     row.append(col1, col2, col3).prependTo("#mytable"); 
     //$('#contactSearch').val(''); 
    } 
}

пример - вы типа «Да» в текстовом поле, 3 имена появляются в выпадающем списке, вы выбираете 1 и предваряется таблице выше. Как только это произойдет, мне нужно, чтобы текстовое поле было ясным, в настоящее время оно отображает имя, которое вы выбрали, и вы должны вручную удалить его. По какой-то неизвестной причине jsfiddle не обновляет таблицу, но в моем локальном коде она отлично работает, мне просто нужно знать, как автоматически очистить поле «contactSearch».

источник

2015-04-23 Darkloki

пожалуйста, вы можете создать демо на http://jsfiddle.net? – Dhiraj

действительно пробовал, и он не работает на jsfiddle. Я клянусь, что это работает в моем приложении :-(http://jsfiddle.net/0xs63enb/ – Darkloki

На самом деле вопрос не очень ясен (возможно, для меня), но можете ли вы добавить пример на вопрос? – Dhiraj

Вы можете использовать typeahead:selected для захвата выбора события события из раскрывающегося списка. There are more events that can be used.

машинописный: выбранный - Срабатывает при выборе внушение из выпадающего меню. Обработчик события будет вызван тремя аргументами: объектом события jQuery, объектом предложения и именем набора данных, к которому относится предложение.

on('typeahead:selected', function(obj, datum){ //datum will be the object that is selected 
    myTypeahead.typeahead('val',''); 
    addUser2list(datum); 
});

$('.typeahead').typeahead('val',''); опустеет значение текстового поля.

Вот DEMO

Надеется, что это помогает.

источник

2015-04-23 23:48:59 Dhiraj

Я уверен, что могу заставить его работать на основе вашей демонстрации. Thanx так много! – Darkloki

Я рад, что помог – Dhiraj

Именно то, что мне было нужно. –

добавить обновления

updater: function (item) { 
        comp = map[item]; 
        if (typeof comp != 'undefined') { 
         _cid = map[item].myid;        
         return ''; // here return blank 
        } 
       },

источник

2017-03-28 20:37:17

Очистить текстовое поле после выбора jquery typeahead.js

ответ

Смежные вопросы