如何在 Sencha Touch 中为文本字段添加属性？
Posted
技术标签:
【中文标题】如何在 Sencha Touch 中为文本字段添加属性？【英文标题】：How to add attribute to Text field in Sencha Touch? 【发布时间】：2018-08-31 07:00:37 【问题描述】：我必须为我的 Sencha 触摸表单中的一些文本字段和数字字段添加属性。那里我没有找到任何配置选项，我们可以为这些字段/控件设置属性。
Sencha Touch 是否提供任何选项来为这些控件添加属性？
就像下面的 html 代码/控制一样，我需要在我的 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>
【问题讨论】：
你想为组件或它的 dom 添加属性？ 是的，我想为其 DOM 添加属性 【参考方案1】：@Vikas 在 ExtJS 中，他们有 inputAttrTpl 配置。使用它可以很容易地将属性直接定义到文本字段组件的输入元素。
但在 Sencha Touch 中，文本字段不存在此配置。你需要做的是——
-
聆听绘制事件
在这种情况下，使用即将到来的文本字段元素作为参数，您可以通过查询找到相应的输入元素。
然后使用set方法设置属性
请参考以下小提琴 -
https://fiddle.sencha.com/#view/editor&fiddle/2kvu
【讨论】：
【参考方案2】：您可以设置如下属性：-
xtype: 'textfield',
name: 'name',
label: 'Name',
listeners:
painted: function (el, eOpts)
el.dom.querySelector('input').setAttribute('data-openpay-card', 'your-value');
Working Fiddle
希望这将帮助/指导您实现您的要求。
【讨论】：
以上是关于如何在 Sencha Touch 中为文本字段添加属性？的主要内容，如果未能解决你的问题，请参考以下文章
Sencha Touch：如何以编程方式关注 ios 上的文本字段？