Skip to content

Django-Select2 does not work. #34

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closed
bguerrero5 opened this issue May 10, 2019 · 11 comments
Closed

Django-Select2 does not work. #34

bguerrero5 opened this issue May 10, 2019 · 11 comments
Labels
Q&A Questions and answers

Comments

@bguerrero5
Copy link

Hi,

I implemented django-bootstrap-modal-forms and for some reason django-select2 drop down does not work. By any chance would you have a work around to make django-select to work with django-bootstrap-modal-forms?

@trco trco added the Q&A Questions and answers label May 11, 2019
@trco
Copy link
Owner

trco commented May 11, 2019

@bguerrero5 I don't know how django-select2 implements select2 but you could load select2 js and css, select your dropdown within the script living in your form's html and run .select2() on it.

<form method="post" action="">
  {% csrf_token %}

  <div class="modal-header">
    ...
  </div>

  <div class="modal-body">
    {% for field in form %}
      ...
    {% endfor %}
  </div>

  <div class="modal-footer">
    ...
  </div>
</form>

<script type="text/javascript">
  $(function () {
     $(".your-class").select2();
  });
</script>

@bguerrero5
Copy link
Author

Thank for the fast response @trco. It is still not working. I am not sure whats causing the problem. I am also using crispy froms. Do you think that could be the problem?

@trco
Copy link
Owner

trco commented May 13, 2019

@bguerrero5 You should provide some error log or code so I can see what's happening. It's hard to debug on ''for some reason django-select2 drop down does not work''.

@bguerrero5
Copy link
Author

@trco well I am not getting any error with my interpreter. But, in the console at the browser developer tools i can see a couple of error with the java-script. Attached you can find some screenshots of this errors. The screenshots have been uploaded in the order they appear in the browser.

ScreenShoot1
Screenshot
Screenshot2
Screenshot3
Screenshot4
Screenshot5

@trco
Copy link
Owner

trco commented May 13, 2019

@bguerrero5 Is it possible that you didn't include select2 js and css files together with my proposed solution? You're calling select2 function on an element, but the function obviously doesn't exist.

@bguerrero5
Copy link
Author

@trco yeah, i am calling the select2 function. it looks like this. I am not really good with java-script but i believe it is right.

{% load static %}
{% load crispy_forms_tags %}

{% csrf_token %}
{{ title }}
×
{% crispy form %}
<script type="text/javascript"> $(function () { $("#id_destination_ou").select2(); }) </script>

@bguerrero5
Copy link
Author

Sorry, here is a better screenshot.

code

@trco
Copy link
Owner

trco commented May 13, 2019

@bguerrero5 You should load js and css for select2. Either download it to your static folder and link to it or link to select2 cdns as written in their docs.

<link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.7/css/select2.min.css" rel="stylesheet" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.7/js/select2.min.js"></script>

@bguerrero5
Copy link
Author

@trco when i load the js and ccs for select2, it still not works. But now i get a different error at the console.

Screenshot

@trco
Copy link
Owner

trco commented May 22, 2019

@bguerrero5 Unfortunately I can't conclude anything from that. I still suggest you to try out select2 without django-select2. Load js and css and than instantiate select2 on fields you get by their ids.

@trco
Copy link
Owner

trco commented May 29, 2019

Closing due to inactivity.

@trco trco closed this as completed May 29, 2019
@trco trco changed the title Djanog-Select2 does not work. Django-Select2 does not work. May 29, 2019
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Q&A Questions and answers
Projects
None yet
Development

No branches or pull requests

2 participants