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 ...
随机推荐
- github 2fa中国认证及TOTP App
Because of your contributions on GitHub, two-factor authentication will be required for your account ...
- 【主流技术】15 分钟掌握 Redis 的安装部署和基本特性
目录 前言 一.Redis 概述 1.1Redis 是什么? 1.2Redis 能做什么? 1.3基础知识 二.Redis 安装与基本命令 2.1Windows 安装 方式一 方式二 2.2Linux ...
- Milvus 2.3.功能全面升级,核心组件再升级,超低延迟、高准确度、MMap一触开启数据处理量翻倍、支持GPU使用!
Milvus 2.3.功能全面升级,核心组件再升级,超低延迟.高准确度.MMap一触开启数据处理量翻倍.支持GPU使用! 1.Milvus 2.3版本全部升级简介 Milvus 2.3.0 不仅包含大 ...
- python实现GUI自动化(控制鼠标)|屏幕快照&图像识别基础
1.GUI自动化 ●GUI自动化就是写程序直接控制键盘和鼠标.这些程序可以控制其他应用,向它们发送虚拟的击键和鼠标点击,就像你自己坐在计算机前与应用交互-样.这种技术被称为"图形用户界面自动 ...
- [zookeeper] 集群搭建及启动后查询服务器状态异常解决
一.集群搭建 1.每台服务器上部署zookeeper 1.将zookeeper压缩包解压到指定位置,在zookeeper解压后目录下创建数据目录zkData 2.在zkData下创建myid文件,内容 ...
- vue-cropper 移动端上传图片压缩裁剪
头像裁剪压缩上传流程: 点击头像--判断是否为IOS端--若是--A,否则--BA:选择图片 --CB:弹框供用户选择从相册选择或者调用相机拍照--选择图片--CC:出现cropper裁剪框,裁剪框位 ...
- 【学习笔记】Python 环境隔离
目录 前言 venv venv 环境管理 venv 包管理 virtualenv 以及 virtualenvwrapper 安装 virtualenvwrapper 环境管理 virtualenvwr ...
- Web入门:JavaScript文字动画
欢迎来的我的小院,恭喜你今天又要涨知识了! 案例内容 利用JavaScript实现文字逐步展现的动画效果. 演示 学习 <!DOCTYPE html> <html lang=&quo ...
- 创建大量栅格文件并分别写入像元数据:C++ GDAL代码实现
本文介绍基于C++语言GDAL库,批量创建大量栅格遥感影像文件,并将数据批量写入其中的方法. 首先,我们来明确一下本文所需实现的需求.已知我们对大量遥感影像进行了批量读取与数据处理操作--具体 ...
- 【OpenVINO™】在 MacOS 上使用 OpenVINO™ C# API 部署 Yolov5
在 MacOS 上使用 OpenVINO C# API 部署 Yolov5 项目介绍 YOLOv5 是革命性的 "单阶段"对象检测模型的第五次迭代,旨在实时提供高速.高精度的结果, ...