jquery ui autocomplete ajax返回数据自定义显示
1、body里面的内容
<input type="text" class="inputTxt" id="txtJigou" autocomplete="off"/>
2、引入jquery.ui.min.js和他的样式
3.js代码如下<script type="text/javascript">
$(function(){
$("#txtJigou").autocomplete({
source: function( request, response ) {
$.ajax({
url: "/Home/Organization/getList.html",
dataType: "json",
data: {
"name": "中","typeid":"11"
},
success: function( data1 ) {
if(data1.state==1){
//data1返回json格式如下
response(data1.data);
}
}
});
},
minLength:1,
autoFocus:true,
focus: function( event, ui ) {
$( "#txtJigou" ).val( ui.item.company );
return false;
},
select: function( event, ui ) {
$( "#txtJigou" ).val( ui.item.company );
return false;
}
}).autocomplete( "instance" )._renderItem = function( ul, item ) {
//这里是自定义显示的数据,我需要显示的数据是上面的data1.data
return $( "<li>" )
.append( "<a>" + item.company + "<br>" + item.desc + "</a>" )
.appendTo( ul );
};
});
</script>
4、返回JSON的数据如下
{
"state": 1,
"data": {
"10013": {
"id": "10013",
"company": "金谷信托",
"alias": "中国金谷国际信托有限责任公司"
},
"11031": {
"id": "11036",
"company": "民生信托",
"alias": "中国民生信托有限公司"
}
}
}
jquery ui autocomplete ajax返回数据自定义显示的更多相关文章
- jQuery ui autocomplete下拉列表样式失效解决,三种获取数据源方式,
jQuery有很多很多的已经实现,很漂亮的插件,autocomplete就是其中之一.jQuery ui autocomplete主要支持字符串Array.JSON两种数据格式,jQuery ui b ...
- jQuery UI Autocomplete是jQuery UI的自动完成组件(share)
官网:http://jqueryui.com/autocomplete/ 以下分享自:http://www.cnblogs.com/yuzhongwusan/archive/2012/06/04/25 ...
- jQuery UI Autocomplete是jQuery UI的自动完成组件
支持的数据源 jQuery UI Autocomplete主要支持字符串Array.JSON两种数据格式. 普通的Array格式没有什么特殊的,如下: ? 1 ["cnblogs" ...
- Jquery ui autocomplete简单api
重要说明:与配置选项类似,Autocomplete插件的方法也不是直接调用,而且通过autocomplete()方法进行间接调用.例如: $("#title").autocompl ...
- 160620、利用 jQuery UI 和 Ajax 创建可定制的 Web 界面
如今,网站比以往更具可定制性,允许用户更改其空间,根据自己的喜好对其进行个性化.个性化的主页或仪表板页面(例如 iGoogle.MyYahoo! 和 MyAOL)日渐普及,大多数 Web 应用程序内甚 ...
- jQuery UI AutoComplete的使用
现场提出优化单,Table Mapping里关于获取数据源下所有表名的地方由于表数量过多选择不便,需添加搜索功能.原本的实现是一个Dialog ,现打算将其改为AutoComplete. 框架使用的是 ...
- jquery ui autocomplete 实现点击文本框,出现所有查询信息效果,与bootstrap结合使用修改样式
直接看代码 <!doctype html> <html lang="en"> <head> <meta charset="utf ...
- jQuery.ui autoComplete使用
官网 http://api.jqueryui.com/autocomplete/#option-source 参考了 http://www.cnblogs.com/lwme/archive/2012 ...
- Node.js配合jQuery UI autocomplete的应用
Node.js擅长的领域为: 不需要很多运算 吞吐量要求高 进消息轻并且要求快 出消息轻并且要求快 网上的例子都是socket.io的,我一直在想到底能用在什么地方?根据node.js的优点(擅长领域 ...
- Jquery UI Autocomplete 在mvc中应用
首先添加引用 <link href="~/Content/themes/base/jquery-ui.css" rel="stylesheet" type ...
随机推荐
- Go 跟踪函数调用链,理解代码更直观
Go 跟踪函数调用链,理解代码更直观 目录 Go 跟踪函数调用链,理解代码更直观 一.引入 二.自动获取所跟踪函数的函数名 三.增加 Goroutine 标识 四.让输出的跟踪信息更具层次感 五.利用 ...
- 宏观上看Spring创建对象的过程
宏观上看Spring创建对象的过程 对于对象而言,可以分为简单对象和复杂对象: 简单对象 简单对象指可以直接new的对象: Spring在创建这些对象时,是基于反射来完成的. 复杂对象 复杂对象指不能 ...
- 使用telnet来调试游戏
telnet是什么 Telnet协议是TCP/IP协议族中的一员,是Internet远程登陆服务的标准协议和主要方式.它为用户提供了在本地计算机上完成远程主机工作的能力 但是,telnet因为采用明文 ...
- 从零开始配置vim(25)——关于 c++ python 的配置
从9月份到国庆这段时间,因为得了女儿,于是回老家帮忙料理家事以及陪伴老婆和女儿.一时之间无暇顾及该系列教程的更新.等我回来的时候发现很多小伙伴私信我催更.在这里向支持本人这一拙劣教程的各位小伙伴表示真 ...
- 个人找工作面试准备------以及别人面试心得{待更新中ing}
参考链接先放: https://blog.csdn.net/u014400934/article/details/102577804?utm_medium=distribute.pc_relevant ...
- Linux虚拟机追加扩展磁盘
一.使用VMware给虚拟机追加磁盘 使用VMware打开虚拟机设置对话框,选择硬盘,点击右侧的扩展按钮,输入扩展后的磁盘容量. 点击扩展按钮.提示磁盘已成功扩展. 二.对闲置的空间进行分区 上面扩展 ...
- 【链表】单链表的介绍和基本操作(C语言实现)【保姆级别详细教学】
单链表 文章目录 前言 单链表基本介绍 基本结构 与顺序表的区别以及学习单链表的必要性 单链表的实现 结点的定义以及头指针的创建 单链表的遍历(打印接口的实现)[重点] 开辟结点接口 尾插接口 尾删接 ...
- TStringList的IndexOfName
IndexOfName这个方法用着很好,记录下,以后留意下 上个例子: procedure TForm1.Button1Click(Sender: TObject); var MyList: TStr ...
- Kafka-生产者、broker、消费者的调优参数总结
生产环境下,为了尽可能提升Kafka的整体吞吐量,可以对Kafka的相关配置参数进行调整,以达到提升整体性能的目的. 本文主要从Kafka的不同组件出发,讲解各组件涉及的配置参数和参数含义. 一.生产 ...
- Python中`yield`关键字详解
Python中`yield`关键字有什么用? Python中yield关键字有什么用? 它能做什么? 例如,我试图理解这段代码1: def _get_child_candidates(self, di ...