Victor Victor - 6 months ago 10
Ajax Question

Passing a dict of dict with Ajax

I'm working on a website running on Django.
I need to pass data from the Javascript to my Python code with Ajax.

Here's my code:

// Javascript file
function myFunc() {
{...} // Generate var 'values' which is a dict of dict {{},{}...}
console.log(JSON.stringify(values));
$.ajax({
url : "holt/",
type : "POST",
data : values,
success : function (json) {
console.log(json)
},
error : function () {
alert("Error Ajax");
}
})
}


My view in python:

class getHolt(TemplateView):
def get(self, request, *args, **kwargd):
pass
def post(self, request, *args, **kwargd):
if request.user.is_authenticated():
data = dict(request.POST)
h = Holt(data)
response_data, success = h.get_holt(2021, no_freeze=True)
return HttpResponse(
json.dumps(response_data),
content_type="application/json"
)


However when I run this, with:


Javascript values


values= {
"1":{"data_2013":"49105","data_2014":"92620","data_2015":"30000","data_2016":"1945000"},
"2":{"data_2013":"2885906","data_2014":"2876120","data_2015":"2882653","data_2016":"2787520"},
"3":{"data_2013":"29201124","data_2014":"29470635","data_2015":"29383195","data_2016":"30154361"}}


I receive this in my Python code:

print request.POST



< QueryDict: {u'1[data_2014]': [u'92620'], u'1[data_2015]':
[u'30000'], u'3[data_2013]': [u'29201124'], u'3[data_2014]':
[u'29470635'],...}>


print dict(request.POST)



{u'1[data_2014]': [u'92620'], u'1[data_2015]':
[u'30000'], u'3[data_2013]': [u'29201124'], u'3[data_2014]':
[u'29470635'],...}


Why don't I receive a dict of dict like I've send ?

What does Ajax do to the data before "sending" them ?

Thank You

JS dictionnary

console.log(JSON.stringify(values));
{"1":{"data_2013":"49105","data_2014":"92620","data_2015":"30000","data_2016":"1945000"},"2":{"data_2013":"2885906","data_2014":"2876120","data_2015":"2882653","data_2016":"2787520"},"3":{"data_2013":"29201124","data_2014":"29470635","data_2015":"29383195","data_2016":"30154361"}}

max max
Answer

jquery will breaks your js dict(it's called object in js) into multiple variables before sending via ajax so there is no dict on the python side , basically you can't pass a dictionary from js to python via ajax ... however they both understand json .

so you need to json encode your dict before sending them

   $.ajax({
            url : "holt/",
            type : "POST",
            data : { 'values' : JSON.stringify(values) } ,
            success : function (json) {
               console.log(json)
            },
            error : function () {
                alert("Error Ajax");
            }
        })

and decode them in the python view

dict_ = json.loads(request.POST.get('values'))

btw , i highly recommend using firebug if you are using ajax so can see whtas going on