Asynchronous JavaScript and XML (AJAX) is a group of interrelated Web development techniques used on the client-side to create asynchronous Web applications. With AJAX, web applications can send data to and retrieve from a server asynchronously (in the background) without interfering with the display and behavior of the existing page. HTML and CSS can be used in combination to mark up and style information. The Document Object Model (DOM) is accessed with JavaScript to dynamically display and allow interaction with the information presented.

Share tech news, updates, or what's on your mind.

Sign up to Post

I need to capture the exact time and write it to a sql server db via a classic asp web page.  I have a page that does that now...sort of.  It uses the Now() asp function.  The problem is that, if the internet happens to be slow where we are, by the time the command goes to the server, the time may not be as precise as we need.  Is there a way to capture that time client side (using javascript for instance) and then write it to the server, all with one button submit?

Thanks in advance for your help.
Learn SQL Server Core 2016
LVL 13
Learn SQL Server Core 2016

This course will introduce you to SQL Server Core 2016, as well as teach you about SSMS, data tools, installation, server configuration, using Management Studio, and writing and executing queries.

Hi Experts,

Can you anyone see why the Currency converter stopped working for some reason at https://www.aces-project.com/index.php/live-apps/

If you place a breakpoint at line 76 on https://www.aces-project.com/wp-content/themes/aces-project/live-apps.js, then run it, you'll notice that  I set my url appropriately on  Li. 35, but within my AJAX Call neither my url is appended from Li. 44 nor any data  is sent to the php script from Li. 49-52

Any help would be greatly appreciated.
Thank you!
Good moning !

I use this code to edit the quantity of products from a button. With Chrome it goes very well but with Firefox it sends me an ajax error.
This happens when I change quantities quickly.
If I click on Chrome several times, everything is fine, but on firefox it crashes.
Can you guide me please?

