title: How to get the Jquery Autocomplete result event handler to work?
body: <p>I wrote code that fails to use the <a href="http://docs.jquery.com/Plugins/Autocomplete" rel="nofollow noreferrer">JQuery autocomplete</a> to fire a result function after the user selects something valid (below).</p>
  
  <p>By result, I mean result handler, a function that fires after a good selection happens in the autocomplete plugin.  Documented <a href="http://docs.jquery.com/Plugins/Autocomplete/result#handler" rel="nofollow noreferrer">here</a>.</p>
  
  <p>In my case, I have a form that is really a table where each row is the same, minus the unique ids on the fields: Item1, Qty1, Desc1, then Item2, Qty2, Desc2, and so on.  When the user types in an Item1 code, the Desc1 text should display the English of the item code selected (Item2 -> Desc2, and so on).</p>
  
  <p>I used this code to find all the Item inputs and slap the autocomplete on it.  The result event handler doesn't fire for some reason.  If you notice, I hard coded the "Item1" selection because I haven't figured out how to select the corresponding Desc to the Item where Item1 -> Desc1, Item2 -> Desc2, and so on.</p>
  
  <p>I used the MVC Url.Content only because I happen to get it working.  Someone used Url.Action, which I think is better, just have to figure it out.</p>
  
  <p>Feel free to correct my use as necessary, this is my first time with ASP.NET MVC / JQuery.</p>
  
  <p>Thank you :)</p>
  
  <p>The code:</p>
  
  <pre><code>$(document).ready(function(){
  
    $("input[id^='Item']").autocomplete( "&lt;%= Url.Content("~/products/autocomplete")%&gt;", {
    dataType: 'json',
    parse: function(data) {
        var rows = new Array();
        for( var i = 0; i&lt;data.length; i++)
        {   rows[i] = {data:data[i], value:data[i].name, result:data[i].id }; }
        return rows;
    },
    formatItem: function(row, i, n) {
              return row.id + ' - ' + row.name;
          },
    selectFirst: true,
    //autoFill: true,
    minChars: 2,
    max: 30,
    autoFill: true,
    mustMatch: true,
    matchContains: false,
    scrollHeight: 100,
    width: 300,
    cacheLength: 1,
    scroll: true
    });
  
    $("Item1").result(function(event, data, formatted) {
        $("Desc1").html( !data ? "No match!" : "Selected: " + formatted);
    });
  });
  </code></pre>