Having trouble fetching data values from an Ajax GET request in a Django view

Question

Having trouble fetching data values from an Ajax GET request in a Django view

Is there a way to query the employee list based on parameters sent through an ajax call within the data property? I want to use a GET request only, but it is returning an error.

AJAX Function in JavaScript

  $(document).ready(function () {
    $(".call_ajax").click(function () {
      $.ajax({
        url: "/employee_list",
        type: "GET",
        contentType: "application/json",
        dataType: "json",
        data: {
          designation: "soft eng",
        },
        headers: {
          "X-CSRFToken": csrftoken,
          Authorization: my_token,
        },
        success: function (data) {
          console.log(data);
        },
        error: function (xhr) {
          //Do Something to handle error
          console.log(xhr.error);
        },
      });
    });

Backend View Code

@csrf_exempt
@api_view(['GET', 'POST', 'PUT', 'DELETE'])
@permission_classes([IsAuthenticated])
@authentication_classes([TokenAuthentication])
def employee_list(request):

    if request.method == 'GET':
        data_ = request.data['designation']
        print(data_)
        employees = Employee.objects.all()
        students = Student.objects.all()
        user = MyUser.objects.all()
        serializer = EmployeeSerializer(employees, many=True)
        serialized_sudents = StudentSerializer(students, many=True)
        multi = {
            'employees': serializer.data,
            'students': serialized_sudents.data
        }
        return JsonResponse(multi, safe=False)

Error Message in Browser

GET http://127.0.0.1:8000/employee_list/ 500 (Internal Server Error)

Django Log Showing Key Error

 File "C:\Users\atif\PycharmProjects\CodePlatform\syntax_fight\api_\views.py", line 42, in employee_list
    data_ = request.data['designation']
KeyError: 'designation'

javascript django ajax django-rest-framework

Answer 1

Answer №1

When utilizing request.data, you are able to access the parsed content of the request body, much like with request.POST and request.FILES.

An alternative method involves using request.GET.get('designation').

@csrf_exempt
@api_view(['GET', 'POST', 'PUT', 'DELETE'])
@permission_classes([IsAuthenticated])
@authentication_classes([TokenAuthentication])
def employee_list(request):
    if request.method == 'GET':
        data_ = request.GET.get('designation') # Change made here
        print(data_)
        employees = Employee.objects.filter(designation=data_) # Connect parsed data with database field
        students = Student.objects.all()
        user = MyUser.objects.all()
        serializer = EmployeeSerializer(employees, many=True)
        serialized_students = StudentSerializer(students, many=True)
        multi = {
            'employees': serializer.data,
            'students': serialized_students.data
        }
        return JsonResponse(multi, safe=False)

Alternatively,

You can override the get_queryset method. Since request.data contains POST data, query string parameters can be accessed through request.query_params.

def get_queryset(self):
    data = self.request.query_params.get('designation')
    queryset = Model.objects.filter() # Implement desired filter criteria
    return queryset

For further details on request.data and request.query_params, refer to the following link: Request parsing link

Answer 2

When utilizing request.data, you are able to access the parsed content of the request body, much like with request.POST and request.FILES.

An alternative method involves using request.GET.get('designation').

@csrf_exempt
@api_view(['GET', 'POST', 'PUT', 'DELETE'])
@permission_classes([IsAuthenticated])
@authentication_classes([TokenAuthentication])
def employee_list(request):
    if request.method == 'GET':
        data_ = request.GET.get('designation') # Change made here
        print(data_)
        employees = Employee.objects.filter(designation=data_) # Connect parsed data with database field
        students = Student.objects.all()
        user = MyUser.objects.all()
        serializer = EmployeeSerializer(employees, many=True)
        serialized_students = StudentSerializer(students, many=True)
        multi = {
            'employees': serializer.data,
            'students': serialized_students.data
        }
        return JsonResponse(multi, safe=False)

Alternatively,

You can override the get_queryset method. Since request.data contains POST data, query string parameters can be accessed through request.query_params.

def get_queryset(self):
    data = self.request.query_params.get('designation')
    queryset = Model.objects.filter() # Implement desired filter criteria
    return queryset

For further details on request.data and request.query_params, refer to the following link: Request parsing link

Answer 3

Answer №2

Perhaps the issue arises because you are utilizing GET, while the data is located in the body of the request. Refer to this for more information. One potential solution is to switch your request method to POST:

      $.ajax({
        url: "/employee_list",
        type: "POST",
        ...

Answer 4

Perhaps the issue arises because you are utilizing GET, while the data is located in the body of the request. Refer to this for more information. One potential solution is to switch your request method to POST:

      $.ajax({
        url: "/employee_list",
        type: "POST",
        ...

Having trouble fetching data values from an Ajax GET request in a Django view

Answer №1

Answer №2

Similar questions

What is the best way to retrieve nested ng-include scope/fields within a form?

Using Typescript and webpack to detect variables that are defined in the browser but not in Node environment

The functionality of ngSubmit and ngDisabled seems to be malfunctioning, although ngModel is successfully linked to the

What is the best way to incorporate dual login options using Django?

The toggle for hiding and showing, along with changing the button color, is not functioning properly due to

Why isn't the VueJS component loading state getting updated after Canceling an Axios network request?

How can one gain access to a specifically generated element?

Error 404: MVC4 Ajax request not found

Having difficulty transmitting a base64 video via Ajax Post to PHP

Counter is effective for the initial post, yet it does not function properly for the subsequent post

Determine the presence of a JSON Value/Array in a web application using JavaScript and visualize the information in a dynamic

NodeJS reference copying problem

Transforming javascript's array.map into php's array_map function

Upon installation, the extension that replaces the new tab fails to detect the index.html file

AJAX and Java combination causing issues with logging out in the system

Refresh WebPage automatically after a Servlet successfully uploads and processes an image

The MuiThemeProvider.render() function requires a valid React element to be returned, or null if necessary

Storing a Promise in a Variable in React

When retrieving data using $.ajax in WordPress, the response will be an object containing the fetched information

chosen option in dropdown remains when returning to this page after using AJAX in PHP