function BTN_EDT(i){
	var $button = $(this);
	var val_R = document.getElementById("ARR_NumId_" + i).value;
	var val_Q = document.getElementById("ARR_Quantite_" + i).value;
		type : "POST",
        url: '_produit-update.php',
        cache: false,
		data: {val_R:val_R, val_Q:val_Q},
        error: function(e){console.log('Ajax Error',e);alert('Erreur Ajax');},
        success: function(response){console.log('Ajax Success',response); location.reload(true);}

Open in new window

Thank you in advance
I am trying to use this jQuery plugin but I cannot retrieve the entered data and associated emoji to send these data to a database via an AJAX call.

I can see the text and the emoji in the emojioneArea in the DOM but can't figure out how to extract them into a JavaScript variable.

I believe that I have followed the guidance in the emojioneArea GitHub examples but for me it does not work.  If I try to use the setText or getText methods the browsers tell me that they are not valid functions.

The screen scrapes attached are from IE11 but I have the same issue with Firefox.

Any assistance will be most appreciated and thanking you in anticipation.


From the DOM
The code I am trying
P.S., The alert returns no data but the length is correctly one.
I'm trying to post to an HttpHandler ashx file with parameters.

function sendClickData(methodName,paramValue) {
    try {
        // create web service param object
        var passUrl = "SetGridDefaults.ashx";

        // save data to web service using an ajax post method
            type: "POST",
            url: passUrl,
            data: "MethodName=SetDefaultGridView",
            success: function (data) {

            error: function (error) {
    } catch (e) { }


Open in new window

In the data row, I am passing values to be retrieved as query strings:

In my ProcessRequest, I am retrieving the value:

  Public Sub ProcessRequest(ByVal context As HttpContext) Implements IHttpHandler.ProcessRequest

        Dim method As String = context.Request.QueryString("MethodName").ToString()

Open in new window

When I run it, it gives me an error that the MethodName is null on the request.querystring line of code:
>>An exception of type 'System.NullReferenceException' occurred

This code was from an original article here:
original code

The only thing I see different is that it says to include an older version of jquery - version 1, whereas I am using version 3.

Also, in addition, I would like to pass two values if possible.

And yes, I know I can use a web service or API, but I was hoping I could use this, since it's just a very simple request.


Hi, I have a PHP script which calls another PHP script via a jQuery ajax call.  I can see that the call is successful and that there is a proper response from the network activity.  However I am having trouble processing that response in the calling PHP/JavaScript code.

Here's my attempt:


From the network activity I see the response is:

["data1","data2"] and this is what I am expecting (actual data not shown)

But I cannot 'see' nor process these data in the success data in the calling code shown above.  The alerts do not fire.

Any guidance will be most appreciated and thank you in anticipation.
We are getting a CORS error when trying to run and API request from one of our subdomains to another. I saw an htaccess fix...

<ifmodule mod_headers.c="">
   SetEnvIf Origin "^(.*\.MyDomain\.com)$" ORIGIN_SUB_DOMAIN=$1
   Header set Access-Control-Allow-Origin "%{ORIGIN_SUB_DOMAIN}e" env=ORIGIN_SUB_DOMAIN
   Header set Access-Control-Allow-Methods: "*"
   Header set Access-Control-Allow-Headers: "Origin, X-Requested-With, Content-Type, Accept, Authorization"

I added that to the htaccess file of where the API request was going *to*, but we still get the error. Does it need to go in the htaccess of the site the request is coming *from*? Or both? In other words, does the htaccess stuff need to live where the request originates or where the request is processed? Or both?
I have the following ajax codes, and want to send Json data to MVC Controller.
Can you show me how to do that  on MVC Controller?

function Submit(domain) {
    //alert("Thank You");
    var x = $('#formdiv *').serializeArray();      
    var data = {};
   $.each(x, function (i, field) {
        data[field.name] = field.value;
    var json = JSON.stringify(data);   
    $(document).ready(function () {
            url: domain + "/Api/ReceiveJson",
            type: "POST",
            data: {json},
            dataType: 'json',
            contentType: "application/json; charset=utf-8",
            success: function (data) {alert('Success');},
            error: function (msg) { alert(msg); }
    return false;

Open in new window

Hi Experts

My client has Google Analysts for 2 primary domains, and I have a custom carts in other sub domains.

How do I go about and send purchase info to Google Analytics? Do I need to setup the Product IDs within Google? And, is this even possible considering I'm using sub domains.

The intention is to keep the existing code.

I got a data object like below. This is a part of RestAPI method return. But when i call REST API using Jquery AJAX , I am getting Name, Address correct but the List of ProductName is coming is empty.

Is there any reason whey List is empty. I checked the method it is having the values but at the side of Jquery Ajax response i am getting it as empty.

public class TotalRectificationOverTime
        public string Name;
        public int Address;

        public List<string> ProductName;

CompTIA Network+
LVL 13
CompTIA Network+

Prepare for the CompTIA Network+ exam by learning how to troubleshoot, configure, and manage both wired and wireless networks.

Error with resources when using ajaxtabcontainer.  I have other ajaxcontrols on the page (calendar) that have not had a problem, but after adding the tab container to the page I get an error as follows.

Error Rendering Control - Table2 An unhandled exception has occurred.
Could not find any resources appropriate for the specified culture or the neutral culture. Make sure "AjaxControlToolkit.Properties.Resources.NET4.resources" was correctly embedded or linked into assembly "AjaxControlToolkit" at compile time, or that all the satellite assemblies required are loadable and fully signed.

Open in new window

Below is the code:
<asp:ScriptManager ID="ScriptManager1" runat="server" EnablePartialRendering="true">
<asp:Table ID="Table2" runat="server" Height="70%" Width="100%">
                <asp:TableCell ID="TableCell22" RowSpan="6" Width="20%" VerticalAlign="Top" HorizontalAlign="Center" 
                BorderStyle="Inset" BorderWidth="2" BorderColor="Gray" runat="server" Height="100%" CssClass="CellPadding">
<asp:Panel ID="Panel2" runat="server">
                    <ajaxToolkit:TabContainer ID="TabContainer1" runat="server" BackColor="Black" BorderStyle="None" 
                        Font-Names="Arial" Font-Size="10" ForeColor="#FFFFCC" AutoPostBack="True" TabStripPlacement="Bottom">
                        <ajaxToolkit:TabPanel runat="server" ForeColor="#FFFFCC" Font-Size="10" 

Open in new window


I have set up a very simple update panel page as I was getting a full postback each time on a new site I have set up in VWD, it refuses to update just the update panel, but if I copy over the page to the older site it works fine.

They have identical web configs and I'm not using a master page so no interference there.

Same on the live server, one work, one doesn't - any ideas?


I am quite confused as to what I can do and what I cannot do within the UploadComplete event of the AjaxFileUpload control.

There are 2 ASPX Label controls which are assigned values within the UploadComplete event, however, the assigned values do not appear on the page after the event completes. The uploaded file is saved to the designated directory, however.

I'm including the ASPX, the VB code behind and the web.config files as follows:

<%@ Page Language="VB" AutoEventWireup="false" CodeFile="Default.aspx.vb" Inherits="_Default" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
	<form id="form1" runat="server">

			<asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>

			<asp:Label ID="Label1" runat="server"></asp:Label>

			<ajaxToolkit:AjaxFileUpload ID="AjaxFileUpload1" runat="server" AllowedFileTypes="jpeg,jpg,gif" />

			<asp:Label ID="Label2" runat="server"></asp:Label>


Open in new window

VB Code Behind
Imports AjaxControlToolkit

Partial Class _Default
	Inherits System.Web.UI.Page

	Private Sub AjaxFileUpload1_UploadComplete(sender As Object, e As AjaxFileUploadEventArgs) Handles AjaxFileUpload1.UploadComplete

		Label1.Text = "Here we are 1."

		AjaxFileUpload1.SaveAs("C:\inetpub\ClientWebs\AjaxFileUploadSync\Images\" & e.FileName)

		Label2.Text = "Here we are 2."

	End Sub

End Class

Open in new window

<?xml version="1.0" encoding="utf-8"?>


		<compilation debug="true" targetFramework="4.0" />
        <add tagPrefix="ajaxToolkit" assembly="AjaxControlToolkit" namespace="AjaxControlToolkit" />



			<add name="AjaxFileUploadHandler" verb="*" path="AjaxFileUploadHandler.axd" type="AjaxControlToolkit.AjaxFileUploadHandler, AjaxControlToolkit" />



Open in new window

Any assistance you might provide would be most helpful.

Much thanks,
David Bach
Hello !

I ask your help to be able to have the following format in an input : a1B2-c3D4-R2EJ-s1fe
This is not a credit card format, but a gift voucher.
The user can copy / paste the code or simply write it.
I tried to dig a little but I'm not well advanced.

Can you help me please ?
thank you in advance
I'm doing an ajax call to a ColdFusion function to return a query. It should return a single record with three columns for an event's title, description, and date. I want to place each of those three pieces in their corresponding divs. Everything is working fine but I can't figure out how to access the results, and the options I've Googled up have failed me. How do I get the JSON equivalent of CF's queryName.columnName? Thanks!

The jQuery I'm using is as follows:
		 var id = this.id;
		 var splitid = id.split('_');
		 var eventID = splitid[1];
		 // AJAX request
			type: "POST",
			url: "/cfc/calendar.cfc?method=getEventAjax",
		  dataType: "json",
			data: {
			 returnFormat: "json",
			 eventID: eventID
			success: function(response){ 
				// Add response in Modal body
				$('#eventTitle').html(what goes here for the title?);
				$('#eventDescription').html(what goes here for the description?);
				$('#eventDate').html(what goes here for the date, and what about formatting?);
				// Display Modal
			error: function (response) {
        $("#modal-body").html("This event could not be loaded.");

Open in new window

The function is simple:
<cffunction name="getEventAjax" access="remote" returntype="query" hint="returns info for single event">
		<cfargument name="eventID" type="numeric" required="yes">
		<cfquery name="qGetEvent" datasource="#APPLICATION.ds#">
			SELECT eventTitle, eventDescription, eventDate FROM calendar
			WHERE ID = <cfqueryparam value="#ARGUMENTS.eventID#" cfsqltype="CF_SQL_INTEGER">
		<cfreturn qGetEvent>

Open in new window

In the console log I'm getting
{COLUMNS(3), DATA: Array(1)},
DATA: Array(1)
0: Array(3)
0: "Radio Interview with Lucy Ann Lance of 1290AM"
1: "<p>Interview will take place at 8:20am EST</p>"
2: "July, 29 2019 00:00:00"
After attempting to edit a mysql record in node.js, I am receiving null results when I review the mysql query report and the affected rows are returning zero.  There is no change to the record. However, the backend says that the results are not null, the sql query is not null and that the req.body for all the values are not null.

Here is the mysql general query log:

190717 16:42:40	    3 Query	SELECT * FROM stores
		    3 Query	SELECT * FROM stores
		    3 Query	SELECT * FROM stores
190717 16:42:42	    3 Query	SELECT * FROM stores
190717 16:43:13	    3 Query	UPDATE stores SET `station` = NULL, `address` = NULL, `monthly c-store sales` = NULL,`operator` = NULL, `top sku` = NULL WHERE `id` = NULL

Open in new window

These are the results returned on the frontend:

affectedRows: 0
changedRows: 0
fieldCount: 0
insertId: 0
message: ""
protocol41: true
serverStatus: 2
warningCount: 0

Open in new window

However, the backend says that the values are not null after putting in the following code:

if (results !== null) {
        console.log('results is not null');
        console.log('results is null');

      if (sql !== null) {
      console.log('sql is not null');
      console.log('sql is null');

      if (req.body.Station !== null) {
        console.log('req.body is not null');
        console.log('req.body is null');

Open in new window

Here are the results.....
{ station: 'Hopefully',
  address: 'this',
  monthlycstoresales: '200',
  operator: 'will',
  topsku: 'work',
  id: '7' }

results is not null

sql is not null

req.body is not null

Open in new window

Here is the backend code:

Open in new window

Dear Experts, I'm trying to learn How to Make Load More Results From Database using jQuery,Ajax,PHP and MySQL

I found this simple code on the web which is suppose be working but I have the below error.

Warning: mysqli_fetch_assoc() expects parameter 1 to be mysqli_result, bool given in ....

I tried a few things but it didn't work. What do you suggest I should do?

On the top of my two pages I have database connection, and my code is :
$con = mysqli_connect(DB_SERVER, DB_USER, DB_PASS, DB_DATABASE);
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

        <script type="text/javascript">
            $(document).ready(function () {
                $("#load").click(function () {

            function loadmore()
                var val = document.getElementById("result_no").value;
                    type: 'post',
                    url: 'getrecord.php',
                    data: {
                        getresult: val
                    success: function (response) {
                        var content = document.getElementById("result_para");
                        content.innerHTML = content.innerHTML + response;
                        document.getElementById("result_no").value = Number(val) + 2;

Open in new window

I have written my first Spring MVC controller. While I have no problems with GET requests, I am still having some issues with POST methods.

This is the code in my controller:
@RequestMapping(value = "/editorsWriters", method = RequestMethod.POST)
    public <HttpServletRequest> ResponseEntity<List<FreelancerContactWriterListView>> getEditorsWriters(
                                                                    @RequestParam int[] languageIds, 
                                                                    @RequestParam int[] summaryGroupIds, 
                                                                    @RequestParam String[] writerStates,
                                                                    HttpServletRequest request, HttpServletResponse response) {

        WriterState[] writerState = Arrays.copyOf(writerStates, writerStates.length, WriterState[].class);

        List<FreelancerContactWriterListView> writers = writerService.getActiveWriters(languageIds, summaryGroupIds, writerState)
                                                                    .map(writer -> this.convertTo(writer))

           return new ResponseEntity<List<FreelancerContactWriterListView>>(writers, HttpStatus.OK);

Open in new window

and this is the JavaScript code:

 $("#search").on("click", function(e) {
            var languages=$("#languages").val();
            var summaryGroups = $("#summaryGroups").val();
            var writerStates = $("#writerState").val();
            var myObject = new Object();
            myObject.languageIds = languages;
            myObject.summaryGroupIds = summaryGroups;
            myObject.writerStates = writerStates;

            var myData = JSON.stringify(myObject);


                method: 'POST',
                dataType: 'json',
                data: myData,
                contentType: "application/json"

Open in new window

This is the JSON sent:


Open in new window

The problem is that I get a POST 404 (Not Found) error in the JavaScript console
POST https://dev1.getabstract.com/api/pps/contactFreelancers/editorsWriters 404 (Not Found)

and the following message in the terminal of my IDE:

2019-07-14 22:49:06,923 DEBUG [BaseControllerExceptionHandler] Page not found for the URL https://dev1.getabstract.com/api/pps/contactFreelancers/editorsWriters with query null: Required int[] parameter 'languageIds' is not present

Open in new window

So it is reaching or sending the POST to the correct URL, but what am I doing wrong?

Is the way I have created the data wrong?
languages, summaryGroups and writersStates are all arrays and I am putting them together into one JSON.

Thanks for your help

I have a search field which provides data from a database for the user. It works well but the autocomplete coding doesn't.  The station names are suppose to automatically show. Please see the code below...

<h3>Search Box</h3>
    <label>Type Station Name</label>
    <input id = "stationBox" type="text">
    <ul id="autoList"></ul>
    <button id ="stationOne" >Submit</button>
    <div id="searchResult"></div>

Open in new window

//Inserting information in a search bar--
  $(document).ready(() => {
    $('#stationOne').click(() => {
      var requestUrl = 'stationNames/' + $('#stationBox').val();
      console.log('making ajax request to', requestUrl)
          success: (data) => {
          console.log('You received some', data);
          var search_data = '';
            $.each(data, function (key, value) {
              search_data += '<li>ID: ' + value.ID + '</li>' +
                '<li>Station: ' + value.Station + '</li>' +
                '<li>Address: ' + value.Address + '</li>' +
                '<li>Sales: ' + value.Monthly_CStore_Sales + '</li>' +
                '<li>Operator: ' + value.Operator + '</li>' +
                '<li>Top SKU: ' + value.Top_SKU + '</li>' +
                '</<li>' + '<br/>';


Open in new window

Exploring SharePoint 2016
LVL 13
Exploring SharePoint 2016

Explore SharePoint 2016, the web-based, collaborative platform that integrates with Microsoft Office to provide intranets, secure document management, and collaboration so you can develop your online and offline capabilities.

Good Morning Dear Expert,

I'm actually using Cfswitch expression to play several module on the same page with a page's "refreshment" when i submit the form.. i would like to use Coldfusion and Ajax for a different experience.. Is it possible on a input or submit Click, to call an Ajax function on the same page and in this function, change the variable of the CFcase expression to play a different mudule ?

Any response will be helpful..
I am using jQuery   I have a a dropdown box and the the code is in a dialog box that opens from an onclick event(). I have a .change() event that fires twice.  I know this problem is caused by the dialog box because when I remove  the dialog box it works fine

Then at a later point the user selects one of these values

and I detect the change with this

$('#Code').change(function () {
				      var value = $(this).val();
				      var text = $(this).find(":selected").text();
				      alert(' Text = ' + text  + '  value = '  +value  );
                                      .... do more stuff

Open in new window

I have a form that includes a file upload that I'm submitting with Ajax. When the submit button is pressed, I want to change the text of the button to "Please wait" and disable it. Whether the form is successfully submitted or not, change the text back to "submit" and re-enable it once the function completes. This is not working. I've Googled up several suggested methods and haven't managed to get any of them to work, but I may be placing them incorrectly. Can you see where I'm going wrong? Thanks!

the jQuery in the .js file:

$(document).ready(function() {
	// submitting the video form
    var formData = new FormData($(this)[0]);
			type: "POST",
			url: "ajax-video-submit.cfm",
			beforeSend: function (){
      	$("#submitVideo").val("Please wait...").attr("disabled", "disabled");
			data: formData,
      async: false,
      cache: false,
      contentType: false,
      enctype: 'multipart/form-data',
      processData: false,
			success: function (response) {
			complete: function () {


Open in new window

the button code:
<input type="submit" name="submitVideo" id="submitVideo" value="Submit" class="btn btn-primary btn-xl mt-2">

Open in new window

Hello everybody,

I need JS to fetch all the data in the DB for one or more auto-generated stuff. First I create a global variable and make a forEach loop to get my data from the DB for each instance:
var datosRae = new Array();


Open in new window

Inside the function I call in the loop, I use AJAX to fetch the data arrays:
function getRaesOriginalData(value, uid, yacimiento) {
	var dataString = 'uid=' + uid + '&yacimiento=' + yacimiento + '&raeId=' + value;
	$.ajax ({
		url: 'get-rae-datos-originales.php',
		type: 'POST',
		data: dataString,
		dataType: 'json',
		success: function (d) {
			datosRae[value] = d;

Open in new window

The result is as expected (if 3 items are called, it brings me 3 arrays with all the data), except when I need to use that data. As you can see in the last line inside the success function of the AJAX call, I insert the arrays into the global array while giving each entry the ID for that DB entry. When I try to print in the console, let's say the ID number 15 with:

Open in new window

it gives me "undefined". If I remove the ID and try to print the whole global array, it prints the following:
Global array resultHow can I call each array from within the global array using it's ID? What am I missing?

Thanks in advance!
Hello everyone,

I have a PHP page that generates content dynamically upon creation. It adds TABS with the same FORM in each one, but referencing different IDs from a table in the DB. I need to make listeners for each input, radio button, checkbox, textarea and button in each form and have AJAX update the DB immediately when any of these values change.

Since the tabs and forms are created automatically, they are all the same except for the ID of each element, that get the DB id that is connected to each form. I chose to use the format "this_is_the_button_something-XX" where XX is the ID from the DB that that form is currently attached to.

I've trying/testing the following code to detect the changes individually for each element:
const checkbox_rae_forma_de_contacto_telefono = document.getElementById('rae_forma_de_contacto_telefono-14')

checkbox_rae_forma_de_contacto_telefono.addEventListener('change', (event) => {
	if (event.target.checked) {
	} else {

const checkbox_rae_forma_de_contacto_radio = document.getElementById('rae_forma_de_contacto_radio-14')

checkbox_rae_forma_de_contacto_radio.addEventListener('change', (event) => {
	if (event.target.checked) {
	} else {

const checkbox_rae_forma_de_contacto_personalmente = 

Open in new window

I'm displaying a table that returns users I want to click on the user and edit them in a bootstrap modal. I'm able to do this using ajax but the modal that opens won't load some of the classes I'm using in the form. If I open the modal from that page without using the ajax the form loads and works as it should but I can't load that user id in my where statement. I up to try anything. One example is using the floating labels bootstrap has.






Asynchronous JavaScript and XML (AJAX) is a group of interrelated Web development techniques used on the client-side to create asynchronous Web applications. With AJAX, web applications can send data to and retrieve from a server asynchronously (in the background) without interfering with the display and behavior of the existing page. HTML and CSS can be used in combination to mark up and style information. The Document Object Model (DOM) is accessed with JavaScript to dynamically display and allow interaction with the information presented.