Javascript 隐藏/删除空传送带卡

我已经定义了一个包含（1）旋转木马的表单：

items: [{
    xtype:'carousel',
    items:[{
        xtype:'fieldset'
        items:[{
            xtype:'textfield',
            name:'overview1',
            label: 'Overview 1'
        }]
    },{
        xtype:'fieldset',
        itemId:'details',
        items:[{
            xtype:'textfield',
            name:'detail1',
            label: 'Detail 1'
        }]
    }]
}]

和（2）构造函数

constructor:function(record) {
    ...
    if(record.get("showDetails")) this.down('fieldset[itemId=details]').show()
    else this.down('fieldset[itemId=details]').hide()
    ...
}

---

如果showDetails==false，则字段集将隐藏到字段不可见的程度。然而，旋转木马仍然有两张卡，但第二张是空的。如何从传送带中取出卡？

在这种情况下，可以使用带有卡布局的简单面板容器。对于操作我建议使用的旋转木马项目，有一种RebuildDinnerIndex方法，可以从列表中删除该项目

rebuildInnerIndexes: function(activeIndex) {
    var indexToItem = this.innerIndexToItem,
        idToIndex = this.innerIdToIndex,
        items = this.innerItems.slice(),
        ln = items.length,
        bufferSize = this.getBufferSize(),
        maxIndex = this.getMaxItemIndex(),
        changedIndexes = [],
        i, oldIndex, index, id, item;


    if (activeIndex === undefined) {
        this.innerIndexToItem = indexToItem = {};
        this.innerIdToIndex = idToIndex = {};

        for (i = 0; i < ln; i++) {
            item = items[i];
            id = item.getId();
            idToIndex[id] = i;
            indexToItem[i] = item;
            this.fireEvent('itemindexchange', this, item, i, -1);
        }
    }
    else {
        for (i = activeIndex - bufferSize; i <= activeIndex + bufferSize; i++) {
            if (i >= 0 && i <= maxIndex) {
                if (indexToItem.hasOwnProperty(i)) {
                    Ext.Array.remove(items, indexToItem[i]);
                    continue;
                }
                changedIndexes.push(i);
            }
        }

        for (i = 0,ln = changedIndexes.length; i < ln; i++) {
            item = items[i];
            id = item.getId();
            index = changedIndexes[i];
            oldIndex = idToIndex[id];

            delete indexToItem[oldIndex];

            idToIndex[id] = index;
            indexToItem[index] = item;
            this.fireEvent('itemindexchange', this, item, index, oldIndex);
        }
    }
}

重建索引：函数（activeIndex）{
var indexToItem=this.innerIndexToItem，
idToIndex=this.innerIdToIndex，
items=this.innerItems.slice（），
ln=项目长度，
bufferSize=this.getBufferSize（），
maxIndex=this.getMaxItemIndex（），
ChangedIndex=[]，
i、 旧索引，索引，id，项；
如果（activeIndex==未定义）{
this.innerIndexToItem=indexToItem={}；
this.innerIdToIndex=idToIndex={}；
对于（i=0；i对于（i=activeIndex-bufferSize；i=0&&i可以使用
remove
/
removeAt
函数来摆脱面板。但是，当选项卡可能包含表单数据时，这确实需要做很多工作，并且应该在以后重新插入，预先填充在移除选项卡之前的表单数据。见鬼，我还希望提交表格数据

所以我只是使用了一个函数来隐藏该选项卡：

onActiveTabChange:function(carousel, newValue, oldValue, eOpts) {
    var items = carousel.getItems(),
        newIndex = items.indexOf(newValue),
        details = carousel.down('field[name=DetailsTab]').getValue();
    if(!details && newIndex==2) carousel.setActiveItem(0);
    // WTF moment n° 4711: newIndex can be 1 or 2 because index 0 is the indicator; but setActiveItem takes 0 or 1...
},