2013-10-14 10 views
14

Ich habe die folgende Select2 Konfiguration.Ermöglicht es Select2, den Namen des "Text" -Schlüssels in etwas anderes zu ändern?

$scope.select2Options = { 
    simple_tags: false, 
    placeholder : "Search for a language", 
    multiple : true, 
    contentType: "application/json; charset=utf-8", 
    minimumInputLength : 3, 
    ajax : { 
     url : "/bignibou/utils/findLanguagesByLanguageStartingWith.json", 
     dataType : 'json', 
     data : function(term) { 
      return { 
       language : term 
      }; 
     }, 
     results : function(data, page) { 
      return { 
       results : 
        data.map(function(item) { 
         return { 
          id : item.id, 
          text : item.description 
         }; 
        } 
      )}; 
     } 
    } 
}; 

Dies ermöglicht mir, die select2-Steuerung ordnungsgemäß zu füllen.

jedoch ein Problem tritt auf, wenn ich Ajax verwenden, um die gesamte Form enthält die Tags (unter anderem) zu schreiben: der JSON-Array an den Server gesendet wird, enthält Objekte mit zwei Eigenschaften namens id und text während der Server würde id und description erfordern.

siehe Ausschnitt aus meinem json:

"languages":[{"id":46,"text":"Français"},{"id":1,"text":"Anglais"}] 

select2 für die Änderung des Namens des text auf etwas anderes Gestattet?

Antwort

12

Ändern mein js der folgenden sortiert die Frage:

function format(item) { return item.description; }; 

$scope.select2Options = { 
    simple_tags: false, 
    placeholder : "Search for a language", 
    multiple : true, 
    contentType: "application/json; charset=utf-8", 
    minimumInputLength : 3, 
    data:{ text: "description" }, 
    formatSelection: format, 
    formatResult: format, 
    ajax : { 
     url : "/bignibou/utils/findLanguagesByLanguageStartingWith.json", 
     dataType : 'json', 
     data : function(term) { 
      return { 
       language : term 
      }; 
     }, 
     results : function(data, page) { 
      return { 
       results : 
        data.map(function(item) { 
         return { 
          id : item.id, 
          description : item.description 
         }; 
        } 
      )}; 
     } 
    } 
}; 

Hinweis: man die Select2 Top-Level-Attribut data verwenden hat.

5

Hier ist der blanke Minium der Konfiguration neccesary eine benutzerdefinierte ID und Texteigenschaften auf ui-select2 zu verwenden

$scope.clients: { 
    data: [{ ClientId: 1, ClientName: "ClientA" }, { ClientId: 2, ClientName: "ClientB" }], 
    id: 'ClientId', 
    formatSelection: function (item) { return item.ClientName; }, 
    formatResult: function (item) { return item.ClientName; } 
}