[Chicago] Django + AJAX

[Massimo DiPierro]

There is some JS code in web2py which can be used in Django as well (so do not let the naming convention deter you).
It allows you to do this:

    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>
    <script src="http://web2py.googlecode.com/hg/applications/welcome/static/js/web2py.js"><script>

    <div id="target"><div>

    <script>
       jQuery(function(){web2py_component('http//yourdjangourl.com','target')});
    </script>

It will do a few things for you:
- it will load http//yourdjangourl.com into the target div
- it will capture all form submissions so that, if the target div contains a form and it is submitted it only refreshes the content of that div, and does not reload the entire page. This works great for post back forms like web2py and django use.
- if it finds an http header "web2py-component-flash" in the ajax response it will inject the value in a <div class="flash"></div> if it exist, and flash it.
- if it finds an http header "web2py-component-command" in the ajax response, it will eval() the content (server side, in js). It can be used for example to allow a jailed form submission to break out and force the page reload, or the reload of another web2py_component in the same page.

This has nothing web2py specific and works with any framework. We use it a lot to build modular pages. The page components can be coded using the normal Django actions and templates.  web2py additionally provides helpers to generate the javascript above server side, so that you can build pages in terms of components without js programming at all. But that is another story.

Massimo


On Jun 4, 2012, at 2:26 PM, Kevin Boers wrote:

> +1
> 
> With regard to the 'polling' update of a specific div, I've usually done something like this:
> 
>     <script>
>      $(document).ready(function() {
>       $("#refreshing_div").load("django_view/");
>        var refreshId = setInterval(function() {
>          $("#refreshing_div").load("django_view/");
>        }, 2000);
>        $.ajaxSetup({ cache: false });
>     });
>     </script>
> 
> That will call the django view on document ready, and then again every 2000ms. In this case, the view would return plain html, but you can use a similar method to poll for json and do something with it using callbacks. The jQuery docs are awesome; see load() and getJSON() for examples.
> 
> Kevin
> 
> On Jun 4, 2012, at 1:52 PM, Bob Haugen wrote:
> 
>>> On Mon, Jun 4, 2012 at 1:26 PM, Oren Livne <livne at uchicago.edu> wrote:
>>>> 
>>>> Dear All,
>>>> 
>>>> What is the best practice of creating a django app with ajax? In
>>>> particular, polling (periodically updating a portion of a page) and updating
>>>> a portion upon an event (button click/link click/drop down menu).
>> 
>> Both of the features you mentioned depend mostly on Javascript - not
>> much on Django.  All of the popular js frameworks assist you in doing
>> ajaxy interactions.  The most popular among Django programmers I know
>> is Jquery, but Dojo also has a big Django following.
>> 
>> Besides the other places people suggested for searching, look in:
>> http://groups.google.com/group/django-users/
>> and
>> http://stackoverflow.com/
>> _______________________________________________
>> Chicago mailing list
>> Chicago at python.org
>> http://mail.python.org/mailman/listinfo/chicago
> 
> Kevin P. Boers  
> Senior Manager, Quality Assurance
> 847-440-8381
> 
> Leapfrog Online
> 807 Greenwood
> Evanston, IL  60201
> Main 847-492-1968
> Fax  847-492-1990
> kboers at leapfrogonline.com
> www.leapfrogonline.com
> 
> 
> CONFIDENTIALITY NOTE
> The document(s) accompanying this e-mail transmission, if any, and the e-mail transmittal message containing information from Leapfrog Online Customer Acquisition, LLC is confidential or privileged. The information is intended to be for the use of the individual(s) or entity(ies) named on this e-mail transmission message. If you are not the intended recipient, be aware that any disclosure, copying, distribution or use of the contents of this e-mail is prohibited. If you have received this e-mail in error, please immediately delete this e-mail and notify us by telephone of the error.
> _______________________________________________
> Chicago mailing list
> Chicago at python.org
> http://mail.python.org/mailman/listinfo/chicago

-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://mail.python.org/pipermail/chicago/attachments/20120604/b1910c51/attachment.html>