[Django]-Django – Posting jQuery dictionary via Ajax prints None in views.py

by

5👍

✅

As far as I know you can not send a JavaScript object as payload in a HTTP request. After all JavaScript constists out of more than only dictionaries, integers, strings, etc. How would you for example transfer a function to the server? How is the server supposed to handle that?

What you thus need is some sort of format: a way to encode the data to a type that can be used as payload: a string. Now standard JavaScript objects have a popular format: the JavaScript Object Notation, or in short JSON.

We can thus encode the dict entry to a JSON string with JSON.stringify(..):

$('#btn-submit').click(function(e){
  e.preventDefault();
  var btn = $(this);
  var dataUrl = btn.attr('data-href');
  var title = $('#title').val();
  var dict = {};
  $('.choice-m2m-check').each(function(i){
    k = $(this).val();
    v = $(this).attr('data-value');
    dict[k] = v;
  });
  $.ajax({
    url:dataUrl,
    method:'POST',
    data:{
      'title': title,
      'dict': JSON.stringify(dict),
    },
    success:function(data){
      if (data.saved){
        ...
      }
    },
    error:function(error){
      ...
    }
  });
});

Now of course the Django backend will not automatically transfer this into Python objects: it sees a string and hence handles it as a string. But JSON can be decoded in vanilla Pyhon objects (a dict, bool, etc.) with json.loads:

from json import loads as jsonloads

def my_view(request):
    mydict = jsonloads(request.POST.get('dict'))
    # process mydict
    # ...
    pass
👤willeM_ Van Onsem

0👍

Error seems to be on js side. It looks like the title field have same id and name i.e. title. So when the button is clicked, the form got submitted directly without calling this function. Better try adding logs in this function. If the button is added dynamically, then try using below

$('#btn-submit').on('click',function(e){
  e.preventDefault();
  alert("This function called")  
});
👤vinay

Leave a comment