ComboBox是最常用的控件之一,它与HTML中的Select控件很像,但可以进行多选、自定义显示格式、分页等。

ComboBox用法

<ext:ComboBox runat="server" ID="cmbUserList" DisplayField="Name" ValueField="ID">
<Store>
<ext:Store runat="server" ID="storeUserInfo">
<Model>
<ext:Model ID="Model1" runat="server" IDProperty="ID">
<Fields>
<ext:ModelField Name="ID" Type="Int"></ext:ModelField>
<ext:ModelField Name="Name" Type="String"></ext:ModelField>
<ext:ModelField Name="Gender" Type="String"></ext:ModelField>
<ext:ModelField Name="Age" Type="Int"></ext:ModelField>
</Fields>
</ext:Model>
</Model>
</ext:Store>
</Store>
</ext:ComboBox>

对于一个ComboBox来说,一定要制定DisplayField和ValueField,然后它包含了一个Store,这个Store我们并不陌生,之前的几篇中都用过。

然后我们在页面加载的时候为Store绑定上数据:

public void BindStore()
{
storeUserInfo.DataSource = UserInfo.GetData();
storeUserInfo.DataBind();
}

这样一个简单的ComboBox示例就完成了。

ComboBox分页

当数据量大的时候,我们当然希望能够进行分页显示,这个功能ComboBox是支持的。

首先我们需要对Store进行分页处理,前面的Ext.Net学习笔记08:使用数据和Ext.Net学习笔记09:Ext.Net中Store的用法中已经介绍过,此处不再赘言。

然后我们要在ComboBox的定义中加上分页的PageSize属性:

<ext:ComboBox runat="server" ID="cmbUserList" DisplayField="Name" ValueField="ID" PageSize="5">

再次刷新我们的页面,你会发现ComboBox已经支持分页了。

ComboBox自定义显示

ComboBox支持通过XTemplate来自定义每一项的显示。

<ext:ComboBox runat="server" ID="cmbUserList" DisplayField="Name" ValueField="ID" MatchFieldWidth="false" PageSize="5">
<Store>
...
</Store>
<ListConfig>
<ItemTpl runat="server">
<Html>
<div>
<b>{Name}</b><br />
<span>年龄:{Age}</span><br />
<span>性别:{Gender}</span>
</div>
</Html>
</ItemTpl>
</ListConfig>
</ext:ComboBox>

