Select2 - Zusätzliche Daten über Ajax-Anruf zurückgeben

Question

Ok, ich fühle mich, als würde ich hier verrückt werden. Ich benutze das select2 jquery plugin (Version 4) und lade Daten über Ajax herunter. Sie können also einen Namen eingeben und diese Kontaktinformationen zurückgeben. Aber ich möchte auch zurückgeben, zu welcher Organisation dieser Kontakt gehört.

Hier meine select2 Initialisierung ist:

$('#contact_id').select2({ 
    ajax: { 
     url: 'example.com/contacts/select', 
     dataType: 'json', 
     delay: 250, 
     data: function (params) { 
      return { 
       q: params.term, 
       page: params.page 
      }; 
     }, 
     processResults: function (data) { 
      return { 
       results: data 
      }; 
     }, 
     cache: true 
    }, 
    minimumInputLength: 3, 
    maximumSelectionLength: 1 
}); 

Und hier ist die Daten-I (Laravel Framework) bin Rückkehr:

foreach($contacts as $con) { 
    $results[] = [ 
     'id' => $con->contact_id, 
     'text' => $con->full_name, 
     'org' => [ 
      'org_id'  => $con->organization_id, 
      'org_name'  => $con->org_name 
     ] 
    ]; 
} 

return response()->json($results); 

also nicht 'org' ist angeblich zu befestigenden entweder die erstellte Option oder wählen Sie Element durch select2? Also könnte ich etwas wie $('#contact_id').select2().find(':selected').data('data').org oder $('#contact_id').select2().data('data').org oder etwas ähnliches tun?

idealistisch, würde dies wie folgt aussehen:

<select> 
    <option value="43" data-org="{org_id:377, org_name:'Galactic Empire'}">Darth Vader</option> 
</select> 

Ich schwöre, dass ich bestätigt diese letzte Woche gearbeitet, aber jetzt ist es völlig, dass org Eigenschaft zu ignorieren. Ich habe bestätigt, dass die zurückgegebenen JSON-Daten eine Organisation mit der richtigen org_id und org_name enthalten. Ich habe nicht in der Lage gewesen, etwas online zu graben, nur dieses Snippet documentation:

Die ID und Texteigenschaften für jedes Objekt erforderlich sind, und das sind die Eigenschaften, die Select2 für die internen Datenobjekte verwendet. Alle zusätzlichen Parameter, die mit Datenobjekten übergeben werden, werden in den Datenobjekten enthalten, die von Select2 verfügbar gemacht werden.

Also kann mir jemand dabei helfen? Ich habe schon ein paar Stunden damit verschwendet.

EDIT: Da ich keine Antworten bekommen haben, meine aktuellen Plan ist es, die processResults Rückruf zu verwenden versteckte Eingabefelder oder JSON-Blöcke, um zu laichen, die ich später in meinem Code verweisen wird. Ich denke, dass dies eine hacky Lösung ist angesichts der Situation, aber wenn es keinen anderen Weg gibt, werde ich das tun. Das wäre mir lieber, als einen weiteren Ajax-Anruf zu machen, um die Organisation zu bekommen. Wenn ich es umsetze, poste ich meine Lösung.

Answer 1

Kann mich nicht erinnern, was ich falsch gemacht habe, aber mit processResults(data), Daten enthält die vollständige Antwort. In meiner Implementierung unten, Zugriff auf diese Informationen, wenn ein Element ausgewählt ist:

$('#select2-box').select2({ 
    placeholder: 'Search Existing Contacts', 
    ajax: { 
     url: '/contacts/typeahead', 
     dataType: 'json', 
     delay: 250, 
     data: function(params){ 
      return { 
       q: params.term, 
       type: '', 
       suggestions: 1 
      }; 
     }, 
     processResults: function(data, params){ 
      //Send the data back 
      return { 
       results: data 
      }; 
     } 
    }, 
    minimumInputLength: 2 
}).on('select2:select', function(event) { 
    // This is how I got ahold of the data 
    var contact = event.params.data; 

    // contact.suggestions ... 
    // contact.organization_id ... 
}); 



// Data I was returning 
[ 
    { 
     "id":36167, // ID USED IN SELECT2 
     "avatar":null, 
     "organization_id":28037, 
     "text":"John Cena - WWE", // TEXT SHOWN IN SELECT2 
     "suggestions":[ 
      { 
       "id":28037, 
       "text":"WWE", 
       "avatar":null 
      }, 
      { 
       "id":21509, 
       "text":"Kurt Angle", 
       "avatar":null 
      }, 
      { 
       "id":126, 
       "text":"Mark Calaway", 
       "avatar":null 
      }, 
      { 
       "id":129, 
       "text":"Ricky Steamboat", 
       "avatar":null 
      }, 
      { 
       "id":131, 
       "text":"Brock Lesnar", 
       "avatar":null 
      } 
     ] 
    } 
] 

Answer 2

nicht für jetzt kommentieren (niedrige Ruf) .. so ... beantworten zu glatt:

Inklusive Zusatzdaten (v4.0):

processResults: function (data) { 
    data = data.map(function (item) { 
     return { 
      id: item.id_field, 
      text: item.text_field, 
      otherfield: item.otherfield 
     }; 
    }); 
    return { results: data }; 
} 

Lesen der Daten: