Come ottenere il gestore di eventi risultato Jquery Autocomplete di lavorare?

Question

Ho scritto il codice che non riesce a utilizzare la JQuery completamento automatico per sparare una funzione risultato dopo la utente seleziona qualcosa di valido (in basso).

Per conseguenza, intendo gestore di risultati, una funzione che gli incendi, dopo una buona selezione avviene nel plugin di completamento automatico. qui .

Nel mio caso, ho una forma che è in realtà una tabella in cui ogni riga è lo stesso, meno gli ID univoci sui campi: Item1, Qty1, desc1, poi Item2, Qty2, Desc2, e così via. Quando l'utente digita un codice Item1, il testo desc1 dovrebbe visualizzare Inglese del codice articolo selezionato (Item2 -> Desc2, e così via).

Ho usato questo codice per trovare tutti gli ingressi elemento e uno schiaffo al completamento automatico su di esso. Il gestore di eventi risultato non si attiva per qualche motivo. Se notate, io hard coded la selezione "Item1" perché non ho capito come selezionare corrispondente Desc alla voce dove Item1 -> desc1, Item2 -.> Desc2, e così via

Ho usato il MVC Url.Content solo perché mi capita di farlo funzionare. Qualcuno utilizzato Url.Action, che credo sia meglio, non resta che capire.

Sentitevi liberi di correggere il mio uso, se necessario, questa è la mia prima volta con ASP.NET MVC / JQuery.

Grazie:)

Il codice:

$(document).ready(function(){

  $("input[id^='Item']").autocomplete( "<%= Url.Content("~/products/autocomplete")%>", {
  dataType: 'json',
  parse: function(data) {
      var rows = new Array();
      for( var i = 0; i<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);
  });
});

Answer 1

$(document).ready(function(){

    $("input[id^='Item']").autocomplete( "<%= Url.Content("~/products/autocomplete")%>", {
            dataType: 'json',
            parse: function(data) {
                var rows = new Array();
                for( var i = 0; i<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
    }).result(function(event, data, formatted) {
        var n = $(this).attr("id").match(/\d+/);
        var b = $("span[id='Desc"+n+"']")
        b.html( !data ? "No match!" : "Selected: " + formatted);
    });
});