Found 10 Articles for Ajax

Explain the different ready states of a request in AJAX

Shubham Vora
Updated on 05-Jan-2023 16:07:08
AJAX stands for Asynchronous JavaScript and XML. It is a set of web development techniques to create interactive web applications. AJAX allows a web page to communicate with a server without reloading the page. Ready states are an important part of working with AJAX requests. The ready state of a request indicates the request’s status to the server and allows the client to track the progress of the request. In the below, we detailed the different ready states of AJAX. UNSENT STATE (0) This is the first ready state of the AJAX. It is denoted by the integer 0. When ... Read More

How to send FormData objects with Ajax-requests in jQuery?

Shubham Vora
Updated on 08-Dec-2022 11:31:57
In this tutorial, we will learn How to send FormData objects with Ajax requests in jQuery. The FormData object stores value in the form of key-value pair. It mainly sends form data to the server with HTTP requests. If the form’s encoding type had been set to multipart/form-data, the submitted data would have been sent similarly via the submit() function. The FormData object contains multiple operations methods such as append, delete, set, etc. Syntax const formData = new FormData() formData.append('key', 'value') Users can follow the above syntax to create a FormData object. Asynchronous JavaScript And XML are referred to ... Read More

Send multiple data with ajax in PHP

Updated on 06-Apr-2020 08:26:11
Data can be sent through JSON or via normal POST. Following is an example showing data sent through JSON −var value_1 = 1; var value_2 = 2; var value_3 = 3; $.ajax({    type: "POST",    contentType: "application/json; charset=utf-8",    url: "your_url_goes_here",    data: { data_1: value_1, data_2: value_2, data_3: value_3 },    success: function (result) {       // perform operations here    } });With normal post, the below code can be used −$.ajax({    type: "POST",    url: $('form').attr("action"),    data: $('#form0').serialize(),    success: function (result) {       // perform operations here    } });An ... Read More

The Pros and Cons of Using Ajax

Ayush Gupta
Updated on 27-Nov-2019 10:35:33
Ajax is a set of web development techniques using many web technologies on the client-side to create asynchronous web applications. With Ajax, web applications can send and retrieve data from a server asynchronously without interfering with the display and behavior of the existing page.Any other technology Ajax also has its own pros and cons. Let's look at some of those.Pros −Allows applications to render without data and fill data as the application gets it from the server.Gives platform independence to application developersFaster page rendersMore responsive applicationsNo rerenders of whole pages are needed to update only a single area.Cons−Any user whose ... Read More

How to keep audio playing while navigating through pages?

Samual Sam
Updated on 28-Jan-2020 10:04:22
To continue loading audio to play while you are navigating through pages, try the following:Use Ajax to load content History API’s pushState() can also be used to alter URL without page reload. History.js should be used for consistent behavior across multiple browsers.The pushState() has three parameters: State object For new entry created by pushState() Title: You can pass a short title URL: New history entry's URL

Cross-browser drag-and-drop HTML file upload?

Nishtha Thakur
Updated on 25-Jun-2020 07:50:35
For cross-browser HTML File Uploader, use FileDrop. It works on almost all modern web browsers.As per the official specification −FileDrop is a self-contained cross-browser for HTML5, legacy, AJAX, drag & drop, JavaScript file upload

How to “enable” HTML5 elements in IE 8 that were inserted by AJAX call?

George John
Updated on 27-Jan-2020 07:26:37
To enable HTML5 elements in IE, you need to use plugins like html5shiv. The HTML5 Shiv enables use of HTML5 sectioning elements in legacy Internet Explorer and provides basic HTML5 styling for Internet Explorer 6-9,With that, you can also use document.createElement to create an element.var demo = document.createElement("demo"); demo.innerHTML = "Working!"; document.appendChild(demo);

Invoke a Web service from AJAX in SAP application

karthikeya Boyini
Updated on 30-Jul-2019 22:30:20
It does not change much in SAP. How you have been doing in other projects like .NET or other, you need to incorporate the same.You need to send a POST or GET request to the intended service with the help of URL.In order to get the URL, you need to seek help from the ABAP person who would be exposing the service to fetch the WSDL file for all the details about the service.Once you have the WSDL, you can frame the request object with all required input parameters to make an AJAX call.

How to retrieve data from JSON file using jQuery and Ajax?

Amit D
Updated on 17-Feb-2020 06:53:11
To retrieve data from JSON file using jQuery and Ajax, use the jQuery.getJSON( url, [data], [callback] )The jQuery.getJSON( url, [data], [callback] ) method loads JSON data from the server using a GET HTTP request.Here is the description of all the parameters used by this method −url − A string containing the URL to which the request is sentdata − This optional parameter represents key/value pairs that will be sent to the server.callback − This optional parameter represents a function to be executed whenever the data is loaded successfully.Let’s say we have the following JSON content in result.json file −{ "name": "John", "age" : ... Read More

Add Authentication details in the AJAX request in SAPUI5

SAP Developer
Updated on 12-Jun-2020 12:20:58
Basically you need to exploit the beforeSend function of JQuery AJAX to sort out your requirement.Here is a basic code snippet −function AddToHeader(xhr) {     var pwd = // get the password;     xhr.setRequestHeader("Authorization", "Basic " + btoa(user + ":" + pwd)); } $.ajax({    type: "GET",    url: ,    dataType: "JSON",    beforeSend: function(xhr) {       AddToHeader (xhr);    } }).done(function(data) { /* do success logic */ }You can add further details to the header as explained in the AddToHeader method.