0

我正在尝试在 ExtJS 中制作一个包含复选框组和按钮的简单工具栏，它工作得很好，但是当我尝试为我的复选框组提供 id 时，整个工具栏不再显示。这是我的代码：

Ext.define
(
    'CMS.view.TreeGrid.Filters',
    {
        extend: 'Ext.form.Panel', 
        title: 'Filters',
        layout: 'fit',
        alias: 'widget.filters',
        bodyPadding: 10,
        renderTo: Ext.getBody(),
        vtype: 'hbox',
        items :
        [
            {
                xtype: 'toolbar',
                vtype: 'vbox',
                items:
                [

                    {
                        xtype: 'checkboxgroup',
                        //id: 'propertiesCBG',
                        fieldLabel: 'Properties',
                        vertical: true,
                        layout: 'fit',
                        items: 
                        [
                            { boxLabel: 'id',           name: 'rb', inputValue: '1' },
                            { boxLabel: 'State',        name: 'rb', inputValue: '2', checked: true },
                            { boxLabel: 'headline',     name: 'rb', inputValue: '3' },
                            { boxLabel: 'severity',     name: 'rb', inputValue: '4' },
                            { boxLabel: 'country',      name: 'rb', inputValue: '5' },
                            { boxLabel: 'hasRelated',   name: 'rb', inputValue: '6' }
                        ]
                    },
                    {
                        xtype: 'button',
                        text: 'Request',
                        id: 'requestButton',
                    },
                ]
            }
        ]
    }
);

当注释“id：propertiesCGB”行时，我没有任何问题，并且工具栏显示为我希望它显示但我需要我的复选框组的 id 以在我的控制器上获取其值。请帮助我，我只是无法理解问题所在。

4

3 回答 3

1

一般来说，使用 id 属性是一种不好的做法。如果您必须有某种 id，请使用 itemId，它不会有任何类型的全局唯一性约束，并且还允许您在选择器中使用 #。

人们通常使用 id 来轻松获取对组件的引用，例如： Ext.ComponentQuery.query('#myid');

你真正应该做的是：

Ext.ComponentQuery.query('过滤复选框组')

为了获得对您的复选框组的引用。

在您的情况下，将控制器中的选择器更改为“过滤器复选框组”，您应该没问题。请注意，如果您的应用程序中有多个这些，请为您的选择器添加更多特异性，例如，如果您的过滤器组件是特定面板的子组件：

Ext.ComponentQuery.query('panel1 过滤复选框组')

于 2013-10-30T17:32:45.633 回答
0

您是否尝试过将 id 临时更改为其他内容以确认您在项目的其他地方没有重复项？

          xtype: 'checkboxgroup',
          id: 'propertiesCBG_temp',
          fieldLabel: 'Properties',

当有两个具有相同 ID 的组件时，我看到了类似的行为。

于 2013-10-29T20:58:40.863 回答
0

最后，我似乎在两个不同的视图中调用了我的工具栏，所以我猜这会造成与 ID 的冲突。我会找到另一种方法来重用我的工具栏。

于 2013-10-30T07:40:37.723 回答