ExtJs3.2.2使用combo实现自动完成(即动态查询)用过百度和Google的人,都会发现,当你输入关键字的时候,在输
ExtJs3.2.2使用combo实现自动完成(即动态查询)
用过百度和Google的人,都会发现,当你输入关键字的时候,在输入框下面会列出一些近似或相关的关键字提供选择。最近,在添加歌曲的时候,需要选择歌手,其中需求提到在输入歌手名时,提供动态查询,代码如下:
{xtype : 'combo',id : 'songSingerId',fieldLabel : '歌手',displayField : 'singerName',valueField : 'id',store : singerStore,mode : 'remote',triggerAction : 'all',// editable:false,//hideTrigge:true,minChars : 1,queryParam : 'singer.singerName',//typeAhead : true,allowBlank : false,forceSelection : true}
需要注意的地方:
1.minChars:如果没有为该属性赋值,则默认是4,即在输入4个字符时,才会触发自动完成(即动态查询)
2.forceSelection:只能从下拉框中任选一个值,如果输入的值不存在下拉框中,将会被自动清空。
3.queryParam:当在输入框输入1个字符时,将会把“singer.singerName=输入值”传递到服务端。
4.triggerAction : 'all':当值为all时,不传递queryParam参数,即不会会把“singer.singerName=输入值”传递到服务端,当值为“query”时,则传递queryParam参数。
5.hideTrigge:这个属性当为true时,会隐藏掉combobox的下拉按钮。(在这里不采用,已注释)
triggerAction在帮助文档中的解释:
triggerAction : String
The action to execute when the trigger is clicked.
'query' : Default
run the query using the raw value.
'all' :
run the query specified by the allQuery config option
See also queryParam.
有空的话,欢迎到红番薯逛逛