Performing a JavaScript POST request without using an API, where the payload contains multiple repeated

Question

Performing a JavaScript POST request without using an API, where the payload contains multiple repeated

Seeking help with a Javascript POST request that is not an API request (axios or fetch), but an old classical request.

I require a payload such as

...&_selected_action=5&_selected_action=10

. Using a form submitting technique seems to be impractical in this case. I can handle a single occurrence like ...&_selected_action=5 successfully (referencing Aquajet @ pass post data with window.location.href), everything functions properly. However, I am struggling with sending the string for repeated values either manually or using URLSearchParams().toString().

Any suggestions on how to proceed?

Additional context: This request needs to be created in a Django+Vue application that replaces certain components of the traditional Django Admin system. The ListView is now being handled by Vue and I aim to reuse actions that require a Post request formatted as described above. While I can accomplish this with a single selected row, handling 2+ selected rows has proven challenging.

javascript django vue.js post request

Answer 1

Answer №1

When considering my previous question, I've come to realize that the limitation of not being able to use form submitting methods may not be entirely accurate. As it turns out, an HTML form can indeed contain multiple fields with identical name=, and when submitted, it generates a post request as required.

However, a challenge arises when programmatically creating the form and attempting to fill it from a dictionary, as dictionaries cannot have duplicate keys.

To address this issue, I have made modifications to Aquajet's function detailed in this Stack Overflow thread. By checking if

params[key].constructor !== Array

, I convert non-array values to arrays containing a single element. I then iterate through these arrays, allowing for repeated values in both the parameter (in array format) and the form itself.

This approach resolves my initial problem, although I find the method of creating numerous hidden inputs for this purpose somewhat cumbersome. Therefore, I am keen on exploring alternative ways to construct the POST request.

Answer 2

When considering my previous question, I've come to realize that the limitation of not being able to use form submitting methods may not be entirely accurate. As it turns out, an HTML form can indeed contain multiple fields with identical name=, and when submitted, it generates a post request as required.

However, a challenge arises when programmatically creating the form and attempting to fill it from a dictionary, as dictionaries cannot have duplicate keys.

To address this issue, I have made modifications to Aquajet's function detailed in this Stack Overflow thread. By checking if

params[key].constructor !== Array

, I convert non-array values to arrays containing a single element. I then iterate through these arrays, allowing for repeated values in both the parameter (in array format) and the form itself.

This approach resolves my initial problem, although I find the method of creating numerous hidden inputs for this purpose somewhat cumbersome. Therefore, I am keen on exploring alternative ways to construct the POST request.

Performing a JavaScript POST request without using an API, where the payload contains multiple repeated

Answer №1

Similar questions

Having trouble fetching data using $http and promises in AngularJS

I have put in a lot of effort, but unfortunately, the JavaScript validation is still

Accessing a parent class constructor object in NodeJS from the Child Class

Exploring the attributes and functions of JavaScript Objects in an Angular environment

Error encountered during NextJS build - file or directory not found for 500.html

Authentication of Django users with Azure Active Directory and application roles

Exploring the population with embedded RxJs queries

Creating functions within views

Establish a value for the attribute of an HTML tag

What is preventing this code from successfully altering the opacity of an element based on its id?

The input value is displaying one value, but the output is showing a different value

Issues with Autofocus in AngularJs on Firefox

Iterate through an array of objects to determine if there is a variation in any of the

Struggling with transitioning from TypeScript to React when implementing react-data-grid 7.0.0

Error: The reference to "google" has not been defined within the context of the Google Maps

Issue with Angular Promise ($q) functionality being non-operational

Displaying a dropdown menu from the top by utilizing the show() function

Is there a way to display the output of jQuery in an input box rather than a span?

the Vue ref attribute is struggling to accurately determine the data type

Exploring Deeply Nested JSON Data using AngularJS