日期:2014-05-16  浏览次数:20288 次

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.

有空的话,欢迎到红番薯逛逛