title: Select2 parameter for templateResult and templateSelection different (django)
body: <p>I've got a strange problem. I have a product select element item in my web application. Because there are quite many products in the database I've decided to load them dynamically with select2. The issue is that I want to pass an additional parameter (Unit) that would be displayed opposite the select box. So to find a product i use Django as backend and my method looks like this.</p>
  
  <pre><code>class FindProductAjaxView(AjaxableResponseMixin, CreateView):
      model = Product
      form_class = ProductForm
  
      def get_ajax(self, request, *args, **kwargs):
          query = request.GET.get('q', None)
          if query:
              products = Product.objects.filter(name__icontains=query).values(
                  "pk", "name", "unit")
              results = list(products)
              return JsonResponse(data={'items': results}, safe=False)
          else:
              return JsonResponse(data={'success': False,
                                        'errors': 'No mathing items found'})
  </code></pre>
  
  <p>So it returns the pk, name and unit fields correctly. Here is the script I use to create my select2 product inputs.</p>
  
  <pre><code>&lt;script&gt;
      function initProductSelect2 (select) {
          select.select2({
              placeholder: "Wyszukaj...",
              ajax: {
                  url: '/recipes/find_product',
                  dataType: 'json',
                  delay: 250,
                  language: 'pl',
                  data: function (params) {
                    return {
                      q: params.term, // search term
                      page: params.page
                    };
                  },
                  processResults: function (data) {
                      data = data.items.map(function (item) {
                          return {
                              id: item.pk,
                              text: item.name,
                              name: item.name,
                              unit: item.unit
                          };
                      });
                      return { results: data };
                  },
                  cache: true
            },
            escapeMarkup: function (markup) { return markup; },
            minimumInputLength: 1,
            templateResult: formatItem,
            templateSelection: formatItemSelection
          });
          select.siblings('span').find('.select2-selection').addClass('form-control');
      }
  
      function formatItem (item) {
          console.log(item)
          if (item.loading) return item.name || item.text;
          var markup = '&lt;div class="clearfix" data-unit=' + item.unit + '&gt;' + item.name + '&lt;/div&gt;';
          return markup;
      }
  
      function formatItemSelection (item) {
          console.log(item);
          return item.name || item.text;
      }
  &lt;/script&gt;
  </code></pre>
  
  <p>The issue lies within the <code>formatItem</code> and <code>formatItemSelection</code> methods. The item that is passed to <code>formatItem</code> is OK. It has all the fields I need (pk, name, unit). But the item that comes into <code>formatItemSelection</code> has only id and text fields.</p>
  
  <p>I've been struggling with this issue for several hours but I have no idea. I tried (as you see in the code) to pass the unit parameter as a jQuery data element but I have no clue how to retrieve it. The finest solution would be if the item passed to <code>formatItemSelection</code> would have all the fields passed from the controller (pk, name, unit). </p>
  
  <p>Thanks in advance !</p>
  
  <p>EDIT: I use select2 in the newest version 4.0.3</p>