如何在 Sencha Touch 的文本字段中添加属性?

How to add attribute to Text field in Sencha Touch?

我必须向我的 Sencha touch 表单中的某些文本字段和数字字段添加属性。在那里我没有找到任何配置选项,我们可以将属性设置为这些 fields/controls.

Sencha Touch 是否提供任何选项来向这些控件添加属性?

如下所示 html code/cotrols 我需要在我的 sencha 触摸控件中设置属性。如果有什么办法,请建议我。你的帮助对我来说很有价值。

这是 HTML 代码。我想设置我的 Sencha 文件,就像在 html 代码中添加的这个属性一样。在这里你可以看到 data-openpay-card 被添加为属性

<html>
<label>Nombre del titular</label><input type="text" name="holder" placeholder="Como aparece en la tarjeta" autocomplete="off" data-openpay-card="holder_name"></input>
<label>Número de tarjeta</label><input type="text" name="card" autocomplete="off" data-openpay-card="card_number"></div <div class="sctn-col half l"><input type="text" name="month" placeholder="Mes" data-openpay-card="expiration_month"></div>
<div class="sctn-col half l"><input type="text" name="year" placeholder="Año" data-openpay-card="expiration_year"></div>

</html>

您可以设置如下属性:-

{
    xtype: 'textfield',
    name: 'name',
    label: 'Name',
    listeners: {
        painted: function (el, eOpts) {
            el.dom.querySelector('input').setAttribute('data-openpay-card', 'your-value');
        }
    }
}

Working Fiddle

希望这会help/guide你达到你的要求。

@Vikas 在 ExtJS 中,他们有 inputAttrTpl 配置。使用它可以非常容易地将属性直接定义到文本字段组件的输入元素。

但在 Sencha Touch 中,此配置不存在于文本字段中。你需要做的是-

  1. 监听画图事件
  2. 在这个事件中使用即将到来的textfield元素作为参数,你可以通过查询找到对应的input元素。
  3. 然后使用set方法设置属性

请参考以下 fiddle -

https://fiddle.sencha.com/#view/editor&fiddle/2kvu