BootStrap 智能表单实战系列(十)自动完成组件的支持


Posted in Javascript onJune 13, 2016

web开发中,肯定遇到像百度、google这种搜索的功能吧,那智能表单中的自动完成可以做什么呢,下面来揭晓:

1、包含像google、百度等类似的简单搜索

2、复杂结构的支持,比如说 输入产品编号,需要将产品的编号、产品的名称、产品的单价、产品的备注信息等填写会表单中的某个位置

代码如下(页面地址:https://github.com/xiexingen/Bootstrap-SmartForm/blob/master/demo/form3-ele-autocomplete.html):

自动完成

note:需要引入js文件:jquery-ui.js、jquery.fn.extend.js

在表单生成完成后,通过指定元素调用SmartSearch方法

参数说明:

url:请求的url

beforeSearch:可选,在发送请求之前调用的方法,改方法有一个参数data包含要发送的数据,如果需要添加或者修改要发送的参数,修改次参数即可

formatItem:可选,如果返回的不是简单的数组字符串,则必自定义操作,用于格式化界面显示的内容,例中显示的是产品编号 + 产品名称

callback:可选,如果返回的不是简单的数组字符串,则必自定义操作,用于赋值
note:如果接口返回的是简单的字符串数组,则 formatItem和callback皆可省略

这是我本地测试项目中运行的截图:

BootStrap 智能表单实战系列(十)自动完成组件的支持

以上所述是小编给大家介绍的BootStrap 智能表单实战系列(十)自动完成组件的支持的全部叙述,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
改进:论坛UBB代码自动插入方式
Dec 22 Javascript
jQuery 插件 将this下的div轮番显示
Apr 09 Javascript
javascript instanceof 与typeof使用说明
Jan 11 Javascript
jQuery实现仿Alipay支付宝首页全屏焦点图切换特效
May 04 Javascript
jQuery选择器及jquery案例详解(必看)
May 20 Javascript
JS使用正则表达式实现关键字替换加粗功能示例
Aug 03 Javascript
JavaScript第一篇之实现按钮全选、功能
Aug 21 Javascript
three.js实现围绕某物体旋转
Jan 25 Javascript
bootstrap table 多选框分页保留示例代码
Mar 08 Javascript
JavaScript实现AOP详解(面向切面编程,装饰者模式)
Dec 19 Javascript
Node错误处理笔记之挖坑系列教程
Jun 05 Javascript
用webAPI实现图片放大镜效果
Nov 23 Javascript
BootStrap智能表单实战系列(九)表单图片上传的支持
Jun 13 #Javascript
浅谈JavaScript对象的创建方式
Jun 13 #Javascript
BootStrap智能表单实战系列(八)表单配置json详解
Jun 13 #Javascript
BootStrap智能表单实战系列(七)验证的支持
Jun 13 #Javascript
BootStrap智能表单实战系列(六)表单编辑页面的数据绑定
Jun 13 #Javascript
js 截取或者替换字符串中的数字实现方法
Jun 13 #Javascript
BootStrap 智能表单实战系列(五) 表单依赖插件处理
Jun 13 #Javascript
You might like
晶体管来复再生式二管收音机
2021/03/02 无线电
IIS环境下快速安装、配置和调试PHP5.2.0
2006/12/17 PHP
Codeigniter检测表单post数据的方法
2015/03/21 PHP
php防止CC攻击代码 php防止网页频繁刷新
2015/12/21 PHP
php实现无限级分类查询(递归、非递归)
2016/03/10 PHP
两个DIV等高的JS的实现代码
2007/12/23 Javascript
判断JavaScript对象是否可用的最正确方法分析
2008/10/03 Javascript
使用Nodejs开发微信公众号后台服务实例
2014/09/03 NodeJs
jquery实现Li滚动时滚动条自动添加样式的方法
2015/08/10 Javascript
js实现鼠标点击左上角滑动菜单效果代码
2015/09/06 Javascript
javascript类型系统 Array对象学习笔记
2016/01/09 Javascript
原生JS轮播图插件
2017/02/09 Javascript
详解Angular Forms中自定义ngModel绑定值的方式
2018/12/10 Javascript
js实现for循环跳过undefined值示例
2019/07/02 Javascript
详解element-ui级联菜单(城市三级联动菜单)和回显问题
2019/10/02 Javascript
vue中实现点击按钮滚动到页面对应位置的方法(使用c3平滑属性实现)
2019/12/29 Javascript
可拖拽组件slider.js使用方法详解
2020/12/04 Javascript
python检查指定文件是否存在的方法
2015/07/06 Python
Python实现批量将word转html并将html内容发布至网站的方法
2015/07/14 Python
详解Python最长公共子串和最长公共子序列的实现
2018/07/07 Python
简单了解python的break、continue、pass
2019/07/08 Python
python编程进阶之异常处理用法实例分析
2020/02/21 Python
Python进程的通信Queue、Pipe实例分析
2020/03/30 Python
python 使用多线程创建一个Buffer缓存器的实现思路
2020/07/02 Python
加拿大当代时尚服饰、配饰和鞋类专业零售商和制造商:LE CHÂTEAU
2017/10/06 全球购物
建筑学推荐信
2013/11/03 职场文书
农村婚礼证婚词
2014/01/10 职场文书
2014的自我评价
2014/01/13 职场文书
30年同学聚会邀请函
2014/01/25 职场文书
文案策划求职信
2014/03/18 职场文书
有关环保的标语
2014/06/13 职场文书
党员批评与自我批评发言
2014/10/02 职场文书
个人年度总结报告
2015/03/09 职场文书
2015年教学副校长工作总结
2015/07/22 职场文书
据Python爬虫不靠谱预测可知今年双十一销售额将超过6000亿元
2021/11/11 Python
mysql函数之截取字符串的实现
2022/08/14 MySQL