Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to set up Django website with jQuery

Tags:

jquery

django

I don't know why, but I couldn't figure out how to activate jQuery on my website. All sites doing tutorials 'Starting jQuery on Django' started with JQuery already working on their site. Anyway, instead of downloading it and putting it in my folder somewhere, I decided to go the cheat-way and use Google's. Therefore, in my base page, I had the following piece of code

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js">
</script>

And everything worked great, until I had to add some libraries. How do I set up my own jQuery so that it works with my templates?

like image 913
SaiyanGirl Avatar asked Aug 20 '12 03:08

SaiyanGirl


People also ask

Can I use jQuery with Django?

Inside your settings.py file make sure that django. contrib. staticfiles is under INSTALLED_APPS (it is there by default). And now you can use jQuery throughout your site!

Can I use Django and JavaScript together?

Talking about the future web apps, Django has a lot to offer and has the ability to accommodate any modern web apps structures. Stacking Django and Javascript web frameworks to build modern web apps is one of the best way to stack backend and frontend frameworks.

How do I post with jQuery AJAX in Django?

On submitting the form, serialize the form data and create an AJAX POST request, then send it to the server. On successful request, append the row to the table. Note we have used the revered URL , which is discussed in the urls.py section. This helps you not to write the URL path in a hardcoded way.

Can you use AJAX with Django?

Using Ajax in Django can be done by directly using an Ajax library like JQuery or others. Let's say you want to use JQuery, then you need to download and serve the library on your server through Apache or others. Then use it in your template, just like you might do while developing any Ajax-based application.


3 Answers

In the end, it turned out to be very easy. This is all one has to do:

First, make a folder named static inside your folder app:

mySite
---mytemplates
---mySite
---myApp
------static

Then download jQuery from their site here. You click 'Download' and it will take you to a different page with all the code. Left click on the code and select 'save as...'. Save it in the static folder.

Inside your settings.py file make sure that django.contrib.staticfiles is under INSTALLED_APPS (it is there by default).

Lastly, inside your base page have

<script type="text/javascript" src="{{ STATIC_URL }} /static/jquery-1.8.0.js">
</script> 
//Make sure that the jQuery name is correct. With updates and different versions, 
//the number after 'jquery' will change 

And now you can use jQuery throughout your site! (as long as the pages extend your basepage. If they don't, they will need the above piece of code in their html.)

This works for me while working on my local machine. I haven't tried actually deploying my site yet, so I hope this will still work.

like image 140
SaiyanGirl Avatar answered Oct 18 '22 06:10

SaiyanGirl


You can also just pip install django-jquery, and put jquery in INSTALLED_APPS. Of course, you need to run collectstatic as always after. :)

That way you can just have it in your requirements.txt file if you use one.

like image 26
odinho - Velmont Avatar answered Oct 18 '22 05:10

odinho - Velmont


You may also use the python package django-static-jquery. For the moment, it comes with the more recent jquery libraries.

pip install django-static-jquery=='version'. Package & installation info here https://pypi.python.org/pypi/django-static-jquery/

Looks like the other package django-jquery not been updated in a while.

like image 5
Snowrabbit Avatar answered Oct 18 '22 05:10

Snowrabbit