Send the array within the "data" attribute when making a Bootstrap AJAX request on the server side

I'm struggling to determine if I can include an array in the data tag within my client JS code. Here's a snippet of the code:

$.ajax({
    url: '/mobiledoc/jsp/aco/Beneficiary/ptmmview.jsp',
    data: {
        "action":"savePatientRecords",
        "ptId":strPtId,
        "PatientVal":PatientVal,
        "Qid":Qid,
        "QType":QType
        "Array" : ??
    },
    dataType: 'text',
    type: 'post',
    success: function (responseMsg) {
        // gets the response message back from server
        loadMilestoneData();
        alert(responseMsg);       

Answer №1

In most cases, servers do not interpret arrays in that format. It's recommended to flatten the array on the client side as a precaution:

data: {
        ...
        "Array": theArray.join(',')  // ensure no values contain ','
      }

When processing on the server, remember to split the array by commas.

Answer №2

Absolutely, you have the capability to do so. Initially, utilize method rather than type post. Here's an example...

method: 'post'

JQuery will handle the serialization of the data for you.

$.ajax({
    url: '/mobiledoc/jsp/aco/Beneficiary/ptmmview.jsp',
    data: {
        "action": "savePatientRecords",
            "ptId": strPtId,
            "PatientVal": PatientVal,
            "Qid": Qid,
            "QType": QType,
            "Array": [ 1, 2, 3 ]
    },
    dataType: 'text',
    method: 'post',
    success: function (responseMsg) {
        // retrieves response message from server
        loadMilestoneData();
        alert(responseMsg);
    }
});

If not, then use JSON.stringify to convert your objects/arrays into a string.

$.ajax({
    url: '/mobiledoc/jsp/aco/Beneficiary/ptmmview.jsp',
    data: JSON.stringify({
        "action": "savePatientRecords",
            "ptId": strPtId,
            "PatientVal": PatientVal,
            "Qid": Qid,
            "QType": QType,
            "Array": [ 1, 2, 3 ]
    }),
    dataType: 'text',
    method: 'post',
    success: function (responseMsg) {
        // gets the response message back from server
        loadMilestoneData();
        alert(responseMsg);
    }
});

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

Create JavaScript variable from either HTML or database sources

Hello, I am trying to implement a counter that retrieves its value from a JavaScript file, but I would like to customize it. Below is the JavaScript code: function updateCounter(count) { var divisor = 100; var speed = Math.ceil(count / divisor); ...

"Retrieve the x-coordinate position of a box within a specific div using

https://i.sstatic.net/68yeF.jpg https://i.sstatic.net/ZCrxZ.jpg Is there a way for me to move the box within the gray area? <div id="timeline"> <div cdkDragBoundary="#timeline" ...

Establish a connection to AWS by utilizing MQTT.js

Looking to create a web page that connects to an AWS server? While python-Paho-mqtt allows for the use of tls_set to add security certificates and more, how can we achieve the same with MQTT.js? And if unable to do so, what are the steps to run python-PAHO ...

Ways to develop a dynamic HTML TransferBox featuring a custom attribute

I am in need of developing a customized transferbox using HTML, JavaScript, and JQuery. The user should be able to select from a list of options and associate them with attributes. This selection process should involve transferring the selected options be ...

Is it possible to connect ng-model with a style tag?

Is it feasible to create a basic template editor using angularjs where an input field with an ng-model can be connected to a style tag to control the css on an entire page rather than applying it to a specific element with inline styling? Could something ...

What is the best way to pass the ng-repeat value to the controller in AngularJS

On my webpage, I am trying to utilize ng-repeat with an array like the one below: var array = [{name: Bill, age: 12, number: 1}, {name: Tyrone, age: 11, number: 2}, {name: Sarah, age: 14, number: 3}]; I want to have a button that, when clicked, sends eit ...

The Ajax ItemSelectEvent is returning null when multiple parameters are utilized in the listener

I am running into an issue with my Java method. I need the function to accept two values, a String and ItemSelectEvent, as I use this function multiple times. How do I pass the event from the XHTML? Here is my attempted solution: <p:chart type="donut ...

"Utilizing Ajax to create a dynamic loop within a div

I'm a beginner in Ajax and I'm working on creating an Ajax call for multiple div elements. Imagine I have a DOM structure like this: <div id="form"> <div id="child_1"> <div id="child_1_select"></div&g ...

Encountering silence: React JS fetch call left unanswered by Sinatra server

Exploring the realms of Sinatra and React JS, I am venturing into making a GET call from my React website to a Sinatra server in order to display plain text. The Sinatra Server script: require 'sinatra' set :root, 'lib/app' before d ...

View a pink map on Openlayers 2 using an iPhone

I am currently working on a project where I am trying to track my location using my smartphone and display it on a map. To achieve this, I am utilizing openlayers 2. However, I am encountering an issue. When I implement the code below in a Chrome Browser ...

What could be the reason for the jQuery not displaying JSON data in the console log?

When I put this code into a file named test.html: <html> <head> <title>Test</title> </head> <body> <script src="https://code.jquery.com/jquery-1.10.2.min.js"></script> <script type="text/javascript"& ...

Using jquery to transition an image to fade out and then reappear in a different position

There is an image in a div with the highest z-index. Upon clicking on something, the image should fade out and then fade in at a specified position below another image with the class "aaa". The current approach involves using jQuery to fade out the image ...

Creating a sticky v-stepper-header while scrolling in VuetifyJS

Can anyone help me figure out how to make the <v-stepper-header> component stay sticky when scrolling? I attempted to create custom CSS for this but was unsuccessful. Below is a snippet of code that I tried: <v-stepper v-model="step"&g ...

How can I fetch the list of currently logged in users from a MySQL database using jQuery and AJAX?

I have created a website with a div that aims to showcase all the users currently logged in. I have implemented a boolean value in my database where 1 signifies that a user is logged in. To dynamically generate this list, I am utilizing jQuery AJAX to make ...

Is there a way to bypass using project() function automatically when performing a MongoDB find()?

Utilizing project() to extract specific fields from my MongoDB query using the nodeJS MongoDB driver. However, I only require the projection in certain scenarios. Therefore, if useProjection is set to false, I want the complete datasets to be returned. I& ...

The functionality of OBJLoader has ceased to function properly following the implementation of revision

Recently, I encountered an issue while working with the objloader feature of the three.js library to display a cube in a web browser. Everything was working perfectly until I updated to revision 55 from git. Since then, I have been unable to render the c ...

Does this function only function on a singular div?

I need some help! I'm having trouble getting a function to trigger on the divs below the initial one. Any advice? ...

How can I show a map using AJAX data with jQuery?

Currently, I am working on a project that has specific requirements: Create a button named "city map" on the page. Upon selecting a country and loading the list of cities using an AJAX GET method, click the button to open a new window that displays the ma ...

Creating Dynamic Height for Div Based on Another Element's Height Using ReactJS and CSS

I'm attempting to set a fixed height for a div in order to enable overflow scrolling. However, I am encountering issues as I am using JavaScript within a useEffect hook to accomplish this task. The problem is inconsistent as sometimes the height is se ...

Creating dynamic HTML elements by utilizing both jQuery and native JavaScript within the DOM

I have an old application that I'm revamping, and instead of using the node's id, I want to apply the DOM structure to its class. Here is a snippet of my code where I am attempting to combine jQuery (selecting the node by its class) with the exi ...