Select2 - Pass back additional data via ajax call
<p>Ok, I feel like I'm going crazy here.  I'm using the select2 jquery plugin (version 4), and retrieving data via ajax.  So you can type in a name, and it will return that contact information. But I also want to return what organization that contact is a part of.</p>

<p>Here is my select2 initialization:</p>

<pre><code>$('#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
});
</code></pre>

<p>And here is the data I'm returning (laravel framework):</p>

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

return response()-&gt;json($results);
</code></pre>

<p>So isn't 'org' supposed to be attached to either the created option or select element by select2? So I could do something like <code>$('#contact_id').select2().find(':selected').data('data').org</code> or <code>$('#contact_id').select2().data('data').org</code> or something like that?</p>

<p>Idealistically, this would look like:</p>

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

<p>I swear I confirmed this worked last week, but now it's completely ignoring that org property.  I have confirmed that the json data being returned does include org with the proper org_id and org_name. I haven't been able to dig anything up online, only this snippet of <a href="https://select2.github.io/options.html#what-properties-are-required-on-the-objects-passed-in-to-the-ar" rel="noreferrer">documentation</a>:</p>

<blockquote>
  <p>The id and text properties are required on each object, and these are the properties that Select2 uses for the internal data objects. Any additional paramters passed in with data objects will be included on the data objects that Select2 exposes.</p>
</blockquote>

<p>So can anyone help me with this? I've already wasted a couple hours on this.</p>

<p><strong>EDIT:</strong> Since I haven't gotten any responses, my current plan is to use the <code>processResults</code> callback to spawn hidden input fields or JSON blocks that I will reference later in my code.  I feel like this is a hacky solution given the situation, but if there's no other way, that's what I'll do. I'd rather that than do another ajax call to get the organization. When I get around to implementing it, I'll post my solution.</p>