2012-06-19 4 views
13

Dies ist eine Frage, basierend auf: Trying to get tag-it to work with an AJAX calljQuery TagIt (Autocomplete) Fetching JSON Liste über AJAX

jedoch die oben schafft nur eine Fehlermeldung von ‚this.source ist keine Funktion‘ für mich.

Ich versuche, diese Json-Liste als Tag-Quelle für Tagit über Ajax angezeigt werden. Code unten:

// Tagit 
$("#tags").tagit({  
    tagSource: function() { 
     $.ajax({ 
      url: "/admin/ajax.php?q=fetch_all_tags", 
      dataType: "json", 
      success: function(data) { 
       console.log(data); 
       return data; 
      } 
     }); 
    }  
}); 

Die Ajax-Aufruf zurückkehrt:

{"4":"php","2":"html","3":"css"} 

Antwort

2

Dieser Fehler wurde von mir verursacht es eine alte Version von-Tag. Wenn Sie den gleichen Fehler machen, dass Sie die neueste Version von tagit verwenden

3

Sie sollten wahrscheinlich für den Erfolg Handler so etwas verwenden:

success: function (categoriesList) { 
    response($.map(categoriesList, function (category) { 
     return { 
      label: category.Name + " (ID: " + category.ID + ")", 
      value: category.Name 
     }; 
    })); 
} 

Ich Anzeige Kategorien Objekte, die Identifikation und Name Eigenschaften .

17

Check out this code kann Ihnen helfen,

$("#mytags").tagit({ 
    autocomplete: { 
     source: function(request, response) { 
      /*call api*/ 
     } 
    } 
}); 
+0

Vielen Dank, @rjdmello Ihr Code-Snippet funktioniert perfekt und es ist die beste Antwort hier. – DccBr

+0

melhor resposta. – cura

3

Ich denke, dass Sie die Methode der automatischen Vervollständigung von jQuery UI überschreiben können:

<!-- language: lang-js --> 

$('.tags ul').tagit({ 

    itemName: 'question', 
    fieldName: 'tags', 
    removeConfirmation: true, 
    //availableTags: ["c++", "java", "php", "javascript", "ruby", "python", "c"] 
    allowSpaces: true, 
    // tagSource: ['foo', 'bar'] 
    tagSource: function() { 
     $.ajax({ 
      url: "/autocomplete_tags.json", 
      dataType: "json", 
      data: { 
       term: 'ruby' 
      }, 
      success: function (data) { 
       console.log(data); 
       return data; 
      } 

     }); 
    }, 
    autocomplete: { 
     delay: 0, 
     minLength: 2, 
     source: this.tagSource() 
    } 
}); 
4

Die autocomplete.source außer Kraft gesetzt werden sollten, wenn Sie benutzerdefinierte verwenden möchten Autovervollständigungsquellen, wie eine Ajax/XHR-Antwort.

Zum Beispiel:

$("#myTags").tagit({ 
    autocomplete: { 
     delay: 0, 
     minLength: 2, 
     source : 'your data response' 
    } 
});