Ext.Net学习笔记10:Ext.Net ComboBox用法的更多相关文章

  1. 【Ext.Net学习笔记】04:Ext.Net中使用数据、Ext.Net Store的用法、Ext.Net ComboBox用法

    之前的几篇文章都是介绍Ext.Net较为基础的东西,今天的这一篇将介绍数据的一些用法,包括XTemplate绑定数据.Store(Modal.Proxy).ComboBox的用法等. XTemplat ...

  2. 【Ext.Net学习笔记】02:Ext.Net用法概览、Ext.Net MessageBus用法、Ext.Net布局

    Ext.Net用法概览 Ext.Net还是很强大,如果运用熟练可以极大的提高编程效率.如果你也要学习Ext.Net,原文博主推荐书籍:<Ext.Net Web 应用程序开发教程>,是英文的 ...

  3. Ext.Net学习笔记21:Ext.Net FormPanel 字段验证(validation)

    Ext.Net学习笔记21:Ext.Net FormPanel 字段验证(validation) 作为表单,字段验证当然是不能少的,今天我们来一起看看Ext.Net FormPanel的字段验证功能. ...

  4. 【Ext.Net学习笔记】06:Ext.Net GridPanel的用法(GridPanel 折叠/展开行、GridPanel Selection、 可编辑的GridPanel)

    GridPanel 折叠/展开行 Ext.Net GridPanel的行支持折叠/展开功能,这个功能个人觉得还说很有用处的,尤其是数据中包含图片等内容的时候. 下面来看看效果: 使用行折叠/展开功能之 ...

  5. 【Ext.Net学习笔记】05:Ext.Net GridPanel的用法(包含Filter、Sorter、Grouping、汇总(Summary)的用法)

    GridPanel是用来显示数据的表格,与ASP.NET中的GridView类似. GridPanel用法 直接看代码: <ext:GridPanel runat="server&qu ...

  6. 【Ext.Net学习笔记】03:Ext.Net DirectEvents用法详解、DirectMethods用法详解

    Ext.Net通过DirectEvents进行服务器端异步的事件处理.[Ext.Net学习笔记]02:Ext.Net用法概览.Ext.Net MessageBus用法.Ext.Net布局 中已经简单的 ...

  7. 【Ext.Net学习笔记】01:在ASP.NET WebForm中使用Ext.Net

    Ext.NET是基于跨浏览器的ExtJS库和.NET Framework的一套支持ASP.NET AJAX的开源Web控件,包含有丰富的Ajax运用,其前身是Coolite. 下载地址:http:// ...

  8. Ext JS4 学习笔记之发送表单(Form)时也将表单下的表格(Grid)数据一同发送的方法

    Ext JS4 学习笔记之发送表单(Form)时也将表单下的表格(Grid)数据一同发送的方法 昨天在开发的时候遇到个小问题,就是如何将Grid的内容与Form一起发送到服务器端.默认情况下,表单(F ...

  9. Ext.Net学习笔记22:Ext.Net Tree 用法详解

    Ext.Net学习笔记22:Ext.Net Tree 用法详解 上面的图片是一个简单的树,使用Ext.Net来创建这样的树结构非常简单,代码如下: <ext:TreePanel runat=&q ...

随机推荐

  1. NOIP2002 矩形覆盖

    题四 矩形覆盖(存盘名NOIPG4) [问题描述]: 在平面上有 n 个点(n <= 50),每个点用一对整数坐标表示.例如:当 n=4 时,4个点的坐标分另为:p1(1,1),p2(2,2), ...

  2. 我的iOS开发之路

    我终于开始写我的第一个cocos2d-iphone程序了.纪念一下 额,这是一个悲伤的故事.其实我从开始准备开发iOS已经好久了,从我装上Xcode开始到现在,应该已经有差不多一年的时间了把. 还记得 ...

  3. SharePoint 2010 修改默认列表样式

    SharePoint 2010  修改默认列表样式 :可以通过修改 下面两个全局配置进行修改.(未完..更新中...)  C:\Program Files\Common Files\Microsoft ...

  4. Codeforces2B - The least round way(DP)

    题目大意 给定一个N*N的格子,每个格子里有一个非负数,要求你找出从左上角到右下角的一条路径,使得它满足路径上的格子里的数全部乘起来的积尾部0最少 题解 如果要产生0肯定是2*5得出来的,最终的乘积可 ...

  5. UAF漏洞--iOS是越狱原理

    Use After Free UAF 就是 Use After Free的缩写,是一种比较常见的内存错误式利用.很多iOS的越狱都是利用的这种方法.在此简单的举个例子说明UAF出现的情况 代码说明一切 ...

  6. Oracle- 用户管理

    Oracle一个数据库里可以分配多个用户,用户创建自己的表,自己创建的表如果不想分配给其他用户使用,其他用户是看不到自己的创建的表的. 用户管理: 创建用户: create user chunxiao ...

  7. 【转】Spring的WebServiceTemplate访问WebService的方法及其本质原理

    WebService客户端调用的本质就是将SAOP格式的XML通过通信协议发送到WebService的服务器端,然后接收服务器端返回的XML. 本文简单介绍一下如何通过Spring提供的WebServ ...

  8. 机器人api(图灵机器人)

    图灵机器人,是基于自然语言解析的智能机器人,已经免费开放了机器人api接口,有需求的同学能够去试试. 图灵机器人官网:http://www.tuling123.com 图灵机器人体验:http://w ...

  9. linux环境下tcpdump源代码分析

    Linux 环境下tcpdump 源代码分析 韩大卫@吉林师范大学 tcpdump.c 是tcpdump 工具的main.c, 本文旨对tcpdump的框架有简单了解,只展示linux平台使用的一部分 ...

  10. 跟我一起学extjs5(05--主界面上增加顶部和底部区域)

    跟我一起学extjs5(05--主界面上增加顶部和底部区域)         这一节为主界面加一个顶部区域和底部区域. 一个管理系统的界面能够粗分为顶部标题部分.中间数据展示和处理的部分.底部备注和状 ...