标签: jquery-tags-input

Tagsinput不是一个函数,使用bootstrap 3和tags-input插件

我正在使用带有jquery 1.10的bootstrap 3而且我想使用tags-input插件(http://timschlechter.github.io/bootstrap-tagsinput/examples/bootstrap3/),但它不起作用.这是我的错误:

TypeError: tagsinput[arg1] is not a function
var retVal = tagsinput[arg1](arg2);

Run Code Online (Sandbox Code Playgroud)

这是我的HTML代码:

    <head>

<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=AIzaSyAv92iA1TcfCnk4-bDg7BAJoKOCnh1g7oQ&sensor=false"></script>

<link href="/qtip2/css/jquery.qtip.min.css" media="screen" rel="stylesheet" type="text/css" >
<link href="/css/bootstrap.min.css" media="screen" rel="stylesheet" type="text/css" >
<link href="/css/1309_ciceroos_b2b.css" media="screen" rel="stylesheet" type="text/css" >
<link href="/css/1310_longdistance.css" media="screen" rel="stylesheet" type="text/css" >
<link href="/bootstrap3.0.0/assets/css/bootstrap-tagsinput.css" media="screen" rel="stylesheet" type="text/css" ><script type="text/javascript" src="/bootstrap3.0.0/assets/js/jquery.js"></script>
<script type="text/javascript" src="/js/infobox.js"></script>
<script type="text/javascript" src="/qtip2/js/jquery.qtip.min.js"></script>
<script type="text/javascript" src="/qtip2/js/imagesloaded.min.js"></script>
<script type="text/javascript" src="/bootstrap3.0.0/dist/js/bootstrap.min.js"></script>
<script type="text/javascript" src="/bootstrap3.0.0/assets/js/holder.js"></script>
<script type="text/javascript" src="/bootstrap3.0.0/assets/js/bootstrap-tagsinput.js"></script>
<script type="text/javascript">
                    jQuery(document).ready(function ($) {
                        //$('.bootstrap-tagsinput input').attr("value", "interessi");   
                        $('#idInputWhat').tagsinput('add', 'mare'); …

Run Code Online (Sandbox Code Playgroud)

jquery twitter-bootstrap jquery-tags-input twitter-bootstrap-3

Dan*_*any

2014 08-04

7
推荐指数

1
解决办法

2万
查看次数

bootstrap-tagsinput with typeahead,bootstrap-3

在我的一个项目中,我曾经在bootstrap-2.3.2中使用bootstrap-tags输入http://timschlechter.github.io/bootstrap-tagsinput.最近我更新了两个(bootstrap为3,tagsinput为0.3.9).在更新期间,我发现外部的tagsinput取决于http://twitter.github.io/typeahead.js/.

我尝试根据文档使用bs-tagsinput和typeahead.那有点颠簸.例如,bootstrap-tagsinput docs下的typeahead代码示例:

$('input').tagsinput('input').typeahead({
  prefetch: 'citynames.json'
}).bind('typeahead:selected', $.proxy(function (obj, datum) {  
  this.tagsinput('add', datum.value);
  this.tagsinput('input').typeahead('setQuery', '');
}, $('input')));
</script>

Run Code Online (Sandbox Code Playgroud)

typeahead ['setQuery']不再存在于typeahead ver 1.0中(它在ver 0.9中).我对数据集使用typeahead.source方法.来自'source'的typeahead没有在0.9中实现,因此降级似乎不是一个选项.我不确定是否用typeahead ['val']替换它(尽管两者都没有解决我看到的问题).至于CSS,我从bootstrap-tagsinput docs页面复制了它 - 不确定这是意图(我是新手,所以我不知道更好).

问题是,把所有东西放在一起后,我遇到了错误的行为(如预期的那样).具体来说,我遇到一个问题,插入标签后(输入一个单词并按下输入):( 1)tt-dropdown-menu应该消失,但事实并非如此.它与之前的tt-suggestions列表一起保持不变,并且(2)tt-hint字段应该被清除但不是

如果我使用箭头选择其中一个tt-advice,就不会发生这个问题

有谁知道什么是获取tagsinput-w/typeahead功能的最佳方法？

typeahead bootstrap-typeahead jquery-tags-input twitter-bootstrap-3 twitter-typeahead

tiv*_*oni

2014 02-08

5
推荐指数

2
解决办法

1万
查看次数

jquery tagsinput和ui autocomplete:它们可以与预加载的源一起使用吗？

我有点麻烦.有taginput的工作代码,我知道如何使用jquery ui的自动完成功能.

代码示例

也不

autocomplete' :{
    'source': tags_array
}

Run Code Online (Sandbox Code Playgroud)

也不

$("#new_tags_tagsinput").autocomplete({source: tags_array});

Run Code Online (Sandbox Code Playgroud)

似乎工作.

在tagsinput站点上有一个例子,它需要自动完成URL,但我想使用加载的数组,就像在自动完成示例上一样.我尝试了不同的选择,没有人工作.有这样的方式吗？

jquery jquery-ui autocomplete jquery-ui-autocomplete jquery-tags-input

Ban*_*dan

lucky-day

5
推荐指数

1
解决办法

4304
查看次数

jQuery标签 - 使用Rails4/Simple_form输入

我正在使用带有Simple_form和acts_as_taggable的 Rails 4.

我正在尝试为我的标签(atcs_as_taggable)实现jQuery标签输入.

Tags_input的HTML 是:

   <input name="tagsinput" class="tagsinput" value="School,Teacher,Colleague" />

Run Code Online (Sandbox Code Playgroud)

在Simple_form中进行翻译:

   <%= f.input :tag_list, input_html: { class: "tagsinput "} %>

Run Code Online (Sandbox Code Playgroud)

我在更改前输入的标签在编辑/表单中正确显示,但NEW标签未保存.

我的Tags_input的JS很简单:

   $(".tagsinput").tagsInput({
    width: '300px'
   });

Run Code Online (Sandbox Code Playgroud)

我错过了什么？

jquery ruby-on-rails simple-form ruby-on-rails-4 jquery-tags-input

Min*_*ohn

2013 09-25

4
推荐指数

1
解决办法

3709
查看次数

如何将<li>元素拖放到输入字段中

我正在尝试开发一个具有以下功能的页面：

Page将有两列：一列是#origin（左列），其中包含矩形列表（代表变量），第二列是#drop（右列），其中包含可放置矩形的输入。

在此处输入图片说明

为了得到我想要的结果，我想到了使用两个插件：jQuery ui draggable和jQuery Tokeninput

问题是，一旦将矩形（<li>）放到输入字段中后，如何使它显示为标记。也可以使用相同的<li>元素，因此我可以在输入中输入更多文本（以完成一个公式），如果以后用户改变主意并确定变量（标记）不是他所使用的那个，还是她想要的，页面应允许他们删除标签（通过单击右上角的“ X”或将标签返回到其左列的原始位置）

有人已经做过类似的事情并且可以给我一些指导吗？还是有人对此有其他想法？

任何帮助是极大的赞赏。

PS：如果您知道其他任何可以在同一输入中组合文本和标签的标签插件，请告诉我。

jquery drag-and-drop jquery-draggable jquery-tags-input

edd*_*ddy

2013 08-25

3
推荐指数

1
解决办法

8859
查看次数

Jquery tagsinput不会在粘贴输入时自动创建标记

我正在使用jquery.tagsinput,并希望能够粘贴以逗号或空格分隔的电子邮件地址列表.使用类似这样的东西https://github.com/xoxco/jQuery-Tags-Input/issues/22但它不会添加它们直到我按Enter键 - 尝试触发按键输入事件但它不起作用.模糊事件也没有运气(如下所示).有任何想法吗？

Flat-UI标签基于这个库,我试图实现一个非常相似的行为.

var tidyTags = function(e) {
  var tags = (e.tags).split(/[ ,]+/);
  var target = $(e.target);

  for (var i = 0, z = tags.length; i<z; i++) {
      var tag = $.trim(tags[i]);
      if (!target.tagExist(tag)) {
          target.addTag(tag);
      }
  }
  $('#' + target[0].id + '_tag').trigger('focus');

  //This doesn't work.
  target.blur();

};

$("#tagsinput").tagsInput({
    onAddTag : function(tag){
      if(tag.indexOf(',') > 0) {
          tidyTags({target: '#tagsinput', tags : tag});
      }
    },
});

Run Code Online (Sandbox Code Playgroud)

tags jquery paste eventtrigger jquery-tags-input

use*_*031

2015 06-02

2
推荐指数

1
解决办法

3352
查看次数