Passing list of values to django view via jQuery ajax call

Question

I'm trying to pass a list of numeric values (ids) from one web page to another with jQuery ajax call. I can't figure out how to pass and read all the values in the list. I can successfully post and read 1 value but not multiple values. Here is what I have so far:

jQuery:

var postUrl = "http://localhost:8000/ingredients/"; $('li').click(function(){ values = [1, 2]; $.ajax({ url: postUrl, type: 'POST', data: {'terid': values}, traditional: true, dataType: 'html', success: function(result){ $('#ingredients').append(result); } }); });

/ingredients/ view:

def ingredients(request): if request.is_ajax(): ourid = request.POST.get('terid', False) ingredients = Ingredience.objects.filter(food__id__in=ourid) t = get_template('ingredients.html') html = t.render(Context({'ingredients': ingredients,})) return HttpResponse(html) else: html = '<p>This is not ajax</p>' return HttpResponse(html)

With Firebug I can see that POST contains both ids but probably in the wrong format (terid=1&terid=2). So my ingredients view picks up only terid=2. What am I doing wrong?

EDIT: To clarify, I need the ourid variable pass values [1, 2] to the filter in the ingredients view.

Pablo Abdelhay · Accepted Answer · 2012-11-14 17:31:02Z

49

You can access this array by request.POST.getlist('terid[]') in the view

in javascript:

$.post(postUrl, {terid: values}, function(response){ alert(response); });

in view.py:

request.POST.getlist('terid[]')

It works perfect for me.

answered Nov 14, 2012 at 17:31

Pablo Abdelhay

9981 gold badge11 silver badges12 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

nidHi Over a year ago

selected = request.GET.getlist[‌'selected[]'] TypeError: 'instancemethod' object has no attribute '__getitem__' I get this error... But i have an array of stings like ["one","two","three"‌] and am using a GET request...

alias51 Over a year ago

This works, but... why do you need []? The django docs don't reference it at all docs.djangoproject.com/en/3.0/ref/request-response/…

Rahul Over a year ago

Extremely helpful and still relevant after 8 years!

finspin · Accepted Answer · 2012-06-24 21:13:25Z

I found a solution to my original problem. Posting it here as an answer, hopefully it helps somebody.

jQuery:

var postUrl = "http://localhost:8000/ingredients/"; $('li').click(function(){ values = [1, 2]; var jsonText = JSON.stringify(values); $.ajax({ url: postUrl, type: 'POST', data: jsonText, traditional: true, dataType: 'html', success: function(result){ $('#ingredients').append(result); } }); });

/ingredients/ view:

def ingredients(request): if request.is_ajax(): ourid = json.loads(request.raw_post_data) ingredients = Ingredience.objects.filter(food__id__in=ourid) t = get_template('ingredients.html') html = t.render(Context({'ingredients': ingredients,})) return HttpResponse(html) else: html = '<p>This is not ajax</p>' return HttpResponse(html)

Just an FYI - some older browsers don't have a JSON library built-in. You might be better off using $.serialize rather than JSON.stringify

Josh Smeaton · Accepted Answer · 2012-06-24 10:22:53Z

This part is your problem:

ourid = request.POST.get('terid', False) ingredients = Ingredience.objects.filter(food__id__in=ourid)

You need to deserialize the JSON string.

import json ourid = json.loads(request.POST.get('terid'))

When I do that I'm getting this error in the ajax callback: TypeError at /ingredients/ 'int' object is not iterable

toto_tico · Accepted Answer · 2012-06-24 12:24:56Z

1

It seems you are setting the array to string here

data: {'terid': values},

It should be

data: {terid: values}

answered Jun 24, 2012 at 12:24

toto_tico

19.2k10 gold badges103 silver badges121 bronze badges

2 Comments

finspin Over a year ago

Still only the second value is picked up (terid=2).

Bobort Over a year ago

Javascript doesn't care if you use quotations or not in modifying object attributes or dictionary keys.

gabberr · Accepted Answer · 2012-06-24 10:21:00Z

0

Try sending data like this:

 data: values;

answered Jun 24, 2012 at 10:21

gabberr

3572 silver badges10 bronze badges

Collectives™ on Stack Overflow

Passing list of values to django view via jQuery ajax call

5 Answers 5

3 Comments

1 Comment

1 Comment

2 Comments

Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

5 Answers 5

3 Comments

1 Comment

1 Comment

2 Comments

Comments

Linked

Related