0

我想在单击按钮时执行内联编辑，然后激活标题的文本字段和持续时间的数字字段。我是 Sencha 的新手，如何实现。

{
            xtype: 'list',
            store: "Plays",
            itemId:"playsList",

            mode: 'MULTI',
            loadingText: "Loading PlaysList...",
            emptyText: '<div class="notes-list-empty-text">No PlayList found.</div>',
            itemTpl: '<div class="list"><div class="list-item-title">{title}</div><div class="list-item-narrative">{duration}</div><div class="list-item-hide">{hidden}</div></div>',      
            grouped: true,


        },
     {
                xtype: "button",
                iconCls: "inlineedit",
                iconMask: true,
                itemId: "inlineediting"
        },

因此，当我单击按钮时，它会在标题文本字段和持续时间数字字段的列表中激活或具有编辑功能。

4

1 回答 1

1

我的猜测是做这样的事情：

为您的模型添加一个editing字段

fields: [
    ... // Other fields
    {name:"editing", type:"boolean", defaultValue: false}, 
]

使用这种模板

itemTpl: new Ext.XTemplate(
    '<tpl if="editing == false">',
        '<input type="text" name="title" value="{title}" disabled/>',
    '<tpl else>',
        '<input type="text" name="title" value="{title}"/>',
    '</tpl>'
)

然后，当您单击按钮时，您需要按照以下步骤操作：

  • 获取您的商店
  • 循环遍历商店的所有记录
  • 对于每条记录，将editing值设置为 true

然后模板将重新渲染并且输入将是可编辑的。

当然，您需要对 CSS 进行处理以向用户隐藏它是一个输入。

最后，当编辑完成时（我想你会有某种“完成”按钮），你需要浏览列表中的所有项目并用它们的新值更新商店。

我没有尝试过，但我过去做过类似的事情。

希望这可以帮助

于 2012-06-29T19:36:25.040 回答