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皆可省略

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

详细使用方式请参照demo

上一章：BootStrap 智能表单系列 九 表单图片上传的支持

下一章：BootStrap 智能表单系列 十一 级联下拉的支持

本系列首页：BootStrap 智能表单系列 首页

BootStrap 智能表单系列 十 自动完成组件的支持的更多相关文章

  1. BootStrap 智能表单系列 十一 级联下拉的支持

    像省市县选择的这种,但凡是个人肯定都见过,实现方式有很多种 1.有在第一级选择的时候去加载或者从本地对象中拿第一级对应的数据源显示到列表中,第二级以此类推 2.也有将所有的项都加载到select中,然 ...

  2. BootStrap 智能表单系列 首页 (持续更新中...)

    背景:本码农.NET后端工程师,在项目开发中发现写了很多重复的代码, 于是自己整了一套根据配置来生成form表单的插件,针对表单的改动仅需要修改配置的json即可 使用中发现还是蛮实用的,于是开源出来 ...

  3. BootStrap 智能表单系列 九 表单图片上传的支持

    本章介绍如何在生成表单后,可以支持上传图片后可以及时预览图片 代码如下(连接地址:https://github.com/xiexingen/Bootstrap-SmartForm/blob/maste ...

  4. BootStrap 智能表单系列 八 表单配置json详解

    本章属于该系列的高级部分,将介绍表单中一些列的配置 1.config列的配置: 主要用于控制布局 :config:{autoLayout:true|'1,2,2,4'} true:根据配置项最里层的数 ...

  5. BootStrap 智能表单系列 七 验证的支持

    但凡是涉及到用户编辑信息然后保存的页面,都涉及到一个数据是否符合要求的检查,需要客服端和服务器端的校验的问题: 客服端的校验主要是为了提高用户体验,而服务器端的校验为了数据的合格性 该插件也为您支持到 ...

  6. BootStrap 智能表单系列 四 表单布局介绍

    表单的布局分为自动布局和自定义布局两种: 自动布局就是根据配置项中第二级配置项中数组的长度来自动使用不同的bootstrap栅格,通过设置autoLayout为true可以实现自动布局 自动以布局就是 ...

  7. BootStrap 智能表单系列 六 表单数据绑定(编辑页面的数据绑定)

    本章介绍如何在生成表单后,将一个model的数据展示到form表单中(一般用于编辑页面) 代码如下(连接地址:https://github.com/xiexingen/Bootstrap-SmartF ...

  8. BootStrap 智能表单系列 五 表单依赖插件处理

    这一章比较简单哦,主要就是生产表单元素后的一些后续处理操作,比如日期插件的渲染.一些autocomplete的处理等,在回调里面处理就可以了, demo: $("input.date-pic ...

  9. BootStrap 智能表单系列 三 分块表单配置的介绍

    相信广大博友肯定碰到过一个编辑页面分了很多块的情况,智能表单插件已经为您支持了这种情况, 代码如下(链接地址:https://github.com/xiexingen/Bootstrap-SmartF ...

随机推荐

  1. python进阶--打包为exe文件

    一.Python打包为EXE文件有不少方案,比较常用的有下面两种方式: 1.使用py2exe 详细介绍:http://www.cnblogs.com/jans2002/archive/2006/09/ ...

  2. Qt窗口的标题栏自绘

    因个人需要,要修改Qt Widget的标题栏,网上找了大半天,没有得到答案,但发现问的人比较多 所以现将找到的此文分享一下. (原文:http://www.qtsoftware.com/develop ...

  3. 保存网页为图片——滚动截取IE（WebBrowse）

    对IE进行编程一直觉得是相当可怕的事情,里面的接口.函数.事件之多,解释之乱,需要了解的方方面面知识之博,让我仿佛看到了微软就是造物主,因为它已成功制造了这样的混沌,弄就了宇宙的初始状态…… 近来做个 ...

  4. iOS 4.2 SDK安装

    iOS 4.2 SDK安装 ◆系统版本:10.6.5 ◆硬件配置: ◆10G空间,3.5G内存,显卡:GMA950 Xcode 3.2.5和iOS 4.2 SDK下载:http://developer ...

  5. poj1528---(数论)

    题意:一个数除了自身以外的所有因数相加,得到的数如果小于自身,输出deficient,否则输出abundant,如果相等,输出perfect 这道题核心:求一个数的所有除本身之外的因数的和 ,i; ; ...

  6. 杭电 1272 POJ 1308 小希的迷宫

    这道题是我学了并查集过后做的第三个题,教我们的学姐说这是并查集的基础题,所以有必要牢牢掌握. 下面就我做这道题的经验,给大家一些建议吧!当然,我的建议不是最好的,还请各位大神指出我的错误来,我也好改正 ...

  7. 网易云课堂_C语言程序设计进阶_第七周：文件：文件访问、格式化输入输出、二进制输入输出

    7.1文件 7.2底层操作 7.1文件 格式化的输入输出 printf %[flags][width][.prec][hIL]type Flag 含义 - 左对齐 + 在前面放+或- (space) ...

  8. python字符串转义与正则表达式特殊字符转义

    最近在自学python,字符串和正则表达式的特殊字符转义有点混淆,做个笔记简单总结一下. 1.普通字符串转义 在字符串中使用特殊字符时,要用反斜杠(\)转义字符.例如:'Let\'s go!',这里对 ...

  9. EF 4.0 更新数据时候的一个错误及其处理

    错误如图: 修改下方法后可以进行更新了.但是中间多了一步查询 /// <summary> /// 更新一个产品分类 /// </summary> /// <param n ...

  10. 脚本化css

    html文档的视觉显示包含很多变量:字体.颜色.间距等.css标准列举了这些变量.我们称之为样式属性.css定义了这些属性以指定字体.颜色.外边距.边框.背景.图片.文本对齐方式.元素尺寸和元素位置. ...