taginput ,complete使用笔记
页面用到自动完成功能及需要taginput控件去展示,查资料的过程中发现
有两个类似的jQuery类库,到现在我也没搞明白它们两个有啥关联,jquery.tagsinput.js和bootstrap-tagsinput.js,后者在github上有(https://github.com/bootstrap-tagsinput/bootstrap-tagsinput),官网地址:http://jquery-plugins.net/bootstrap-tags-input;
前者的用法
$(selector).tagsInput({
'autocomplete_url': url_to_autocomplete_api,//这个参数可以试url或者js方法
'autocomplete': { option: value, option: value},//这个参数只有当使用旧版的autocomplete类库才有用,对集成到JQuery.ui中的无效
'height':'100px',
'width':'300px',
'interactive':true,
'defaultText':'add a tag',
'onAddTag':callback_function,
'onRemoveTag':callback_function,
'onChange' : callback_function,
'removeWithBackspace' : true,
'minChars' : 0,
'maxChars' : 0 //if not provided there is no limit,
'placeholderColor' : '#666666'
});
这里有个坑 autocomplete补充的下拉,是个对象,select的option会有 value和label,当我们点击选中的时候会只会讲value 传递个taginput,因为taginput只能是字符串,没有对对象进行处理,所有只能修改源码,处理value是个对象的情况(需要处理的问题有两点,一是taginput的显示字段,另一个是我们需要取到的值,因为每次点击autocomplete的下拉框都会触发taginput的addTag方法,因此可以直接修改addtag方法)
taginput ,complete使用笔记的更多相关文章
- Code Complete阅读笔记(三)
2015-05-26 628 Code-Tuning Techniques ——Even though a particular technique generally represen ...
- Code Complete阅读笔记(二)
2015-03-06 328 Unusual Data Types ——You can carry this technique to extremes,putting all the ...
- Code Complete阅读笔记(一)
代码大全也读了好几个月了,一开始读中文版,到现在慢慢尝试着读原版,确实感受到了"每天进步一点点"的魅力.遗憾的是没有从一开始就做阅读记录,总有不能尽兴和思路不清之感.确实,就像项目 ...
- Udemy - Angular 2 - The Complete Guide 笔记
1. install > npm install -g angular-cli 2. create app > ng new first-app 3. build app > cd ...
- 【刷题笔记】LeetCode 222. Count Complete Tree Nodes
题意 给一棵 complete binary tree,数数看一共有多少个结点.做题链接 直观做法:递归 var countNodes = function(root) { if(root===nul ...
- Code Complete 笔记—— 第二章 用隐喻来更充分理解软件开发
在这章里面,提到的隐喻,类同于比喻(建模)的方法的去理解软件开发. 隐喻的优点在于其可预期的效果能被所有人所理解.不必要的沟通和误解也因此大为减低,学习与教授更为快速,实际上,隐喻是对概念进行内在化和 ...
- Code Complete 笔记—— 第一章
软件的构建的主要流程: 定义问题 ( Problem Definition) 需求分析 (Requirements Development) 规划构建 (construction planning) ...
- Modular Rails: The complete Guide to Modular Rails Applications 笔记
fix SamuraiCRM/engines/core/test/dummy/config/routes 修改如下 Rails.application.routes.draw do mount Sam ...
- gradle学习笔记
一直想着花时间学习下gradle,今天有空.入门一下.参考:极客学院gradle使用指南,官方文档:gradle-2.12/docs/userguide/installation.html,以及百度阅 ...
随机推荐
- React初识(按钮点击+输入绑定)
简单按钮点击事件: <!DOCTYPE html><html> <head> <meta charset="utf-8"> ...
- zoj 1788 Quad Trees
zoj 1788 先输入初始化MAP ,然后要根据MAP 建立一个四分树,自下而上建立,先建立完整的一棵树,然后根据四个相邻的格 值相同则进行合并,(这又是递归的伟大),逐次向上递归 四分树建立完后, ...
- 修改主机hostname
1 修改hostname配置文件 vi /etc/sysconfig/network中的HOSTNAME 2 修改完后,使用hostname命令验证,发现hostname还是原来的 退出shell重新 ...
- JAV07接口与继承之动手动脑问题解决
动手动脑:请自行编写代码测试以下特性:在子类中,若要调用父类中被覆盖的方法,可以使用super关键字. 1.源代码: package Work; class A{ public A(){ System ...
- autoloader
自动加载 $loader = new Zend_Application_Module_Autoloader(array( 'namespace' => 'Blog', 'base ...
- ARM+LINUX 项目学习总结
一.确定功能 二.系统移植 1. 根据具体板子修改u-boot (三星的开发板资料) 2. 根据具体板子和功能修改内核 (基本的驱动) 3. 移植busybox 三.驱动修改编写 四.应用编程 附1 ...
- Scala学习(二)
二.Scala基础 1.变量:三种修饰符 -> ①val 常亮②var 变量③lazy val 惰性变量求值 2.类型 3.代码块 Block {exp1;exp2} 或 { exp1 exp2 ...
- 制作简单的2D物理引擎(零)
最近发现了Github上的开源物理引擎项目Matter.js,对它很感兴趣,发现源码并不算长,算上注释大约1万行左右,值得剖析一番.Matter.js实现一个最小化的2D物理引擎,性能不错,故打算用C ...
- Galera集群server.cnf参数调整--前言
文档安排: 前言部分会简述下galera集群,正文中会针对我们线上的环境,在不断业务的情况下,进行参数调整的话,有些参数不能够进行配置,会以#***的形式写入配置文件中,文档也会进行进一步说明. 如果 ...
- Android笔记——在布局文件中插入另一个布局文件
假如有一个布局文件A.xml想把另外一个布局文件B.xml引进其布局,则可以通过下面的代码 <include layout="@layout/B" />