Javascript ExtJS动态更改combobox项的值

因此，我正在使用ExtJS 3.3，我有一个组合框，我用值填充它，当它展开时，列表中的一些值需要缩进，所以我使用了

这在组合框展开时非常有效，但是一旦我选择了一个项目，

在组合框折叠时实际上会显示出来

比如,；展开后，“我的值”显示为

        this is my indented value

这正是我想要的，但当折叠时，值显示为

    this is my indented value

是否有任何方法可以动态地从值的前面修剪空格，以便在展开视图中显示缩进，但折叠视图只显示值而不显示其他内容

---

我找到了一个

select

监听器，但我只能找到它。

我会用另一种方法来做，因为这更简单、更符合逻辑：缩进首先不应该是值的一部分。我将修改组合的模板：

tpl: '<tpl for="."><div class="x-combo-list-item"><tpl if="indent">&nbsp;&nbsp;&nbsp;&nbsp;</tpl>{text}</div></tpl>',

如果设置为true，将缩进与存储记录对应的值

如果需要不同的缩进，可以尝试使用模板函数根据数字生成缩进。以下示例仅适用于ExtJS、YMMV的最新版本：

tpl: new Ext.XTemplate(
    '<tpl for="."><div class="x-combo-list-item">{[ this.getIndent(values.indent) ]}{text}</div></tpl>', 
    {
        getIndent: function(indent) {
            var s = "";
            for(var i=0;i<indent; i++) s= s+"&nbsp;";
            return s;
        }
    }
),
store:{
    inlineData:[{
        text: 'A',
        indent:2
    },{
        text: 'B',
        indent: 4
    }],
}

tpl:new Ext.XTemplate(
“{[this.getIndent（values.indent）]}{text}”，
{
getIndent：函数（缩进）{
var s=“”；
对于（var i=0；iI）我也这么认为，但我对不同的项目有一定数量的缩进，一个项目可以有2个，另一个项目可以有4个，根项目有2个，然后子项目有4个..它变得非常简单complicated@BigJobbies我修正了我的答案。
tpl: new Ext.XTemplate(
    '<tpl for="."><div class="x-combo-list-item">{[ this.getIndent(values.indent) ]}{text}</div></tpl>', 
    {
        getIndent: function(indent) {
            var s = "";
            for(var i=0;i<indent; i++) s= s+"&nbsp;";
            return s;
        }
    }
),
store:{
    inlineData:[{
        text: 'A',
        indent:2
    },{
        text: 'B',
        indent: 4
    }],
}