Question

任何人都知道如何在ZK Combobox中显示包含所选项目的图像/图标。例如，此ZK Live Demo显示了如何在下拉列表中的每个Comboitem上放置图像。但是，在此示例中选择项目时，组合框会显示该项目的标签..但不显示图像。

Answer 1

目前你需要自定义它（将所选项目的图像节点复制到组合框）你自己的简单样本：

<zk xmlns:w="client">
    <style>
        .z-combobox-inp,
        .z-combobox-rounded-inp {
            padding-left: 30px;
        }
    </style>
    <combobox>
        <attribute w:name="bind_"><![CDATA[
            function (a, b, c) {
                this.$bind_(a, b, c);
                // anchor used to position selected image
                var n = this.$n(),
                    ref = n.firstChild,
                    span = document.createElement('span');
                jq(span).css('position', 'relative')
                    .addClass('custom-selected-image-anchor');
                n.insertBefore(span, ref);
            }
        ]]></attribute>
        <attribute w:name="_hilite2"><![CDATA[
            function (sel, opts) {
                this.$_hilite2(sel, opts);
                if (opts && opts.sendOnSelect && sel) {
                    var $anchor = jq(this.$n()).find('.custom-selected-image-anchor');
                    $anchor.find('.custom-selected-image')
                        .each(function () {
                            this.parentNode.removeChild(this);
                        });
                    $anchor[0].appendChild(
                        jq(sel.getImageNode()).clone() // clone node
                            .css({'position': 'absolute', // add style
                                'left': '0px',
                                'top': '3px'}) // also add class
                            .addClass('custom-selected-image')[0]       
                    );
                }
            }
        ]]></attribute>
        <comboitem label="test" image="images/battery.gif" />
        <comboitem label="test 2" image="images/left_arrow.png" />
    </combobox>
</zk>

Answer 2

我不认为这是可能的......他们肯定会在文档中提到一些，如何在组合框选择的项目值上获得图像......但是你试过论坛吗？他们肯定会帮助你！

ZK - Combobox选择的项目图像

2 个答案: