Tag: typeahead

如何在typeahead表单中添加csrf_token()?

我不是一个经验丰富的开发人员,所以我无法弄清楚如何在我的表单中使用ajax。 我正在尝试使用bootstrap typeahead。 但我的csrf_tokenfilter导致“500”错误。 我在哪里可以在我的ajax脚本中发送csrf_token? $(‘.typeahead’).typeahead({ source : function(typeahead, query){ $.ajax({ url : ‘typequery’, type : ‘POST’, data : { query : query, column : ‘title’ }, dataType : ‘json’, async : true, success : function(data) { return process(data.titles); } }); } }); 这是我需要填写的表格。 如果我评论我的postfilter,它会工作。 {{ Form::open(array(‘url’ => ‘searchblogs’ ,’id’ => “search”, ‘class’ => “input-append”)) […]

Bootstrap标签预先输入不使用jQuery ajax填充菜单

我使用bootstrap标签( https://github.com/bootstrap-tagsinput/bootstrap-tagsinput )来填充一些标签。 我正在使用jQuery 3和Bootstrap 3.下面是代码片段。 它从服务器获取数据但不处理。 你能告诉我怎么解决这个问题吗? 我已经包含了https://github.com/twitter/typeahead.js和https://github.com/bootstrap-tagsinput/bootstrap-tagsinput和相应的CSS function attachOrgRoleTypeAhead(){ console.log(‘attachOrgRoleTypeAhead called’); $(‘.roletag’).tagsinput({ tagClass:’form-control input-sm’, //itemValue: ‘rolename’, //itemText: ‘rolename’, //display: ‘rolename’, allowDuplicates: false, freeInput: false, typeaheadjs: { displayKey: ‘text’, afterSelect: function(val) { this.$element.val(“”); }, source: function (query, process,asynchProcess){ var typeaheadData = {}; var rolesdata = {}; var $items = new Array; rolesdata.orgid= $(‘#orgidselector’).find(“option:selected”).val(); rolesdata.query=query; […]

twitter打字后自动完成asp.net mvc jquery ajax的搜索操作

我使用Twitter typeahead(使用Bloodhound引擎)实现了自动完成function,并且运行正常。 我的下一步是使用生成/获得的数据(在我的情况下’name’和’id’)进行搜索操作。 这就是我遇到困难的地方。关于如何将数据传递给控制器​​以进行搜索操作,我完全空白。 我没有使用表单,但我想使用搜索按钮单击或js函数OnclickSearchButton或可能有更好的方法?! 我的JS代码: $(document).ready(function () { var viewModel = {}; //will store id and string to pass for the search operation //var urlRoot = ‘/Test/GetName’; //we get url to the controller and min. char to invoke search from the html helper JavaScriptParameter var urlRoot = urlToController; //var lengthMin = 1; var lengthMin […]

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 = […]

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 }); }); 有一件事我不得不提,一切都在一个模态中。 也许这会改变这种情况? 提前致谢!

AngularJS预先搜索结果为div

我正在使用bootstrap的typeahead用于文本输入,该按钮还有一个弹出流行结果popout的按钮。 我想要typeahead的function,只是结果列表将显示在不同的div中(在popover内而不是在文本输入下)。 有没有办法为typeahead搜索结果设置’容器’? (例如,popover小部件包含’容器’选项) 像这样的东西: Text Field Button popover ________________________________________________________ | Search… | B | Typeahead1 Popular Searches: | |————–|—| Typeahead2 Src1 | | Typeahead3 Src2 | | …. … | |___________________________________| (本来可以更快地在Photoshop中画画,但是……) 有什么好的解决方案吗? 我想了几个方法:修改/扩展typeahead插件或使用隐藏文本输入。 我可以选择jquery的自动完成function。 还有其他(更好的)建议吗? 注意:我正在使用jquery + angularjs + bootstrap

Bootstrap typeahead:选中后在框中显示不同的文本

我使用bootstrap typeahead搜索如下: $(‘.lookup’).typeahead({ source: function (query, process) { return $.getJSON( ‘json_autocomplete.php’,{ query: query }, function (data) { var newData = []; $.each(data, function(){ newData.push(this.label); //populate hidden field with id $(‘#contact_id’).val(this.id); }); return process(newData); }); } }); JSON数据如下所示: [{“label”:”Contact: Jeff Busch-> Busch, Jeff: 1975-11-24″,”value”:”Busch, Jeff”,”id”:”2096″}, … 它工作得很好。 当用户开始键入“标签”时,数据显示在输入下的列表中。 但是,一旦用户点击其中一个列表项,我希望“值”文本出现在输入文本框中,而不是所有搜索到的标签信息! 这可能吗? 这是一个小提琴: http://jsfiddle.net/michels287/qdgo651h/

扩展bootstrap typeahead的宽度以匹配输入字段

我知道这个问题至少被问过三次,但我看到的答案并不是我想要的。 我希望增加twitter bootstrap使用其typeahead函数生成的自动完成字段的宽度。 我一直在阅读,它延伸到覆盖现场的所有文本。 也就是说文本越长,自动完成字段越宽。 但是我希望它是span6,因为这是我的搜索字段的宽度。 有任何想法吗? 我看到了一些jquery的答案,但我无法遵循它们。

Twitter Bootstrap 3 Typeahead / Tagsinput完成两次

编辑:添加工作JSFiddle 我正在使用Twitter Bootstrap TagsInput和Bootstrap Typeahead。 我的源代码是一个json文件,但这是无关紧要的,我已经用静态源检查了。 typeahead和tagsinput正在工作,但是当我按下enter,tab或单击标签时,它会创建一个完整的副本。 每当我按Enter键或完成预先输入时,都会发生这种极端’默认’。 如果我通过用逗号分隔或者将焦点从窗口移开来打破先行,则不会发生。 这是输入: 以下是脚本: $(‘.tagsInput’).tagsinput({ confirmKeys: [13, 44], maxTags: 1, typeahead: { source: function(query) { return $.get(‘listcategories.php’); } } }); 我确信这是不可重复的东西,运气不好,所以我希望有人会有一些他们知道可能会导致类似事情发生的机构知识。 这是dev中额外文本的图像。 工具: 我真的很感激任何建议或意见。 谢谢。 工作代码 感谢@Girish,以下是“解决”这个问题的原因。 我认为这是一个时间错误,在更新版本的jQuery或Typeahead中引入。 这段代码只是手动删除了额外的元素,虽然希望有一些东西可以防止它被放在那里,从而消除了额外的代码。 现在它对我有用。 $(‘.tagsInput’).tagsinput({ confirmKeys: [13, 44], maxTags: 1, typeahead: { source: function(query) { return $.get(‘tags.php’); } } }); $(‘.tagsInput’).on(‘itemAdded’, function(event) […]

为Bootstrap的typeahead获取所选项目值

Bootstrap刚刚实现了一个名为typeahead的简洁自动完成function。 我无法获得文本输入的适当值。 例如,我可能有以下内容: $(‘input’).on(‘change’, function(){ console.log($(this).val()); }); 这似乎不会捕获所选值。 有没有人知道如何使用带引导程序的typeahead获取所选值?