Sencha touch sencha touch中的不可修改形式

我有一个

映射

，我想显示给用户，但我不希望他们能够选择字段来修改它的值。我一直在使用一个带有文本字段的表单，并设置一个属性来禁用它们。这并不理想，因为他们的审美观发生了变化。我这样做是正确的，只是需要应用一些css，还是他们的方法更好？

你可以制作一个表单“标签”，它是不可修改的，但看起来像表单的其余部分。可能需要一些调整，但这应该让您开始：

Ext.form.LabelField = function(config){
   Ext.form.LabelField.superclass.constructor.call(this, config);
};

Ext.extend(Ext.form.LabelField, Ext.form.Field,  {
    isField: true,
    value: '',
    renderSelectors: {fieldEl: '.x-form-labelfield'},
    renderTpl: [
        '<tpl if="label">',
            '<div class="x-form-label"><span>{label}</span></div>',
        '</tpl>',
        '<div class="x-form-label x-form-labelfield" style="width:70%; text-align:right"><span>{value}</span></div>',
   ],
   setValue:function(val) {
      this.value = val;
      if(this.rendered){
         this.fieldEl.update('<span>' + val + '</span>');
      }
    return this;
   },

});

Ext.reg('labelfield', Ext.form.LabelField);

Ext.form.LabelField=函数（配置）{
Ext.form.LabelField.superclass.constructor.call（this，config）；
};
Ext.extend（Ext.form.LabelField、Ext.form.Field、{
伊斯菲尔德：是的，
值：“”，
渲染选择器：{fieldEl:'.x-form-labelfield'}，
renderTpl：[
'',
“{label}”，
'',
“{value}”，
],
设置值：函数（val）{
this.value=val；
如果（本文件已呈现）{
此.fieldEl.update（“”+val+“”）；
}
归还这个；
},
});
Ext.reg（'labelfield'，Ext.form.labelfield）；

您可以制作一个表单“标签”，该标签不可修改，但与表单的其余部分类似。可能需要一些调整，但这应该让您开始：

Ext.form.LabelField = function(config){
   Ext.form.LabelField.superclass.constructor.call(this, config);
};

Ext.extend(Ext.form.LabelField, Ext.form.Field,  {
    isField: true,
    value: '',
    renderSelectors: {fieldEl: '.x-form-labelfield'},
    renderTpl: [
        '<tpl if="label">',
            '<div class="x-form-label"><span>{label}</span></div>',
        '</tpl>',
        '<div class="x-form-label x-form-labelfield" style="width:70%; text-align:right"><span>{value}</span></div>',
   ],
   setValue:function(val) {
      this.value = val;
      if(this.rendered){
         this.fieldEl.update('<span>' + val + '</span>');
      }
    return this;
   },

});

Ext.reg('labelfield', Ext.form.LabelField);

Ext.form.LabelField=函数（配置）{
Ext.form.LabelField.superclass.constructor.call（this，config）；
};
Ext.extend（Ext.form.LabelField、Ext.form.Field、{
伊斯菲尔德：是的，
值：“”，
渲染选择器：{fieldEl:'.x-form-labelfield'}，
renderTpl：[
'',
“{label}”，
'',
“{value}”，
],
设置值：函数（val）{
this.value=val；
如果（本文件已呈现）{
此.fieldEl.update（“”+val+“”）；
}
归还这个；
},
});
Ext.reg（'labelfield'，Ext.form.labelfield）；

我也有同样的需求，希望该字段的功能类似于ExtJS displayfield。我在Sencha Touch中通过创建字段、禁用字段，然后添加回普通字段类来实现这一点。使用disable:true删除编辑器，但该字段不会变灰，仍然易于读取

{
    xtype: 'textfield',
    disabled: true,
    disabledCls: 'x-field',
    label: 'Label',
    name: 'name'
}

---

如果我有足够的这些字段，并花时间覆盖我需要的其他字段类型，这可能会成为一个简单的覆盖。

我也有同样的需要，希望该字段的功能类似于ExtJS displayfield。我在Sencha Touch中通过创建字段、禁用字段，然后添加回普通字段类来实现这一点。使用disable:true删除编辑器，但该字段不会变灰，仍然易于读取

{
    xtype: 'textfield',
    disabled: true,
    disabledCls: 'x-field',
    label: 'Label',
    name: 'name'
}

如果我有足够的这些字段，并且花时间覆盖我需要的其他字段类型，那么这可以成为一个简单的覆盖