title: Onclick event in html tempelate ExtJs
body: <p>Below is the code sample i'm trying to add a onclick function, but it seems not working as expected. The aim is to take the div tag text value and put it in a variable or return it through a func like myFunction  I also tried adding listeners but don't know how it works .  As its a template its hard to debug. and onclick event or call hierarchy is not easy to find. How to tackle it with simple javascript?</p>
  
  <pre><code>var resultTmpl = '&lt;div id="group_header_{locationName}" class="current_list_audit_location expcol_{locationName:removeSpaces}" style="display:none;"&gt;'+
              '&lt;tpl for="pickslipid"&gt;' +
           '&lt;div class="audit_stage_list" style="margin-top: 6px !important;"&gt;' +
           '&lt;div class="orderpickingpicklistimageurlStage margin-top"&gt;&lt;/div&gt;' +
           '&lt;div style="float:left;"&gt;' +
           '&lt;div class="orderpickingpicklistStagedesc orderpickingpicklistStagedesc2" id={pickupSlipId} onclick="myfunction()" &gt; {pickupSlipId}&lt;/div&gt;&lt;/div&gt;' +
           '&lt;div class="order_pick_right_stage_count_main_group_list audit_stage_pickup_date_list"&gt;' +
           '&lt;div&gt;Pickup Date: {pickupDate}&lt;/div&gt;' +
           '&lt;/div&gt;' +
           '&lt;/div&gt;' +
           '&lt;/tpl&gt;';
  
          // pass the root node of the data object
  
          Ext.define('sif.view.mapping.templates.EX04AuditStagingTpl', {
                  extend: "Ext.XTemplate",
                  html: resultTmpl,
                  myfunction : function(){
                      return document.getElementByClass("orderpickingpicklistStagedesc orderpickingpicklistStagedesc2").value;
                  },
                  constructor: function() {
                      console.log(resultTmpl);
                      return this.callParent([this.html]);
                  }
              });
  
              Ext.util.Format.removeSpaces = function(value) {
                    return !value ? value : String(value).replaceAll(" ", "_");
                  };
              String.prototype.replaceAll = function(search, replacement) {
                      var target = this;
                      return target.split(search).join(replacement);
              };
  </code></pre>
  
  <p>The above code is called from another class EX04AuditStagingLocation as given below:</p>
  
  <pre><code>var ex04AuditStagingList = Ext.create('sif.view.mapping.templates.EX04AuditStagingTpl');
      var ex04AuditStageItems = {
          xtype: 'panel',
          width: '100%',
          height: '100%',
          cls: 'my-panel',
          ui: 'plain',
          itemId: 'ex04showdetailspanel',
          layout: {
              align: 'stretch',
              type: 'vbox'
          },
          items: [{
              xtype: 'list',
              cls: 'current_page_cycle_count',
              store: 'AuditStagingStore',
              itemTpl: ex04AuditStagingList,
              itemHeight: '100%',
              height: '100%',
              emptyText: '&lt;p id="empty-text" style="text-align:center; left: 25px;"&gt;' + PhoneTopUtil.getLocaleString(1280040) + '&lt;/p&gt;',
              grouped: true,
              zIndex: 10,
              pinHeaders: true,
              style: 'font-family: RobotoRegular;',
              loadingText: "",
              itemId: 'ex04AuditStageList',
              id: 'ex04AuditStageList',
              listeners: {
                  painted: function(element, ths) {
                      SifUtils.customImageLoad(element.select('img').elements, 0, IMAGELOADING.CONFIRMPICKUP);
                  },
                  refresh: function(element, options) {
                      SifUtils.customImageLoad(element.element.select('img').elements, 0, IMAGELOADING.CONFIRMPICKUP);
                  },
                  itemtap: function(list, index, target, record) {
                      AuditOrMoveUtil.controller.onAmMoveAction(list, null, null, record);
                  },
              }
          }
  </code></pre>