既然可以测试本地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的远程数据源读取程序的更多相关文章

  1. extjs 远程数据源

    1本地数据源组合框 Ext.onReady(function(){ //创建数据模型 Ext.regModel('PostInfo', { fields: [{name: 'province'}, { ...

  2. 【easyui-combobox】下拉菜单自动补全功能,Ajax获取远程数据源

    这个是针对easyUI的下拉菜单使用的,Ajax获取远程数据源 HTML 页面 <input id="uname" name="uname" class= ...

  3. Easyui datagrid editor为combobox时指定数据源

    当在datagrid行内部应用添加编辑操作时,引入combobox是非常方便的操作,我在引入combobox时对数据源这快做个总结,在做demo的过程中遇到个问题,就是当你选择了下拉框的值后点击保存, ...

  4. ExtJS学习-----------Ext.Object,ExtJS对javascript中的Object的扩展

    关于ExtJS对javascript中的Object的扩展.能够參考其帮助文档,文档下载地址:http://download.csdn.net/detail/z1137730824/7748893 以 ...

  5. 多个ComboBox绑定同一个数据源出现的问题解决办法

    出现问题: 当多个ComboBox绑定同一个数据源后,只要更改其中一个的选择项时,其它的ComboBox也跟着改变了 解决办法: DataTable dt = new DataTable(); dt ...

  6. 多线程下的 Lambda表达式 异步 WebClient 读取程序图标,来作为托盘 图标 logo ico

    //读取程序图标,来作为托盘图标this.notifyIcon.Icon = System.Drawing.Icon.ExtractAssociatedIcon(System.Windows.Form ...

  7. asp.net项目发布网上-当前自定义错误设置禁止远程查看应用程序

    早上服务器的系统突然出错了,悲剧~ ==============异常信息:============================== 服务器上出现应用程序错误.此应用程序的当前自定义错误设置禁止远程 ...

  8. java远程调试(断点)程序/tomcat( eclipse远程调试Tomcat方法)

    tomcat远程调试: 1.Linux中配置tomcat在catalina.sh中添加如下CATALINA_OPTS="-Xdebug  -Xrunjdwp:transport=dt_soc ...

  9. .net 禁止远程查看应用程序错误的详细信息,服务器上出现应用程序错误

    打开页面时出现以下错误   "/"应用程序中的服务器错误. 运行时错误 说明: 服务器上出现应用程序错误.此应用程序的当前自定义错误设置禁止远程查看应用程序错误的详细信息(出于安全 ...

随机推荐

  1. bzoj3033 太鼓达人——欧拉图搜索

    题目:https://www.lydsy.com/JudgeOnline/problem.php?id=3033 考虑那 (1<<k) 个数,要形成答案,必然是相邻两个数间有 k-1 个重 ...

  2. 87.Ext_菜单组件_Ext.menu.Menu

    转自:https://blog.csdn.net/lms1256012967/article/details/52574921 菜单组件常用配置: /* Ext.menu.Menu主要配置项表: it ...

  3. 3.2 手机中的数据库——SQLite

    http://www.sqlite.org/download.html 截至我安装SQLite数据库为止的时间,最新的版本可以下载sqlite-dll-win64-x64-3200000.zip和sq ...

  4. Shuffle'm Up(串)

    http://poj.org/problem?id=3087 题意:每组3个串,前两个串长度为n,第三个串长度为2*n,依次从第二个串(s2)中取一个字符,从第一个串(s1)中取一个字符,...... ...

  5. A - Supermarket

    Problem description We often go to supermarkets to buy some fruits or vegetables, and on the tag the ...

  6. 自学Python六 爬虫基础必不可少的正则

    要想做爬虫,不可避免的要用到正则表达式,如果是简单的字符串处理,类似于split,substring等等就足够了,可是涉及到比较复杂的匹配,当然是正则的天下,不过正则好像好烦人的样子,那么如何做呢,熟 ...

  7. 3B课程笔记分享_StudyJams_2017

    昨晚才发现 Study Jams China的官方论坛也支持MarkDown,所以直接发在了那上面.http://www.studyjamscn.com/thread-21807-1-1.html

  8. 1C课程笔记分享_StudyJams_2017

    课程1C 概述 课程1C是创建一个生日贺卡应用的实践课程,所以本篇笔记分享主要记录个人的实践过程,此外分享一些比较零散的知识点. Drawable文件夹 Drawable文件夹是Android项目统一 ...

  9. VHDL之User-defined data types

    VHDL allows the user to define own data types. 1 user-defined integer types -- This is indeed the pr ...

  10. boost::mutex::scoped_lock

    在三维重建过程中,世界地图 Map &world作为唯一 访问/更新 对象,可以使用boost::mutex::scoped_lock . 一:boost::mutex::scoped_loc ...