Receiving JSON objects from Javascript in Django Views

When I attempt to pass a Json Object value from making an API call to my views.py in Django template, I encounter difficulty retrieving the value after an ajax call.

let application = JSON.parse(sessionStorage.getItem("appId"));
let kycStatus = application.applicationId

$.ajax({
    type: "GET",
    dataType: "json",
    url: `${url}/${kycStatus}`,
    headers: {
         'Content-Type': 'application/json',
         'X-API-Key': '',
        },
        data: {
            senddata: JSON.stringify(),
        },
        success: function(data)  {
            document.getElementById("kyc-status").innerHTML = data.overallResult.status
            console.log(data.overallResult.status)
        }
     

})`

I face challenges getting the value in django's views.py.

def is_ajax(request):
    return request.META.get('HTTP_X_REQUESTED_WITH') == 'XMLHttpRequest'


def kycsubmit(request):
    """ A view to return the index page"""
    if is_ajax(request=request):
       if request.method == 'GET':
            data = request.GET.get('senddata')
            print(data)
           
    return render(request, 'kycsubmit/onboard.html')

Answer №1

Instead of using the print method within def kycsubmit(request):, consider utilizing context variables to display information without relying solely on the terminal output.

def kycsubmit(request):
    """ A view to return the index page"""
    if is_ajax(request=request):
       if request.method == 'GET':
            data = request.GET.get('senddata')
            return render(request, 'kycsubmit/onboard.html',{'data':data})

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Is there internal access to the "access property" within the "data property" in JavaScript?

I have come to understand that there are two types of properties in objects: data properties and accessor properties. It is possible to access the "data property" without using an "accessor property," as shown below: const person = { name: 'Pecan&a ...

What is the best way to create a repetitive pattern using a for loop in Javascript?

I want to create a repeating pattern to color the background, but once i exceeds colors.length, the background color stops changing because, for example, colors[3] does not exist. I need colors[i] to start back at 0 until the first loop is complete. cons ...

Employing jQuery with dynamic content within this context

Can anyone help me with jQuery and dynamic content? I'm trying to prepend items to a list and show the contents of a specific item when clicked, but all items' content is being displayed instead. I attempted using (this) without success. $(docum ...

Does the [data-empty] constitute a component of the browser environment?

While exploring a node.js project that employs socket.io, I came across a piece of code that verifies whether the length of $('[data-empty]') is larger than 0. There was no class or ID associated with it, but it seemed like data-empty was some ki ...

Challenge with Angular *ngFor: Struggling to Access Previous Elements

In my angular and node application, I am using socket.io. When a user joins the room, they can see their username in the user list. If another user joins, the first user can see both usernames but the new user can only see their own. This pattern continues ...

Tips for triggering the API call only when a change is detected

#In the provided code snippet, the useEffect hook is being used to fetch data from an API using the apiData() function. The data retrieved consists of objects with properties such as id, name, parent name, and isActive. The isActive property is linked to ...

Conquer the issue of incessant AJAX page refreshing

Currently, I am working on an application where I handle numerous form submissions and utilize ajax to send data to a server running on Node.js. One of the features includes updating a table upon button click, which triggers a spinner to load as an indic ...

Elegant transition effects for revealing and hiding content on hover

While customizing my WordPress theme, I discovered a unique feature on Mashable's website where the social buttons hide and show upon mouse hover. I'd love to implement this on my own site - any tips on how to achieve this effect? If you have ex ...

Having trouble getting DeviceOrientationControls to function properly

For the past week, I've been attempting to use my smartphone's orientation controls to manipulate my three.js scene. Although I lost the tutorial that originally guided me, I managed to find the example I saved from it. However, despite studying ...

Guide to refining a JSON array using a pre-established list

I'm in need of assistance figuring out how to accomplish the following task: Below is the code snippet I am working with: public class Data { public string FirstName; public string LastName; public int Age; } var data = new Data { //this objec ...

Keep HTML in sync across browser and server

Is there a way to efficiently update a large unordered list in a web application without sending the entire list over the network or resorting to pagination, while ensuring it stays synchronized with a memoized server-generated copy? ...

Tabulator - Enhancing Filter Results Using a Second Tabulator

I've implemented a Tabulator that displays search results, here is the code: var table = new Tabulator("#json-table", { layout:"fitDataFill", //initialFilter:[{field:"title", type:"!=", value:"ignoreList.title"}], ajaxURL:tabUrl, ajax ...

Do you need to have knowledge in reactjs in order to master react-native?

As I embark on the journey of learning how to build apps using react-native, a burning question arises in my mind: should I first learn react-js before diving into react native? Any guidance or advice would be greatly appreciated. Thank you. ...

XMLHTTPRequest is experiencing issues with displaying the progress bar

I'm facing an issue with uploading images in PHP while showing the progress status. The image uploads correctly using XMLHttpRequest, but I can't see the progress bar moving. Below is my code. Can someone help me solve this problem? <html> ...

Having issues with referencing external JavaScript and CSS files in Angular 6

Dealing with an angular6 project and a bootstrap admin dashboard template, I'm facing issues importing the external js references into my Angular application. Looking for guidance on how to properly import and refer to external Js/CSS files in an angu ...

How can I modify the color in vue-google-chart when a filter option is selected?

I created a stack column chart with a filter that changes the color to blue when selected. Here is my Vue app: https://codesandbox.io/s/vue-dashboard-chart-6lvx4?file=/src/components/Dashboard.vue I expected the selected color to match the color in the ...

javascript Href and onclick malfunctioning

I am encountering an issue with a form on my webpage: <form name="myForm" id="myForm" method="post" action="someUrl.php"> ... </form> There is a div outside of this form which contains an anchor link: <a href="anotherUrl.php" onclick="doc ...

What is the best way to transform a JavaScript file retrieved from a remote server (returned as a string) into a standard JavaScript object in a Node

Is there a way to convert a JavaScript file fetched from a remote server (which is in string format) into a regular JavaScript object in Node.js? I know that I can use JSON.parse to convert a JSON string into a dictionary, but in this case, the file contai ...

Unable to locate NPM-installed modules in the local directory

I've been working on a project and I encountered an issue with locally installed modules using NPM in NodeJS on Windows 10. Despite setting up NODE_PATH, I am still getting errors when trying to require these modules. Here is the structure of my proj ...

Obtain an Array Containing all Current Page Paths in Gatsby

While creating a custom `404` page in Gatsby, I am looking to provide users with recommended similar path names based on the non-existent path they have accessed. Can anyone guide me on how to retrieve an array of all the current pages on my website? ...