This was a bit tricky so I'm documenting how to get AJAX working and talking between a DJANGO view in python and Prototype.js framework running in your template. If you're following the Prototype examples on their website you won't quite have success. I suspect that is because the headers passed by DJANGO are not what prototype expects to do the auto-parse.

So lets do this -- GOAL: send a dictionary to your view from your .html template. Retrieve parameters passed to the view and access them. Then turn around and send a JSON encoded response to a prototype callback and retrieve the JSON encoded variables.

I'm assuming you have prototype.js installed (quite simple take a look at the link).

In your Template you will need to initiate the AJAX request. In my case what I've done is initiate the request via an onclick event:

CODE:
    
   myObject.onclick = inputClickHandler;

        function inputClickHandler(e){
            e = e||window.event;
            var tdElm = e.target||e.srcElement;
            myParameters = { msg  : 'you are FRIGGIN smart', number: 12}
            // This is the start of my AJAX Switcher
            new Ajax.Request('/myApp/myAJAXhandler/', {
                method: 'post', parameters: myParameters,
                onSuccess: function (transport) {
                    var response = transport.responseText || "no response text";
                    data = response.evalJSON();
                    alert('Success!!  ' + data["message"] );
                },
                onFailure: function () {
                    alert('Something went wrong...');
                }
            });
        }
  
    

OK -- so this follows the basic tutorial on the prototype.js website where I'm passing a small dictionary to my view via the parameter statement. Make sure that you edit your urls.py file to include a new line that points to your AJAX handler:

CODE:
    
 urlpatterns = [
        url(r'^$', views.index, name='appHome'),
        url(r'^myAJAXhandler/$', views.myAJAXhandler, name='handleAJAX')
]
    

on the views.py side - you need to write a handler that gets called above parses and then returns some JSON. Here's how you do that (this is a function in views.py):

CODE:
    
from django.http import JsonResponse

def myAJAXhandler(request):
    if request.method == 'POST':
        if 'msg' in request.POST:
           msgMessage = request.POST['msg']
            return JsonResponse({"message": msgMessage})
    return JsonResponse({"message" : 'FAILLLLLL!!!!!!'})

    

You can insert JsonResponse returns after the if request.method to confirm you're getting POST data then remove it also you can put one after if 'msg' to confirm the variable data is being passed.

if everything works you will see a JSON encoded repsonse reflecting the data in your msg variable which is now associated with the 'message' key in the returned dictionary. Worst case if all fails you will see the fail message.

If you are getting the default failure alert however (ie no success message) -- its becuase you are not connecting with the function in your views.py -- not due to some logic error. Open a web browser and make sure the link comes up ie...go to http://www.yoursite.com/myApp/myAJAXhandler to make sure there aren't problems.

Tommy

Navigate

This was a bit tricky so I'm documenting how to get AJAX working and talking between a DJANGO view in python and Prototype.js framework running in your template. If you're following the Prototype examples on their website you won't quite have success. I suspect that is because the headers passed by DJANGO are not what prototype expects to do the auto-parse.

So lets do this -- GOAL: send a dictionary to your view from your .html template. Retrieve parameters passed to the view and access them. Then turn around and send a JSON encoded response to a prototype callback and retrieve the JSON encoded variables.

I'm assuming you have prototype.js installed (quite simple take a look at the link).

In your Template you will need to initiate the AJAX request. In my case what I've done is initiate the request via an onclick event:

CODE:
    
   myObject.onclick = inputClickHandler;

        function inputClickHandler(e){
            e = e||window.event;
            var tdElm = e.target||e.srcElement;
            myParameters = { msg  : 'you are FRIGGIN smart', number: 12}
            // This is the start of my AJAX Switcher
            new Ajax.Request('/myApp/myAJAXhandler/', {
                method: 'post', parameters: myParameters,
                onSuccess: function (transport) {
                    var response = transport.responseText || "no response text";
                    data = response.evalJSON();
                    alert('Success!!  ' + data["message"] );
                },
                onFailure: function () {
                    alert('Something went wrong...');
                }
            });
        }
  
    

OK -- so this follows the basic tutorial on the prototype.js website where I'm passing a small dictionary to my view via the parameter statement. Make sure that you edit your urls.py file to include a new line that points to your AJAX handler:

CODE:
    
 urlpatterns = [
        url(r'^$', views.index, name='appHome'),
        url(r'^myAJAXhandler/$', views.myAJAXhandler, name='handleAJAX')
]
    

on the views.py side - you need to write a handler that gets called above parses and then returns some JSON. Here's how you do that (this is a function in views.py):

CODE:
    
from django.http import JsonResponse

def myAJAXhandler(request):
    if request.method == 'POST':
        if 'msg' in request.POST:
           msgMessage = request.POST['msg']
            return JsonResponse({"message": msgMessage})
    return JsonResponse({"message" : 'FAILLLLLL!!!!!!'})

    

You can insert JsonResponse returns after the if request.method to confirm you're getting POST data then remove it also you can put one after if 'msg' to confirm the variable data is being passed.

if everything works you will see a JSON encoded repsonse reflecting the data in your msg variable which is now associated with the 'message' key in the returned dictionary. Worst case if all fails you will see the fail message.

If you are getting the default failure alert however (ie no success message) -- its becuase you are not connecting with the function in your views.py -- not due to some logic error. Open a web browser and make sure the link comes up ie...go to http://www.yoursite.com/myApp/myAJAXhandler to make sure there aren't problems.

Tommy