为ExtJS的Combobox下拉列表增加空选项后,空选项的高度比较小。

new Ext.form.ComboBox({ name: 'gender', triggerAction: 'all', editable: false, disabled:false, mode: 'local', displayField: 'name', valueField: 'value', store:genderStore, tpl:'<tpl for=".">' + '<div class="x-combo-list-item" style="height:12px;">' + '{name}' + '</div>'+ '</tpl>' })注意{name}要和displayField的值一致。
修改后效果如下:

也可以用在{name}后加空字符的方法提供一个假的空白选项,例如:
最后,也可以在页面上用css统一规定下拉单选项高度:
tpl:'<tpl for=".">' + '<div class="x-combo-list-item" >' + '{name} ' + '</div>'+ '</tpl>'这样只是在显示渲染的时候在选项后加空字符,不会影响传递到后台的选项数据。
最后,也可以在页面上用css统一规定下拉单选项高度:
.x-combo-list-item { height: 21px;}