applegrew / django-select2

This is a Django integration for Select2

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

js config file

psk007 opened this issue · comments

Goal
Ajax URL is not used in my AJAX submits.
Problem
I have a problem with django_select2.js config file. I create a ModelForm and used ModelSelect2Widget in my form and after rendering form in template everything works correct. But when I want to search something in my select2 box, Ajax request for getting QuerySet isn't passed to AutoResponseView and passed to my current view URL.
I checked the form elements in the template and found that the elements had the correct Ajax address.
Code Snippet

<select name="recipients" data-minimum-input-length="2" data-allow-clear="false" data-ajax--url="/select2/fields/auto.json" data-ajax--cache="true"
        data-ajax--type="GET" class="m-b-10 django-select2 django-select2-heavy select2-hidden-accessible" style="width: 95%" required=""
        id="id_recipients" data-field_id="MTM5ODY0NDAyOTM3MjY0:1j70z4:WHl1YndGyv1iO2CS1UB61lQ3nsY" multiple="" data-select2-id="id_recipients"
        tabindex="-1" aria-hidden="true">
</select>

I checked the js config file for a django_select2 and found no URL for the Ajax in the initHeavy function. I tried to experiment with it myself and after that the problem was resolved. But it's not right and I want to know if there is any other solution?

 var initHeavy = function ($element, options) {
    var settings = $.extend({
      ajax: {
        url:'/select2/fields/auto.json',// i added this url manulay
        data: function (params) {
          var result = {
            term: params.term,
            page: params.page,
            field_id: $element.data('field_id')
          }

          var dependentFields = $element.data('select2-dependent-fields')
          if (dependentFields) {
            dependentFields = dependentFields.trim().split(/\s+/)
            $.each(dependentFields, function (i, dependentField) {
              result[dependentField] = $('[name=' + dependentField + ']', $element.closest('form')).val()
            })
          }

          return result
        },
        processResults: function (data, page) {
          return {
            results: data.results,
            pagination: {
              more: data.more
            }
          }
        }
      }
    }, options)

Hi @psk007,

thanks for reaching out. Select 2 supports setting the AJAX URL, among other things, via data-attributes, see also https://select2.org/configuration/data-attributes

Everything should work fine, by default. The only thing I can think of, is that you are using a very old version of jQuery. Can you maybe send me some information about your stack? jQuery version, Select2 version, Django version, etc?

Best
-Joe

Hi dear ,
Thanks for your response . My problem was resolved by your guide . The stack information are below:

Django : 3.0.3
Select2 : 4.0.6 (full js vesion) 
JQuery : 3.2.1

So i upgrade select2 to latest version (4.0.13) and the problem was solved 😁.

Perfect, if you have any suggestions on how to improve the documentation, please let me know.