title: JQuery - Get calling element id
body: <p><strong>Problem</strong></p>
  
  <p>In the source function of the autocomplete I want to get the selector's ID. Is there a way I can travese through the call stack and get this? Does <code>JQuery</code> have this level of abstraction?</p>
  
  <p><strong>Why?</strong></p>
  
  <p>I will have multiple autocompletes on the page and each one will be handled differently on the server side. I have to use another function for the source. Otherwise I would have used a URL + data: a long time ago =p</p>
  
  <p><strong>JQuery Version</strong></p>
  
  <p>jquery-1.9.1</p>
  
  <p><strong>Research</strong></p>
  
  <p>Of course I've been all over this:
  <a href="http://api.jqueryui.com/autocomplete/#option-source" rel="nofollow noreferrer">JQuery API</a></p>
  
  <p><a href="https://stackoverflow.com/questions/6106443/how-to-get-element-id-from-dynamically-generated-form-elements-with-jquery">How to get element Id from dynamically generated form elements with jquery?</a></p>
  
  <p>A lot of these attempts I didn't think would work, but right now I'm at the point of trial and error.</p>
  
  <p><em>$(this).attr('id');</em> - undefined </p>
  
  <p><a href="https://stackoverflow.com/questions/5750895/is-there-a-way-to-get-the-name-of-the-caller-function-within-the-callee">Caller function name</a></p>
  
  <p>I though I'd try to get the caller functions name, and do something with it...doesn't seem to output anything.</p>
  
  <p>Appending to the source function (this is absurd!!! Appending text to a function?! Really I'm desperate...)</p>
  
  <pre><code> $("#inPdVehMk").autocomplete({
              source: autoCompletePost + "field="+$(this).attr('id'),
              minLength: 2,
              select: function(event, ui){
                  alert(ui.label1);
                  alert("value= " + ui.item.value + " id= "+ ui.item.id);
              }
          });
  </code></pre>
  
  <p><strong>Auto Complete Setup</strong></p>
  
  <pre><code>    $("#inPdVehMk").autocomplete({
          source: autoCompletePost,
          minLength: 2,
          select: function(event, ui){
              alert(ui.label1);
              alert("value= " + ui.item.value + " id= "+ ui.item.id);
          }
      });
  </code></pre>
  
  <p><strong>Source function</strong></p>
  
  <pre><code>function autoCompletePost(request, response){
      //alert($(this).attr('id')); //this is where I'm testing to see the ids.
      $.post(AjaxPageAutoComplete, { searchTerm: request.term, field: 'inPdVehMk'}, //I want field to be dynamic depending on the calling selector.
          function(data) {
              var splitData = data.split("%");
              var json = jQuery.parseJSON(splitData[1].toString());
  
              if(data.search('autoCompleteError') !== -1 || data.length &lt; 1){
                  DialogBox('Div_ErrorMessage^Open^autoCompleteError');
              }else{
                  response(json);
              }
          }
      );
  }
  </code></pre>