2013-10-17 8 views
5

Sto utilizzando JQuery 1.8.3 e JQuery UI 1.8.24.Completamento automatico interfaccia utente JQuery: .data (...) non è definito [ma solo quando aggiungo una seconda casella di completamento automatico]

Questo è il codice, che funziona bene:



    $(function() { 
     $("#").autocomplete({ 
      source: function (request, response) { 
       $.ajax({ 
        url: '', type: "POST", dataType: "json", 
        data: { searchPattern: request.term }, 
        cache: false, 
        success: function (data) { 
         response($.map(data, function (item) { 
          return { label: item.Label, value: item.Value, id: item.Id, description: item.Description } 
         })) 
        } 
       }); 
      }, 
      delay: 300, 
      minLength: 2, 
      autoFocus: true 
     }) 
     .data("autocomplete")._renderItem = function (ul, item) { 
      return $("li>/li>") 
      .data("ui-autocomplete-item", item) 
      .append("a>" + item.label + "br>div style=\"font-size:x-small;font-style:italic;\">" + item.description + "/div>/a>") 
      .appendTo(ul); 
     }; 
    }); 

Ma se aggiungo una seconda casella di testo per il codice HTML, copiare il JavaScript sopra e cambiare il selettore e l'URL (quindi alla fine ho due completamento automatico caselle di testo), quindi ottengo il seguente errore per la seconda completamento automatico:

TypeError: $(...).autocomplete(...).data(...) is undefined 

con un completamento automatico funziona perfettamente, ma con un secondo non non riesco a spiegare il perché. Qualcuno può aiutarmi?

Grazie in anticipo!

Toby

EDIT:

ho trovato il problema.

Il codice JavaScript è in un file * .js e le due caselle di testo sono in due diversi file * .thml.

Quindi c'è solo una casella di testo alla volta e questo è il problema.

ora faccio l'ultima parte (con i dati (...)) nel file * .html e funziona benissimo:

$("#selector").autocomplete().data("autocomplete")._renderItem = renderItem; 

Grazie per il vostro aiuto!

+0

Il markup non è valido in 'return $ (" li>/li> ")'. È un errore di battitura? Questo potrebbe sicuramente causare problemi. –

+0

Sì, lo so. Questo solo perché non sapevo come pubblicare tag HTML su stackoverflow.com. Quindi decido di rimuovere il primo "<". – Toby

+0

@Toby: si incolla il codice, lo si seleziona e quindi si preme Ctrl + K. Tada! –

risposta

6

c'era un change in the data key naming convention in UI 1.9

jQuery 1.9/1.10 estratto la chiave autocomplete e ha aggiunto uiAutocomplete

.data("uiAutocomplete") 

Si prega di notare: in base alla documentazione più recente (v1.10.x) dovrebbe essere. dati ("ui-autocomplete") (vedi: http://jqueryui.com/autocomplete/#custom-data)

+0

Grazie, ma l'ho già provato. Sto anche usando JQuery 1.8.3 e JQuery UI 1.8.24. – Toby

+0

@Perché il tuo selettore '$ (" # ")' potrebbe anche essere un problema ... sembra che tu abbia perso ID dopo '#' –

+0

Grazie! Ho trovato il problema, vedi sopra. Grazie per l'aiuto! – Toby

1

L'altro giorno, ho riscontrato lo stesso problema, ma non aveva nulla a che fare con la versione che stavo usando ma semplicemente che l'elemento non era completo! Prova

alert($('...').length); 

e assicurati che non sia zero.

0

È possibile implementare la linea di seguito menzionato

.autocomplete ("istanza") ._ renderItem = function (ul, item) {

istituirne di

.data ("completamento automatico")._renderItem = function (ul, item) {

secondo la documentazione disponibile sul sito Jquery JQuery AutoComplete Funtionality troverete questo codice.

dalla versione aggiornata di jquery 1.10 hanno apportato modifiche nel codice. spero che questo ti possa aiutare.