Ext-js自定义html数据属性

时间:2017-01-05 15:17:41

标签: dom extjs attributes

我需要能够设置一个' data-selenium-id'每个(动态而非动态)子输入字段的属性。我可以使用下面的覆盖设置父标记(在本例中为表)和数据selenium id,我希望它会设置所有字段。我对ext-js很新,我必须将代码保留在覆盖函数中,并且我很难找到答案。 foo:' bar'下面的代码行是我尝试过的,也试过调出父ID' TextSearch'并以这种方式设置属性,但它没有提出任何新属性。此外,正如您所看到的,顶部表标记列出了ID。这个id是由我创建的,用于测试,所有标签都将由ext-js动态创建。

Ext.override(Ext.AbstractComponent, {
onBoxReady: function () {
    var me = this,
        el = me.getEl();

        el.set({foo: 'bar'});
    if (el && el.dom) {

        if (me.itemId || me.name) {
            el.dom.setAttribute('data-selenium-id', me.itemId || me.name);
        } else { 

            if (me.pickerField && me.pickerField.itemId && me.xtype) { 
                el.dom.setAttribute('data-selenium-id', me.pickerField.itemId + '-' + me.xtype);
            }
            if (me.timeField && me.timeField.itemId && me.xtype) { 
                el.dom.setAttribute('data-selenium-id', me.timeField.itemId + '-' + me.xtype);
            }
        }
    }

    me.callOverridden(arguments);
}

});

但是我需要动态创建的所有输入字段也具有此属性。 HTML在下面。



<table class="x-field x-table-plain x-form-item x-form-type-text x-field-toolbar x-box-item x-toolbar-item x-field-default-toolbar x-hbox-form-item" style="width: 130px; table-layout: fixed; right: auto; left: 830px; top: 1px; margin: 0px;" cellpadding="0"
role="presentation" id="triggerfield-1126" foo="bar" data-selenium-id="TextSearch">
  <tbody>
    <tr role="presentation" id="triggerfield-1126-inputRow" class="x-form-item-input-row">
      <td role="presentation" id="triggerfield-1126-labelCell" style="display:none;" valign="top" halign="left" width="5" class="x-field-label-cell">
        <label id="triggerfield-1126-labelEl" for="triggerfield-1126-inputEl" class="x-form-item-label x-unselectable x-form-item-label-left" style="margin-right:5px;" unselectable="on"></label>
      </td>
      <td role="presentation" class="x-form-item-body x-form-trigger-wrap-focus" id="triggerfield-1126-bodyEl" colspan="3" style="width: 100%;">
        <table id="triggerfield-1126-triggerWrap" class="x-form-trigger-wrap" cellpadding="0" cellspacing="0" role="presentation" style="width: 100%; table-layout: fixed;">
          <tbody role="presentation">
            <tr role="presentation">
              <td id="triggerfield-1126-inputCell" class="x-form-trigger-input-cell" role="presentation" style="width: 100%;">
                <input id="triggerfield-1126-inputEl" type="text" role="textbox" size="1" name="triggerfield-1126-inputEl" placeholder="Search events" class="x-form-field x-form-text x-form-focus x-field-form-focus x-field-default-toolbar-form-focus" autocomplete="off"
                data-errorqtip="" style="width: 100%;">
              </td>
              <td role="presentation" valign="top" class=" x-trigger-cell x-unselectable" style="width:17px;" id="ext-gen1260">
                <div class="x-trigger-index-0 x-form-trigger x-form-clear-trigger x-form-trigger-first" role="presentation" id="ext-gen1259"></div>
              </td>
            </tr>
          </tbody>
        </table>
      </td>
    </tr>
  </tbody>
</table>
&#13;
&#13;
&#13;

0 个答案:

没有答案