title: In a custom widget, inside a validation handler of addMethod(), I have a wrong context (this)
body: <p>I'm creating a custom combobox which uses jQuery validator.</p>
  
  <p>At first they all are gray except the first (it means Country). When I choose 'Slovenská republika' the second combobox is enabled.</p>
  
  <p>They all are instances of a <a href="http://jqueryui.com/autocomplete/#combobox" rel="nofollow noreferrer">a custom autocomplete combobox widget</a>.</p>
  
  <p><img src="https://i.stack.imgur.com/4xtX9.png" alt="initial"> <img src="https://i.stack.imgur.com/zmJlY.png" alt="enter image description here"></p>
  
  <p>To enable the validation I use this code (which is called within <code>_create: function(){..}</code>)</p>
  
  <p>There you can find <code>$.validator.addClassRules();</code> and <code>$.validator.addMethod()</code>. I also added the appropriate class so it really does something.</p>
  
  <pre><code>_registerCustomValidator: function(){
          var uniqueName = this._getUniqueInstanceNameFromThisID(this.id);
          var that = this;
          console.log(this.id);//this prints 5 unique ids when the page is being loaded
          $.validator.addMethod(uniqueName, function(value,element){
              if(!that.options.allowOtherValue){
                  return that.valid;
              }
              console.log(that.id);//this always prints the ID of the last combobox StreetName
              return true;
          }, "Error message.");
          var o = JSON.parse('{"'+uniqueName+'":"true"}');        
          $.validator.addClassRules("select-validator", o); 
  }
  //this.id is my own property that I set in _create
  </code></pre>
  
  <p><strong>Problem:</strong> When I change the value of any instance of combobox, it always prints the ID of the last instance StreetName, but it should belong to the one that has been changed.</p>
  
  <p>I thought it might be because of registering <code>$.validator.addMethod("someName",handler)</code> using such a fixed string, so now I pass a uniqueName, but the problem remains.</p>
  
  <p>Therefore the validation of all instances is based on the property allowOtherValue of the last instance.</p>
  
  <p>I don't understand why it behaves so. Does anyone see what might be the problem?</p>
  
  <p><strong>EDIT:</strong>
  see my comments in the following code</p>
  
  <p><code>_registerCustomValidator</code> is a custom function within a widget factory.</p>
  
  <pre><code> //somewhere a global var
   var InstanceRegistry = [undefined];
  
   //inside a widget factory
   _registerCustomValidator: function(){
      var i=0;
      while(InstanceRegistry[i] !== undefined) ++i;
      InstanceRegistry[i] = this.id;
      InstanceRegistry[i+1] = undefined;
      var ID = i; //here ID,i,InstanceRegistry are correct
      $.validator.addMethod(uniqueName, function(value,element){
          //here InstanceRegistry contains different values at different positions, so its correct
          console.log("ID=="+ID);//ID is always 5 like keeping only the last assiged value.
          var that = InstanceRegistry[ID];
          if(!that.options.allowOtherValue){
              return that.valid;
          }
          return true;
      }, "Error message");
      var o = JSON.parse('{"'+uniqueName+'":"true"}');        
      $.validator.addClassRules("select-validator", o); 
    }   
  </code></pre>