ExtJs之ComboBox篇

其实我感觉如果大家看过上一篇GridPanel之后对ComboBox的绑定应该很容易了。在这里,我们的demo仍然是动态绑定的(其实这是女朋友问我的一个问题,她当时问我怎么动态绑定ComboBox,我就做了下面的demo)。动态绑定的放其实和GridPanel一样,采用load传参。在GridPanel中我就曾说过,ext中很多组件都可以使用load来实现动态传参的(TreePanel除外)。

ComboBoxd动态绑定

前台代码

后台代码

运行效果

上图正是在点击不同button之后下拉列表中的内容,很明显它的绑定时动态的,道理同样是使用load方法动态传参。相对GridPanel来说其前后台代码都比较简单,主要是配置有细微差别,有了上面的代码我想就不需要过多的解释了。

ComboBox分页

有时候我们的下拉列表内容较多,这个时候我们就必须适用分页解决这个问题了,而事实上ComboBox就具有这样的功能,而且使用起来是特别的方便,只需要简单的配置后配合后台生成数据就可以了。

前台代码

后台代码

运行效果

相对不分页的情况,只是多了minListWidth和pageSize两个属性,然后load中多了相关的分页参数而已;后台代码方面基本上和GridPanel的分页差不多,配合start提供数据就可以了,确实是很方便。

ComboBox认值

这个问题曾有几次被问到,而且我自己最初的时候遇到过这个问题,今天在这里就简单提一下这个问题。我们还用上面的例子,只需要简单添加几句话即可,后台代码和其他东西不需要改变,看一下需要添加代码

从上面可以看出设置认值的原来很简单就是设置ComboBox的Value,只是很多时候这个值是动态得到的,因此我们也就需要通过获得store中第一个值的方法来设置。关于其他方法设置认值,基本上我没有看到,可能后期版本的Ext会添加这个功能吧,至少目前它没有相应的方法

相关文章

AJAX是一种基于JavaScript和XML的技术,能够使网页实现异步交...
在网页开发中,我们常常需要通过Ajax从后端获取数据并在页面...
在前端开发中,经常需要循环JSON对象数组进行数据操作。使用...
AJAX(Asynchronous JavaScript and XML)是一种用于创建 We...
AJAX技术被广泛应用于现代Web开发,它可以在无需重新加载页面...
Ajax是一种通过JavaScript和HTTP请求交互的技术,可以实现无...