Easyui Redraw the ComboBox drop-down ARROW

Source: Internet
Author: User

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

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.