Tag: typeahead.js

Typeahead更改源

我正在尝试更改typeahead的来源,但是我找到的所有答案都不适用于我(可能是因为更新的bootstrap版本)。 我根据用户搜索的内容进行了后端搜索。 这是我的代码: $(‘.typeahead’).typeahead({ hint: true, highlight: true, minLength: 1, limit: 2, }, { name: ‘organizations’, source: substringMatcher(getOrganizationData()) }).on(“input”, function(e) { organizationQuery = e.target.value; // Here I want to update the source // Not working: //$(“.typeahead”).data(‘typeahead’).source = substringMatcher(getOrganizationData()) // Not working: //$(‘.typeahead’).data(‘ttTypeahead’).dropdown.datasets[0].source = substringMatcher(getOrganizationData()) // Not working: // var autocomplete = $(‘input’).typeahead(); // autocomplete.data(‘typeahead’).source = […]

Twitter TypeAhead.js没有更新输入

我在我的bootstrap 3项目中使用Twitter的TypeAhead.js库。 这看起来很棒,但是我的输入字段很麻烦。 一旦我开始填写,就会触发预先输入并相应地显示建议框。 但是,在选择任何条目后,输入字段根本不会被填充。 有谁可以帮助我吗? 这是我现在正在使用的代码: HTML: Javascript代码 – 激活字段: $(‘.typeahead’).typeahead({ name: ‘parceiro’, remote: ‘../api/index.php/parceiro/busca/%QUERY’, template: [ ‘{{RAZAO_SOCIAL}}’, ‘{{DESCRICAO_TIPOPARCEIRO}}’, ‘{{CNPJ}}’ ].join(”), engine: Hogan }); 最后,从服务器返回的JSON: [{ “ID”:”17″, “TIPOPARCEIRO”:”C”, “DESCRICAO_TIPOPARCEIRO”:”CLIENTE”, “RAZAO_SOCIAL”:”VINICIUS SOARES BATISTA”, “CNPJ”:”12344123213123″ }] 提前致谢! [编辑] 感谢@ bass-jobsen,我已经能够部署它了。 正如他所说,秘密在于TypeAhead提供的filter()函数。 贝娄是这种function的书面代码。 … $(‘#txtCliente’).typeahead({ header: ‘Clientes’, template: [ ‘{{RAZAO_SOCIAL}}{{CNPJ}}’, ].join(”), limit: 3, remote: { url: ‘../api/index.php/parceiro/busca/%QUERY’, […]

Django项目中的typeahead.js

https://twitter.github.io/typeahead.js/examples/上有一些例子我需要在我的django app中做类似的搜索主题标签。 但我尝试过它并不起作用。 有一个类似的问题,并在stackoverflow上得到了一个,但我不明白如何做到这一点。 在Django项目中使用typeahead.js views.py class SearchTag(View): “”” Search tags with autocomplete (live search) “”” def get(self, request): form = SearchTagForm() context = {‘searchtag’ : form} return render(request, ‘search_tags.html’, context) def post(self,request): q = request.POST[‘q’] form = SearchTagForm() tags = HashTag.objects.filter(name__icontains=q) context = {‘tags’ : tags, ‘searchtag’ : form} return render(request, ‘search_tags.html’, context) class […]

Typeahead.js确实给了我建议,但没有选择它们

我正在使用Bootstrap 3.0和最新版本的Typeahead.js和Hogan引擎。 我设法让远程加载建议工作(最后)。 现在下一个障碍是当用户点击建议时,如何在输入中填写单词? 我认为这可能是自动完成的,但不是出于某种原因? 这只是JS的一个基本路线我错过了吗? 输入: 这是JS: $(document).ready(function() { $(‘.playername-search’).typeahead({ name: “playername-search”, remote: ‘http://xxxx/%QUERY’, template: ‘{{short_name}} – {{rating}}’, engine: Hogan }); }); 有一件事我不得不提,一切都在一个模态中。 也许这会改变这种情况? 提前致谢!

typeahead.js ajax远程数据源仅适用于同步ajax请求

Typeahead.js仅在同步提交请求时才使用自定义ajax远程数据源,而不是异步提交。 异步提交时(async:true),我的脚本和自定义TABoards()函数在cb()函数传播结果列表之前完成。 我的代码完美无瑕地运行并产生两个数据源的结果:一个远程ajax数据源和一个“静态”数据源,它总是生成一个“查看[查询]的所有结果”结果。 但是,生成的代码还会在浏览器javascript控制台中生成以下通知:“主线程上的同步XMLHttpRequest因其对最终用户体验的不利影响而被弃用。” 添加“.done(function(){cb(response)});” 不工作。 除了不生成浏览器通知外,如何重写此代码才能完全相同? var TABoards = function(q, cb){ $.ajax({ dataType: “json”, async: false, url: ‘/typeahead.php?q=’+q+’&type=boards’, success: function(response){ cb(response); } }); } $(‘#hdrSrchQ’).typeahead({ highlight: true, hint: false, minLength: 3 }, { name: ‘ta-boards’, displayKey: ‘title’, source: TABoards, templates: { header: ‘Boards’, suggestion: function(data){ return ” + data.title + ‘ – ‘ + […]

在Django项目中使用typeahead.js

我有一个带电影数据库的django项目,希望我的搜索框能够简单地实现typeahead.js给我的自动完成function。 我正在使用它,因为它具有模板function,因为它非常适合我正在使用的Bootstrap样式。 urls.py url(r’^get_movie/$’, views.get_movie, name = ‘get_movie’) views.py def get_movie(request): results = [] q = request.GET[‘q’] movies = Movie.objects.filter(title__icontains = q) results = [ {movie.id: movie.name} for movie in movies ] data = json.dumps(results) return HttpResponse(data, content_type = ‘application/json’) HTML搜索框 显然我包含了jQuery,Bootstrap和typeahead.js。 除了实现typeahead.js的javascript之外,上面是所有必需的代码 这是来自官方网站的一个例子,但我不知道我需要应用哪些修改才能从我的数据库中动态获取结果并在自动完成列表中显示它们: $(‘.typeahead’).typeahead(null, { name: ‘best-pictures’, display: ‘value’, source: bestPictures, templates: { empty: […]

JavaScript Typeahead自动完成匹配重音和波浪号问题

我正在使用Typeahead jQuery库,但是当用户键入类似e人声时,它也应该匹配外国人声,例如é , ë , è 。 将n与ñ匹配。 这是我的代码: var charMap = { “à”: “a”, “á”: “a”, “ä”: “a”, “è”: “e”, “é”: “e”, “ë”: “e”, “ì”: “i”, “í”: “i”, “ï”: “i”, “ò”: “o”, “ó”: “o”, “ö”: “o”, “ù”: “u”, “ú”: “u”, “ü”: “u”, “ñ”: “n”}; var normalize = function (input) { $.each(charMap, function (unnormalizedChar, normalizedChar) […]

选择jquery typeahead.js后清除文本框

感谢SO上列出的精彩建议,我能够预先确定一个类型,以便在选中时更新表格。 我需要做的最后一步是清除选择期间/期间/之后的文本框。 我已经尝试在onchange事件中添加内容,拦截select事件等。似乎没有任何工作。 我在这里找到的唯一其他参考资料没有答案。 有自动完成的响应,但我似乎无法适应它们。 任何帮助将不胜感激。 $(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; } […]

typeahead.js没有返回所有结果

我很难找到typeahead.js来返回/渲染我页面上的所有结果。 这是我的代码: var places = new Bloodhound({ datumTokenizer: Bloodhound.tokenizers.whitespace, queryTokenizer: Bloodhound.tokenizers.whitespace, remote: { url: ‘/api/place/?country={{ country.id }}&name=%QUERY’ , transform: function (data) { return data.response; } , wildcard: ‘%QUERY’ } }); var selected = false; $(‘.typeahead-place’).typeahead({ hint: true, highlight: true, minLength: 2 }, { name: ‘places’, displayKey: function (obj) { if (obj.url != null && obj.url.length […]

需要Bootstrap Typeahead本地,预取或远程

我试图让这个 twitters typeahead的例子运行,但我在chromes控制台中收到错误: 未捕获错误:需要本地,预取或远程之一jquery-1.9.1.js:507 我正在使用typeayhead 0.9.1(Nuget-Package)。 这是版本问题吗? 所有示例都在请求中设置源而不是local / prefetch / remote。 编辑:原来,Twitter Bootstrap Typeahead和Twitter Typeahead是两个不同的库。