In the afternoon a friend asked me a question, she line to redraw the ComboBox drop-down arrow. My first thought was to have her replace the native icon. But they also said, to select and multiple selection of the drop-down arrow icon is not the same. A period of time useless do not know whether Easyui to the ComboBox open this cut, then looked at the document, found no. So it seems only to see the source, but combo no source, only the metamorphosis of the "_1,_2" named version:
if(_4.hasDownArrow){ _6.push({iconCls:"combo-arrow",handler:function(e){ _a(e.data.target);}});
Hasdownarrow controls whether a drop-down arrow is displayed, and if set to false, there is no drop-down arrow, but there is no event that is bound to the drop-down arrow.
Well, then look again and see that there are:
var _4=_3.options;// 中间有省略var _6=$.extend(true,[],_4.icons);
Then it can be thought that _4 is the optionsof the ComboBox , while _6 is the icons attribute in _4 . Oh? There is also the icons attribute, how does the official document not see? Is it a hidden property? Oh
Take a look at the first piece of code:
if(_4.hasDownArrow){ _6.push({iconCls:"combo-arrow",handler:function(e){ _a(e.data.target);}});
Should be able to think of the format of the icon, yes, it is {iconCls:"", handler:function(){}}
. and icons is an array, so the following can be written:
hasDownArrow:false, icons:[{ iconCls:‘icon-room-16‘, handler:function(){ $(this).parent().next().click(); } }], editable:false
In fact, it is completely non-use of downarrow logic, and put their own icon to handle the Click event, and here the handler is also implemented is very simple, is analog click on the non-icon part of the ComboBox , so here editable set to false is required.
Easyui Redraw the ComboBox drop-down ARROW