在容器extjs上添加选择器

vd8tlhqk 于 2022-09-26 发布在其他

关注(0)|答案(1)|浏览(204)

大家好，我应该添加Ext.form.field。选取器到我的自定义组件，但我不知道是否可能。

createStructure: function () {
    this.add({
        xtype: 'container',
        cls: 'logo-avatar-messages',
        height: 50,
        maxHeight: 50,
        style: 'background-color: #ccc; border-radius: 50%; vertical-align: middle;',
        width: 50,
        layout: 'center',
        flex: 1,
        items: [
            {
                xtype: 'label',
                style: 'font-size: 25px; IMPORTANT!; color: #ffffff;',
                listeners: {
                    afterRender: function (component) {
                        var utente = userData.get('denominazione');
                        if (utente !== 'ND') {
                            var alias = utente.split(' ')[0][0] + utente.split(' ')[1][0];
                            component.setText(alias);
                        }
                    },

                }
            }
        ]
    });
}

})

extjs

来源：https://stackoverflow.com/questions/72258408/add-picker-on-container-extjs

1条答案

按热度按时间

cbwuti441#

引用选择器字段可用的文档here：“具有单个触发器的字段的抽象类，该触发器在字段下方打开一个“选择器”弹出窗口，例如组合框菜单列表或日期选择器”。
因此，您可能正在寻找一个combobox，一个扩展/实现pickerfield的字段。您可以使用tpl配置对可供选择的每一行的模板进行大量自定义，以显示复杂的html元素，而无需重新创建轮子。
为您提供一个使用tpl配置可以做什么的示例，例如为每个可供选择的记录显示一个html表：

tpl: Ext.create('Ext.XTemplate',
                    '<tpl for=".">',
                        '<div class="x-boundlist-item" style="border-bottom:1px solid #f0f0f0;">',
                            '<table>',
                                '<tr>',
                                    '<th width="100">ORDER ID: </th><td>{orderId}</td>',
                                '</tr>',
                                '<tr>',
                                    '<th>ORDER TYPE: </th><td>{orderType}</td>',
                                '</tr>',
                                '<tr>',
                                    '<th>DESCRIPTION: </th><td><i>{orderDescription}</i></td>',
                                '</tr>',
                                '<tr>',
                                    '<th>DATE: </th><td>{orderDate:date("d/m/Y")}</td>',
                                '</tr>',
                            '</table>',
                        '</div>',
                    '</tpl>'),

赞(0）回复(0）举报 2022-09-26

我来回答

在容器extjs上添加选择器

1条答案

相关问题

热门标签

最新问答