Bootstrap-Multiselect und $.ajax-Anfragen mit verschachtelten Objekten

Ich bin kämpfen, um $.ajax-GET-nested-Objekte dynamisch und senden die Daten an Bootstrap Multiselect dropdown-Optionen wählen. Ähnlich wie ..
Problem mit Daten der Rückkehr aus dem AJAX-Aufruf zeigt sich in der Bootstrap-Multiselect dropdown
bootstrap multiselect funktioniert nicht auf api-json-binden im Ajax-Aufruf in jquery

Konkreter, ich will multi wählen Sie das Objekt "Unternehmen" aus data.php (mit DataTable Editor):

{"data":[{"DT_RowId":"row_1","company":"FirstCompany","webtechnology":"Contao",...},
{"DT_RowId":"row_2","company":"SecondCompany","webtechnology":"Wordpress",...},
{"DT_RowId":"row_3","company":"ThirdCompany","webtechnology":"Custom",...},
{"DT_RowId":"row_4","company":"FourthCompany","webtechnology":"TYPO3 CMS",...}],"options":[],"files":[]}

Jedes Unternehmen besteht, mehrere Male und es ist über 1000 Zeilen.

Das ist mein Aktuelles setup: 

<html>
<select class="select-ajax form-control" placeholder="Entity Status" multiple="multiple"></select>
</html>

<script>
var company;

$(document).ready(function() {

$('.select-ajax').multiselect({
    maxHeight: 400,
    buttonWidth: '100%',
    includeSelectAllOption: true,
    enableFiltering: true
}); 

$.ajax({
  type: 'GET',
  url: '/data.php',
  dataType: 'json',
  success: function(data) {
     $.each(data, function (i, item) {
         company = item.company;
         $('.select-ajax').append('<option value="' + item.company + '">' + item.company + '</option>');
         console.log(item)
    });
    $('.select-ajax').multiselect('rebuild');
  },
  error: function() {
        alert('error loading items');
  }
 });

$('.select-ajax').trigger( 'change' );

}); 
</script>

Die Konsole.log() zeigt die folgende Ausgabe: 

[Object { DT_RowId="row_1",  company="FirstCompany",  webtechnology:"Contao",  more...}, 
Object { DT_RowId="row_2",  company="SecondCompany",  webtechnology:"Wordpress",  more...}, 
Object { DT_RowId="row_3",  company="ThirdCompany",  webtechnology:"Custom",  more...}, 
Object { DT_RowId="row_4",  company="FourthCompany",  webtechnology:"TYPO3 CMS",  more...}, 46 more...]

InformationsquelleAutor Philipp M | 2016-03-01

  1. 1

    Die variable "Daten" haben Sie die komplette ajax-Antwort {"data":[..........]}.
    wir müssen iterieren, die Werte in "Daten" - Taste in der Antwort. So müssen Daten".Daten", die auf die eigentlichen JSON-array in der Antwort zum füllen der dropdown -
    Im inneren Erfolgs-handler zu ändern versuchen

        $.each(data, function (i, item)
                 to
    $.each(data.data, function (i, item)

    Zu vermeiden, doppelte Einträge müssen Sie eine Prüfung vor dem drücken der data-dropdown-Menü. So endlich der code, der in Erfolgs-handler sollte so Aussehen wie das unten.

    $.each(data.data, function (i, item) {
     company = item.company;
     if($(".select-ajax option[value='"+item.company+"']").length == 0){
        $('.select-ajax').append('<option value="' + item.company + '">' + item.company + '</option>');
     }
});

    Demo

    Das funktionierte, danke. Doch, ich bekomme alle Datensätze aus der Spalte nicht nur das einzigartige lieben. Wie kann ich vermeiden, dublicates in das dropdown? Und, ich habe ein anderes multi wählen, wo die option Werte (über 100) sind in einer 500000 Zeilen-Tabelle. Dort bekomme ich ein "NetworkError: 500 Internal Server Error" und die Objekte nicht geladen. Ist die Datei einfach zu groß oder wie könnte ich das in diesem Fall?
    Ich aktualisiert meine Antwort, um das hinzufügen von Duplikaten. Bitte überprüfen Sie und markieren Sie es als Antwort auf einen Klick das Häkchen.
    Auch Philipp, deine zweite Anforderung auf 500000 Zeile der Tabelle ist nicht klar. Können Sie bitte erläutern. Wenn du immer "NetworkError: 500 Internal Server Error", dann sollte es back-end-server-Problem. Aber wenn Sie versuchen, um 5000000 Zeilen über einzelne ajax, dann auf jeden Fall müssen Sie die Logik zum abrufen von max von 100 oder 200 Zeilen über einzelne ajax-call.
    Genial. Die doppelte Lösung funktioniert perfekt als gut. Im Falle der 500000 Zeilen, die ich jetzt reduziert von json in das backend, indem Sie die Filter nur distincts in eine andere Tabelle. So nun funktioniert das auch. Ich habe einen anderen Wunsch, obwohl, basierend auf der obigen Lösung von dir, wie kann ich die Sortierung der Optionen in der dropdown alphabetisch? Ohne zu wissen, ob ich auf der rechten Spur, ich war auf der Suche z.B. auf dem stackoverflow.com/questions/12073270/...
    Keine Ahnung, wie das Sortieren der Liste wählen Sie alphabetisch?

    InformationsquelleAutor Nofi

Schreibe einen Kommentar