ExtJs之Ext.comboBox的远程数据源读取程序
既然可以测试本地AJAX,那就把书前面的代码作一次学习吧。
<!DOCTYPE html>
<html>
<head>
<title>ExtJs</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<link rel="stylesheet" type="text/css" href="ExtJs/packages/ext-theme-crisp/build/resources/ext-theme-crisp-all.css">
<script type="text/javascript" src="ExtJs/ext-all.js"></script>
<script type="text/javascript" src="ExtJs/bootstrap.js"></script>
<script type="text/javascript" src="ExtJs/packages/ext-theme-crisp/build/ext-theme-crisp.js"></script>
<script type="text/javascript">
Ext.onReady(function(){
Ext.define('BookInfo', {
extend: 'Ext.data.Model',
fields: [{name: 'bookName'}]
});
var bookStore = Ext.create('Ext.data.Store', {
model: 'BookInfo',
proxy: {
type: 'ajax',
url: 'source.html',
reader: new Ext.data.ArrayReader({model: 'BookInfo'})
}
});
Ext.create('Ext.form.Panel', {
title: 'Sample',
frame: true,
height: 300,
width: 600,
renderTo: Ext.getBody(),
bodyPadding: 5,
defaults: {
labelSeparator: ': ',
labelWidth: 100,
width: 400,
labelAlign: 'left'
},
items: [{
xtype: 'combo',
fieldLabel: '书籍列表',
listConfig: {
loadingText: '正在加载书籍信息',
emptyText: '未找到匹配值',
maxHeight: 160
},
allQuery: 'allbook',
minChars: 3,
queryDelay: 300,
queryParam: 'searchbook',
tiggerAction: 'all',
store: bookStore,
displayField: 'bookName',
valueField: 'bookName',
queryMode: 'remote',
}]
});
});
</script>
</head>
<body>
<div id='tpl-table1'></div>
<br>
<div id='tpl-table2'></div>
</body>
</html>
source.html的内容:
[ ['java编程思想'], ['C++入门'], ['javascript入门'], ['python入门'], ['php程序设计'] ]

ExtJs之Ext.comboBox的远程数据源读取程序的更多相关文章
- extjs 远程数据源
1本地数据源组合框 Ext.onReady(function(){ //创建数据模型 Ext.regModel('PostInfo', { fields: [{name: 'province'}, { ...
- 【easyui-combobox】下拉菜单自动补全功能,Ajax获取远程数据源
这个是针对easyUI的下拉菜单使用的,Ajax获取远程数据源 HTML 页面 <input id="uname" name="uname" class= ...
- Easyui datagrid editor为combobox时指定数据源
当在datagrid行内部应用添加编辑操作时,引入combobox是非常方便的操作,我在引入combobox时对数据源这快做个总结,在做demo的过程中遇到个问题,就是当你选择了下拉框的值后点击保存, ...
- ExtJS学习-----------Ext.Object,ExtJS对javascript中的Object的扩展
关于ExtJS对javascript中的Object的扩展.能够參考其帮助文档,文档下载地址:http://download.csdn.net/detail/z1137730824/7748893 以 ...
- 多个ComboBox绑定同一个数据源出现的问题解决办法
出现问题: 当多个ComboBox绑定同一个数据源后,只要更改其中一个的选择项时,其它的ComboBox也跟着改变了 解决办法: DataTable dt = new DataTable(); dt ...
- 多线程下的 Lambda表达式 异步 WebClient 读取程序图标,来作为托盘 图标 logo ico
//读取程序图标,来作为托盘图标this.notifyIcon.Icon = System.Drawing.Icon.ExtractAssociatedIcon(System.Windows.Form ...
- asp.net项目发布网上-当前自定义错误设置禁止远程查看应用程序
早上服务器的系统突然出错了,悲剧~ ==============异常信息:============================== 服务器上出现应用程序错误.此应用程序的当前自定义错误设置禁止远程 ...
- java远程调试(断点)程序/tomcat( eclipse远程调试Tomcat方法)
tomcat远程调试: 1.Linux中配置tomcat在catalina.sh中添加如下CATALINA_OPTS="-Xdebug -Xrunjdwp:transport=dt_soc ...
- .net 禁止远程查看应用程序错误的详细信息,服务器上出现应用程序错误
打开页面时出现以下错误 "/"应用程序中的服务器错误. 运行时错误 说明: 服务器上出现应用程序错误.此应用程序的当前自定义错误设置禁止远程查看应用程序错误的详细信息(出于安全 ...
随机推荐
- go之数据类型转换和类型断言
一.类型转换 1.1 简单类型转换 格式 valueOfTypeB = typeB(valueOfTypeA) int 转 float64 package main import "fmt& ...
- pjax使用小结
简介 虽然传统的ajax方式可以异步无刷新改变页面内容,但无法改变页面URL,因此有种方案是在内容发生改变后通过改变URL的hash的方式获得更好的可访问性(如https://liyu365.gith ...
- POJ 2945 trie树
Find the Clones Time Limit: 5000MS Memory Limit: 65536K Total Submissions: 7704 Accepted: 2879 Descr ...
- kotlin第一个项目的搭建
怎么在Android Studio中使用Kotlin? 1.使用Android Studio的插件 2.将Android Studio升级到3.0版本:目前不推荐,因为3.0的版本目前还是Dev Ch ...
- C# 连接 access2010数据库
//定义一个新的OleDb连接 System.Data.OleDb.OleDbConnection conn = new System.Data.OleDb.OleDbConnection(); // ...
- Windows下使用Caffe-Resnet
参考文章: 编译历程参考:CNN:Windows下编译使用Caffe和Caffe2 caffe的VS版本源代码直接保留了sample里面的shell命令,当然这些shell命令在Windows平台下是 ...
- Photoshop显示RGB值问题
Bmp与JPEG格式的不同之处在哪里? 使用OpenCV读写图像,然后由Photoshop显示时候结果并不相同,使用jpg格式的图像灰度值明显大于bmp格式,但jpg格式的显示信息是错误的. 过程: ...
- 使用Visio—UML画类图
在一个VS工程中,由于类的个数较多,而参数描述不是特别清晰.若此工程的生命周期较长,则有必要对工程进行完整分析,给出完整的文档.需要画出类图,并对每个成员进行详细描述. 一.画出类图 在VIsio中, ...
- 详解CorelDRAW智能填充工具的运用
使用智能填充工具可以为任意的闭合区域填充颜色并设置轮廓.与其他填充工具不同,智能填充工具仅填充对象,它检测到区域的边缘并创建一个闭合路径,因此可以填充区域.例如,智能填充工具可以检测多个对象相交产生的 ...
- Python中字典的相关操作
1. Python类似于Java中的哈希表,只是两种语言表示的方式是不一样的,Python中的字典定义如下: 在Python中是一种可变的容器模型,它是通过一组键(key)值(value)对组成,这种 ...