Javascript 为什么Ext JS 3.3下载中不包含Ext JS multiselect项目选择器文件？它们在哪里？

我正在尝试基于设置一个多选项选择器

但是，在将其构建到我的环境中后，我遇到以下错误：

是什么原因导致此错误？我如何修复它？

补遗 我发现，当我注释掉这一行时：

//xtype: 'itemselector',

然后它就起作用了为什么xtype“itemselector”无法工作？

奇怪的是，我发现了itemselector如果“itemselector”不是有效的xtype，Sencha示例如何工作？

增编2 因此，我发现演示可以访问这两个文件：

<script type="text/javascript" src="../ux/MultiSelect.js"></script>
<script type="text/javascript" src="../ux/ItemSelector.js"></script>

---

multiselect是一个用户扩展（因此在UX包中），因此您必须单独下载源代码，因为它不是核心的一部分

他们也对其他插件（例如checkcolumn）这样做，因为它们不是由ExtJS团队编写的，因此没有完全测试/认可

您可以在此处获得multi-select的CSS：

以及itemselector和multiselect的JS：

---

编辑：对不起，我没有看完你的全部问题。我建议按照您的建议将您的ExtJS更新到3.3.1版，这可能是最好的开始。

谢谢，我越来越接近了，但由于某些原因，它仍然找不到xtype“itemselector”，我发布了我上面采取的步骤。也许这是一个路径问题，但我现在引用这两个.js文件，所以我的代码应该能够访问这个xtype。或者我的代码需要其他一些基本代码来访问自定义xtypes吗？确保JS文件加载正常（通过firebug Net选项卡），并确保

Ext.reg（'itemselector'，Ext.ux.form.itemselector'）调用正在进行，您不需要任何额外的代码来访问这些X类型。。只需调用
Ext.reg
就可以在Ext中注册xtypes，确保在ItemSelector.js之前包含MultiSelect.js文件。很好，这两个技巧解决了最后一个问题：路径设置不正确，Ext-all-debug.js必须在ItemSelector.js前面的MultiSelect.js前面，谢谢！
<script type="text/javascript">

    clearExtjsComponent(targetRegion);

    var multiselectDataStore = new Ext.data.ArrayStore({
        data: [[123,'One Hundred Twenty Three'],
            ['1', 'One'], ['2', 'Two'], ['3', 'Three'], ['4', 'Four'], ['5', 'Five'],
            ['6', 'Six'], ['7', 'Seven'], ['8', 'Eight'], ['9', 'Nine']],
        fields: ['value','text'],
        sortInfo: {
            field: 'value',
            direction: 'ASC'
        }
    });

    var simple_form = new Ext.FormPanel({
        labelWidth: 75,
        frame:true,
        style: 'margin: 10px',
        title: 'Simple Form',
        bodyStyle:'padding:5px 5px 0',
        width: 700,
        defaults: {width: 230},
        defaultType: 'textfield',

        items: [{
                fieldLabel: 'Item 1',
                name: 'item1',
                allowBlank:false,
                value: 'sfsfdsf'
            },{
                fieldLabel: 'Item 2',
                labelStyle: 'color:red',
                style: 'color:red',
                name: 'item2'
            },{
                fieldLabel: 'Item 3',
                name: 'item3',
                value: 'nnnnn',
                xtype: 'displayfield'
            }, {
                fieldLabel: 'Email',
                name: 'email',
                vtype:'email'
            }, {
                xtype: 'itemselector',
                name: 'itemselector',
                fieldLabel: 'ItemSelector',
                imagePath: '../ux/images/',
                multiselects: [{
                        width: 250,
                        height: 200,
                        store: multiselectDataStore,
                        displayField: 'text',
                        valueField: 'value'
                    },{
                        width: 250,
                        height: 200,
                        store: [['10','Ten']],
                        tbar:[{
                                text: 'clear',
                                handler:function(){
                                    simple_form.getForm().findField('itemselector').reset();
                                }
                            }]
                    }]
            },

            new Ext.form.TimeField({
                fieldLabel: 'Time',
                name: 'time',
                minValue: '8:00am',
                maxValue: '6:00pm'
            }), {
                width:          100,
                xtype:          'combo',
                mode:           'local',
                value:          'en',
                triggerAction:  'all',
                forceSelection: true,
                editable:       false,
                fieldLabel:     'Produkt',
                name:           'language',
                hiddenName:     'language',
                displayField:   'name',
                valueField:     'value',
                store:          new Ext.data.JsonStore({
                    fields : ['name', 'value'],
                    data   : [
                        {name : 'German',   value: 'de'},
                        {name : 'Broschüre',  value: 'en'},
                        {name : 'French', value: 'fr'}
                    ]
                })
            },{
                xtype: 'radiogroup',
                fieldLabel: 'Status',
                columns: 1,
                vertical: true,
                items: [
                    {boxLabel: 'Low', name: 'rb-vert', inputValue: 1},
                    {boxLabel: 'Medium', name: 'rb-vert', inputValue: 2},
                    {boxLabel: 'High', name: 'rb-vert', inputValue: 3, checked: true},
                    {boxLabel: 'Item 4', name: 'rb-vert', inputValue: 4},
                    {boxLabel: 'Item 5', name: 'rb-vert', inputValue: 5}
                ]
            }


        ],
        buttons: [{
                text: 'Save',
                handler: function() {
                    if(simple_form.getForm().isValid()){
                        simple_form.getForm().getEl().dom.action = 'save_form.php';
                        simple_form.getForm().getEl().dom.method = 'POST';
                        simple_form.getForm().submit({
                            success : function(form, action) {
                                changeMenuItemInfoArea(start_info_panel2, 'Data was saved2, check file: output.txt (this is a new component)');
                                simple_form.hide();
                            }
                        })
                    } else {
                        Ext.Msg.minWidth = 360;
                        Ext.Msg.alert('Invlaid Form', 'Some fields are invalid, please correct.');
                    }
                }
            },{
                text: 'Cancel',
                handler: function(){
                    Ext.Msg.alert('Notice', 'Cancel was pressed.');
                }
            }]
    });

    replaceComponentContent(targetRegion, simple_form);


    var start_info_panel2 = new Ext.Panel({
        id: 'info_panel',
        padding: 10,
        margins: 10,
        style: "margin: 10px",
        width: 300,
        html: '<p id="test">This is some information about the form.<p>',
        border: false
    });
    replaceComponentContent(targetRegion, start_info_panel2);

    hideComponent(regionHelp);

</script>