Can't filtering data for ajax in JsonResponse

Hello. Could someone help me with the next problem: I get data(symptoms) in my form’s input(multiselect) with select2. Then I filter Diseases by these symptoms in my Views. And in ajax success I want to get console.log data from JsonResponse, but I only get list of all Diseases. I can’t realize why this happens. My code:
HTML

 <form id="symptom_form" method="GET">
            <select class="js-example-basic-multiple" name="general_symps" multiple="multiple" 
              style="width:75%;" id="general_symps">
                <option value="1">One</option>
                <option value="2">two</option>
                <option value="3">three</option>
                <option value="4">four</option>
                <option value="5">five</option>
                <option value="6">six</option>
                <option value="7">seven</option>
                <option value="8">eight</option>
                <option value="9">nine</option>
                <option value="10">ten</option>
                <option value="11">eleven</option>
                <option value="12">twelve</option>
                <option value="13">thirteen</option>
                <option value="14">fourteen</option>
                <option value="15">sixxxxx</option>
                <option value="16">twenteen</option>

            </select>

  <button type="submit" class="btn btn-primary subfilter" >Submit</button>
</form>

Jquery

$(document).ready(function() {
        $('.js-example-basic-multiple').select2();
     });

$(document).ready(function() {
$(".subfilter").click(function (e) {
       $.ajax({
            url: "{% url 'getResult' %}",
            type: 'GET',
            data: {
                //general_symptoms:  $('#general_symptoms').val()
                    general_symps:  $('#general_symps').val()
                  },

            dataType: 'json',
            success: function(response){
                      console.log(response)
                      },
      });
        e.preventDefault()

    });
});

VIEWS

def getResult(request):

    qeq = request.GET.getlist('general_symps')
    all_products = Disease.objects.all()
    
     for symp_id in qeq:
          all_products = all_products.filter(symptoms_general__id=symp_id)

    all = list(all_products.values())
    return JsonResponse({"dis": all})

I’ve got all my Diseases {dis: Array(7)}, non-filtered. What do I do wrong? Thanks in advance

Can you verify what you’re sending as the request to that view? What does the complete URL look like? (You’re using “GET”, so those parameters should show up as query parameters in the URL.)

Thank you for reply. I have the next url in my PyCharm terminal: GET /filter/result/?general_symps%5B%5D=1&general_symps%5B%5D=2

And another moment, when I sent it through an action in form and then render as a new page my views filtering works fine. I can’t realize why it works in this cas and doesn’t in ajax

Have you verified that:

is giving you the right values on your ajax call?

(You could either add a print call or use a debugger to verify that qeq has the values you’re expecting to see when the ajax call is made.)

1 Like

You are right. I’ve sent qeq in console.log and got Array(0). So I’m confused… how can qeq work in the same views def, but with standart rendering like
return render(request, "diseases/checker.html", {'dis': all_products})

but with JsonResponse it doesn’t work…

Again, compare carefully the URLs being submitted on the GET for the AJAX vs the URL submitted on the form submission.

1 Like

I’ve found solution, if someone find it useful:

qeq = request.GET.get('general_symps[]')