先来看例子:

Ext.define('schoolModel', {
extend: 'Ext.data.Model',
fields: [{
name: 'id',
type: 'string'
}, {
name: 'name',
type: 'string'
}]
});
var schoolstore = Ext.create('Ext.data.Store', {
model: 'schoolModel',
proxy: {
type: 'ajax',
url: C_ROOT + "Base/Student/GetSchoolList",
reader: {
type: 'json',
root: 'Record'
}
},
autoLoad: true
});
var schoolCombo = Ext.create('Ext.form.field.ComboBox', {
valueField: "id",
displayField: 'name',
name: 'schoolid',
store: schoolstore,
colspan: 1,
fieldLabel: '所属校区',
queryMode: "local",
forceSelection: true,//只能选,不能输入文本
typeAhead: true//如果匹配到已知的值将填充和自动选择键入的文本其余部分
});
  看了官网的例子,模仿了一下,数据怎么都显示不出来,后来发现原来是数据格式问题,当通过远程获取数据时,需要store需要配置reader项,root属性指示从服务端获取到的json串里面数组对应的属性名,比如以上示例中获取到的数据格式为:{‘Record’:[{‘id’:‘01’,‘name’:‘湖东’},{‘id’:‘02’,‘name’:‘湖西’}]}

Ext4 ComboBox组件使用的更多相关文章

  1. ExtJs学习笔记之ComboBox组件

    ComboBox组件 (1)ComboBox控件支持自动完成.远程加载.和许多其他特性. (2)ComboBox就像是传统的HTML文本 <input> 域和 <select> ...

  2. ext中处理Combobox组件点击触发后台事件的问题

    ext的Combobox组件在绑定数据的时候需要一个Store来绑定数据,在store里面我们可以设置autoLoad属性,这个属性表示Store可以自动的到后台获取数据,ext实质上就是封装好的ja ...

  3. Delphi for iOS开发指南(6):在iOS应用程序中使用ComboBox组件来从列表中选择某一项

    http://blog.csdn.net/delphiteacher/article/details/8924110 Delphi for iOS开发指南(6):在iOS应用程序中使用ComboBox ...

  4. 【Flex】自定义组件-combobox组件

    1包结构 2 Test.mxml <?xml version="1.0" encoding="utf-8"?> <s:Application ...

  5. Flex的Combobox组件使用技巧

    1.显示提示设置Prompt属性可以为Combobox添加一个默认提示.如果没有设置selectedIndex,默认selectedIndex=-1,就显示Prompt的内容.Flex3如果不设置Pr ...

  6. Easyui的combobox组件无法选择内容

    我切换combobox的内容的时候,老是选中的是第一行的数据,因为我渲染的时候没有给它valueField和textField的字段,而默认的又不是我要求的. 加上就好了. $("#tool ...

  7. EasyUI的combobox组件Chrome浏览器不兼容问题解决办法

    EasyUI版本:jQuery EasyUI 1.4.1 Chrome浏览器版本:41.0.2272.101 m 问题描述 在Chrome浏览器下,下拉框选择选项之后,选择的值在下拉框中不显示,重新选 ...

  8. Delphi ComboBox组件

  9. Delphi ComboBox组件 style=csDropDownlist 的赋值方法

    赋值方法: ComboBox1.Items.Add( '文本 '); ComboBox1.ItemIndex := ComboBox1.Items.IndexOf( '文本 '); 清空: Combo ...

随机推荐

  1. Candies-POJ3159差分约束

    Time Limit: 1500MS Memory Limit: 131072K Description During the kindergarten days, flymouse was the ...

  2. shell脚本自动化部署XX的案例(附数组使用)

    #!/bin/sh #Auto Make install MFS Files # cat <<EOF ++++++++++++++++Welcome To Use Auto Install ...

  3. 【Spring】非Spring IOC容器下获取Spring IOC上下文的环境

    前言 在Spring Web项目中,有些特殊的时候需要在非Spring IOC容器下获取Spring IOC容器的上下文环境,比如获取某个bean. 版本说明 声明POM文件,指定需引入的JAR. & ...

  4. UVALive 3971 组装电脑

    https://icpcarchive.ecs.baylor.edu/index.php?option=com_onlinejudge&Itemid=8&page=show_probl ...

  5. OpenModelica仿真

    复杂产品通常涉及机械.控制.电子.液压.气动和软件等多学科领域,其设计过程需要进行仿真,以满足对成本.质量.性能等的要求.目前各个学科和领域都已经有了比较成熟的仿真软件,但大部分仿真软件仅适用于本学科 ...

  6. Sublime Text 3 个人开发习惯

    1.添加author.date到函数注释里面 docblockr插件 a.preferences--package settings--docblockr--settings-user点击打开 b.在 ...

  7. Vi指令,随时追加

    1.设置tab键的空格数 :set tabstop=4 2.显示行号 :set nu

  8. jpg/png格式图片转eps格式的方法总结

    jpg/png格式图片转eps格式的方法总结 转自http://blog.sina.com.cn/s/blog_5410e7b50101lme2.html 用latex写论文的筒子应该遇到这样的问题: ...

  9. ie6、7下 text-indent 问题

    text-indent属性 用于文字缩进,更多是用来隐藏文字.比如,一个logo标题,上面的问题很有艺术感,不得不把文字和背景组合成一张背景图(此处页面元素用a表示),但处于SEO方面的考虑,需要把a ...

  10. TCP 状态详解 -转载

    TCP 是一个面向连接的协议,无论哪一方向另一方发送数据之前,都必须先在双方之间建立一条连接.本节将详细讨论一个TCP 连接是如何建立的以及通信结束后是如何终止的. 建立一个 TCP 连接 TCP使用 ...