jQuery tags input 使用

由于项目中想使用tagsinput添加数据,找了很多资源,最终在github上找到开源的项目:
http://bootstrap-tagsinput.github.io/bootstrap-tagsinput/examples/

项目中详细介绍了tagsinput的使用,下面只讲解下添加数据的使用。
1、对于只是添加一个text,就很简单。直接在javascript中使用

$('input').tagsinput('add', 'some tag');

2、如果是想添加对象,那么就稍微复杂一点:
首先在<input>标签中不能加 data-role=’tagsinput’属性。

然后在在javascript代码中:

var organization = new Bloodhound(
{
datumTokenizer: Bloodhound.tokenizers.obj.whitespace('text'),
queryTokenizer: Bloodhound.tokenizers.whitespace,
prefetch: 'Resources/xenon/assets/organization.json'//json文件可以是空的,应该只是为了能够保存
});
organization.initialize();//初始化
$('#field-organizationresult').tagsinput({
itemValue: 'id',
itemText: 'text',
typeaheadjs: {
name: 'organization',
displayKey: 'text',//tagsinput显示的列
source: organization.ttAdapter()
  }
}); 
$('#field-organizationresult').tagsinput('add', {'id':json.id,'text':json.name});//在tagsinput中添加一个对象
  • 1
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 1
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值