How to return queryset using AJAX in django?

Question

Here is my view.py :

def get_group_ajax(request):
    if request.method == "GET":
        g_id = request.GET['group_id']
        productlist = models.Stocksupporter.objects.filter(pmaingroups = g_id).values('productname').exclude(numberqut=0) *//This is my queryset*

Here is my AJAX and used Django template for loop :

$("#allgrp").change(function () {
    const gId = $('#allgrp').val();

    $.ajax({
      type: "GET",
      url: '{% url "webapp:get_group_ajax" %}',
      data: {
        'group_id': gId,
      },
      success: function (data) {
          html_data = 
          `
          {% for pr in productlist %}
          <div class="cardc" id="card_id">
            <p>{{ pr.productname }}</p>
          </div>
          {% endfor %} 
           `;
         
          $("#card_id2").html(html_data);
      }
    });
  });

now what is problem: I want return productlist (for loop) in AJAX Success based on selected value (mean group id), i used Response methods but still can not return anything. is there any way for do it?

I think you do not understand something ? Your template is rendering one time when you display your page and all django template tags and filter is proceessed at this time. Your ajax call will trigger after this rendering so you can put only javascript code into the success function — Lucas Grugru
– Lucas Grugru, Commented Nov 16, 2022 at 7:59
After display your page, right click > source code and you will understand the problem i guess — Lucas Grugru
– Lucas Grugru, Commented Nov 16, 2022 at 8:01
@LucasGrugru , which js code is should put in success that can filter list based on selected group id? — NEBEZ
– NEBEZ, Commented Nov 16, 2022 at 8:07

Manoj Kamble · Accepted Answer · 2022-11-16 08:17:53Z

1

views.py :

from django.http import JsonResponse

if 'group_id' in request.GET:
    productlist = Stocksupporter.objects.filter(pmaingroups = g_id).exclude(numberqut=0).values('productname')
    return JsonResponse(list(productlist ),safe=False)

Success function in html:

function(productListData){
   for(i in productListData){
     let element = ` <div class="cardc">
        <p>${productListData[i].productname}</p>
      </div>`
      $("#card_id2").append(element);
    }
 }

answered Nov 16, 2022 at 8:17

Manoj Kamble

5951 gold badge6 silver badges26 bronze badges

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

2 Comments

NEBEZ Over a year ago

Thanks for answer. is this put any item in list sperated dives? or put all of list in one div?

Manoj Kamble Over a year ago

It creates new div for each item.

Collectives™ on Stack Overflow

How to return queryset using AJAX in django?

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related