We help IT Professionals succeed at work.

AJAX

12K

Solutions

7K

Contributors

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.

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
  $("#video-form").submit(function(e){	 
		 
		e.preventDefault();
		 		 
    var formData = new FormData($(this)[0]);
		 
		$.ajax({
			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) {
      	$('#video-alert').html(response);
      },
			
			complete: function () {
       
      	$("#submitVideo").val("Submit").removeAttr("disabled");
      }
			

		});
	});
});

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

0
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();

arrayRaes.forEach(getRaesOriginalData);

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) {
			console.log(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:
console.log(datosRae[15]);

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!
0
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) {
		
		console.log($('#rae_forma_de_contacto_telefono-14').val());
		
	} else {
		
		console.log('Nada');
		
	}
	
});

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) {
		
		console.log($('#rae_forma_de_contacto_radio-14').val());
		
	} else {
		
		console.log('Nada');
		
	}
	
});

const checkbox_rae_forma_de_contacto_personalmente = 

Open in new window

0
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.
0
I would like to get the latitude and longitudes of an address from the OpenstreetMap Server. I use the following code:
The URI https://nominatim.openstreetmap.org/search/Keizersgracht%202,%20Amsterdam?format=json

gives me the following JSON output:

[
    {
        "place_id": 29597926,
        "licence": "Data © OpenStreetMap contributors, ODbL 1.0. https://osm.org/copyright",
        "osm_type": "node",
        "osm_id": 2729940028,
        "boundingbox": [
            "52.3654887",
            "52.3655887",
            "4.8878076",
            "4.8879076"
        ],
        "lat": "52.3655387",
        "lon": "4.8878576",
        "display_name": "489B-2, Keizersgracht, Grachtengordel, Amsterdam, Noord-Holland, Nederland, 1017DM, Nederland",
        "class": "place",
        "type": "house",
        "importance": 0.32100000000000006
    },
    {
        "place_id": 29345477,
        "licence": "Data © OpenStreetMap contributors, ODbL 1.0. https://osm.org/copyright",
        "osm_type": "node",
        "osm_id": 2722023917,
        "boundingbox": [
            "52.3669115",
            "52.3670115",
            "4.8842236",
            "4.8843236"
        ],
        "lat": "52.3669615",
        "lon": "4.8842736",
        "display_name": "460-2, Keizersgracht, Grachtengordel, Amsterdam, Noord-Holland, Nederland, 1016GE, Nederland",
        "class": "place",
        "type": "house",
        "importance": 0.32100000000000006
    },
    {
        "place_id": 

Open in new window

1
I am developing an app using Apache Cordova and I have the following code which fails to execute. The idea of the code is:

1) loop through the array with all orders (JSON)
2) retrieve the customer's name
3) generate a table or <tr>

The problem is point 2 - the code just stops and I have to restart the server.
The array with orders is not that big - around 150 JSON objects which I retrieve when the application loads;
the array with customers is even smaller: just two clients are in the array.

Is this an issue with JavaScript concurrency? I would appreciate it if someone can give me an idea of how to tackle this, as I have spent hours trying to figure out how to make this work.

Surely, it must be possible to retrieve the orders - then lookup the customer's name - and then put the data into another array.

Thanks

Massimo

      /**
       * @description retrieves all orders for megamax and genereates table rows for the HTML table
       */
      this.getAllMegamaxOrders = function () {
        "use strict";
        var mm_orderID = 0;
        var mm_customer_id = "0";
        var mm_orderDate = "";
        var mm_customerName = "";
        var mm_lat = "";
        var mm_lng = "";
        var mm_price = "";
      
        
        //loop through all orders from array allOrders
        for (i = 0; i < app.allOrders.length; i++) {

          //populate local variables
          mm_orderID = app.allOrders[i].id;
          mm_customer_id = 

Open in new window

1
How do I post using jquery ajax?

I am having the issue that I get a wrong username and password error message from the server.
When I try using Postman, I don't have any problems connecting to a server and getting a value back.

I have to make use of .ajax because I have to make a synchronous call.

Am I missing something as part of the ajax POST message?

         * @description Places a new (empty) order for a customer. 
         *              If successful, the system will display a message
         *              informing the user that a number order has been
         *              placed (with the order ID)
         * @param {number} clientID the client's ID
         */
        this.placeNewOrder = function (clientID) {
      
          data = {
            OUCU: oucu,
            password: password,
            client_id: clientID,
            latitude: 41,
            longitude: 0
          };

          $.ajax(
            {
              method : 'POST',
              async : false,
              url : "http://137.108.92.9/openstack/api/orders",
              dataType : 'json',
               success: function (data) {
                        var obj = data;
                        if (obj.status == "success") {
                          //put new order ID into variable
                          newOrderID = (obj.data[0].id);
                          //get client's name and display it on the next page with the new order number
             

Open in new window

0
I'm developing a Cordova app and one of the function is, that it can display orders.
I would like to retrieve all the orders when the app starts and put them into a JavaScript array:


var allOrders = [];			
this.getAllOrders = function() {
				var url = "http://137.108.92.9/openstack/api/orders?OUCU=" + oucu + "&password=" + password;
				/* Get the data */

				$.get(url, function (data) {
					var obj = $.parseJSON(data); // 
					if (obj.status == "success") {
						// was able to get the data successfully 
						// loop through all orders
								$.each(obj.data, function(i, item) {
                  console.log(item);
									app.allOrders.push(item);
                });
          };
				})
      }

Open in new window


The JavaScript array is populated with JSON objects.

How do I read JSON objects out of the array? For example, I would like to find out in which position the Order ID 71415 is.

      //Searches for an order ID
      this.searchOrderID = function(OrderID) {
        ???
      }

Open in new window


I would appreciate it if someone could give me an idea how to read json objects out of a JavaScript array. Searching for an order ID is one thing and then I would like to retrieve the picture URL for example .. I think once I know how to loop through the variable and then read the element ID, it should make it easier for me to implement the other functions.

Thanks for your help

Massimo
JSfiddle: https://jsfiddle.net/mscola75/ksqyem7g/2/



The JavaScript array with data
0
I would like to write a function that returns all orders and puts the OrderIDs in a JavaScript array.

The JSON looks like this:

{
    "status": "success",
    "data": [
        {
            "id": "69507",
            "client_id": "1",
            "date": "2019-05-18 11:02:20",
            "latitude": "0.00000000",
            "longitude": "0.00000000"
        },
        {
            "id": "69514",
            "client_id": "2",
            "date": "2019-05-18 11:15:20",
            "latitude": "0.00000000",
            "longitude": "0.00000000"
        },
        {
            "id": "69513",
            "client_id": "1",
            "date": "2019-05-18 11:15:16",
            "latitude": "0.00000000",
            "longitude": "0.00000000"
        },
        {
            "id": "69511",
            "client_id": "1",
            "date": "2019-05-18 11:13:23",
            "latitude": "0.00000000",
            "longitude": "0.00000000"
        },
        {
            "id": "69510",
            "client_id": "1",
            "date": "2019-05-18 11:12:01",
            "latitude": "0.00000000",
            "longitude": "0.00000000"
        },
        {
            "id": "71397",
            "client_id": "1",
            "date": "2019-05-20 22:33:36",
            "latitude": "41.00000000",
            "longitude": "0.00000000"
        }
    ]
}

Open in new window


As I'm using jQuery, I use the following method to loop through the array - and then get the "id":

var orderIDs = [];

function getAllOrderIDs() {
  var url = "http://137.108.92.9/openstack/api/orders?OUCU=" + oucu + "&password=" + password;
  /* Get the data */
  $.get(url, function (data) {
    var obj = $.parseJSON(data);
    if (obj.status == "success") {
      // was able to get the data successfully 
      // loop through all orders
      data = $.parseJSON(data);
        $.each(data, function(i, item) {
          //alert(item);
          orderIDs.push(data[item].id);
        });
    };
  })
}

Open in new window


I get the following error message:
index.js:49 Uncaught TypeError: Cannot read property 'id' of undefined

Line 49 is the line of code which I puts the orderID into the array.

Can someone please give me a clue what I'm doing wrong?

Thanks for your help

Massimo
0
Hi there,

I have an issue with my woocommerce mini cart.

The issue I have is that there are a few items that seem to be stuck in the cart no matter if you are logged in or not. If you try and remove them, a few seconds later they appear again.

I thought It might have been outdated plugins and template files, so I have backed up my site and updated everything along with all the template files, still the same issue.

My website is www.ingeniousgifts.co.uk and you can access the slide out mini cart from the top right of the screen.

I have attached a screen record so you can see what happens.

I would really appreciate if someone could help me find out why this is happening and how to fix it?
Home---Ingenious-Gifts.webm
0
  function getContacts(listId, cOnly) {

            if (typeof contactTable !== 'undefined')
                contactTable.destroy();
            contactTable = $('#contactstable').DataTable({
                "serverSide": true,
                "stateSave": true,
                "ordering": false,
                "searching": true,
                "oSearch": {"bSmart": false},
                "searchDelay": 1500,
                "ajax": {
                    "url": "get-contacts.php",
                    "type": "POST",
                    "data": {
                        listId: listId,
                        co: cOnly
                    }
                },
                "rowCallback": function (row, data) {
                },
                "initComplete": function (data) {
         
                },
                "columns": [
                    {"data": "contact"},
                    {"data": "email"},
                    {"data": "company"},
                    {"data": "date"},
                    {"data": "actions"}
                ],
                'columnDefs'        : [      
                { 
                    'searchable'    : false, 
                    'targets'       : [2,3,4] 
                }
            ],
                "order": [[0, 'desc']]
            });


     
        }

Open in new window



so this function creates my dataTable,

all works table it up, i only perform search functions on contact and email,

how ever it is failing to give me exact results , for example first record is  Tim Smith , i can clearly see Tim Smith, i type Tim Smith into the search input provided by data-tables, and he isnt shown in the result ?

https://datatables.net/
0
jQuery 1.11.1 (may be able to use newer version)
And yes, for now we're using mysql
I am loading a form into a div, using jQuery's load() function. I'm loading that file inside a 3rd party tab (Solid Tabs). The form submits through AJAX to a PHP file. Some jQuery functions, including the AJAX routine, need to be accessed by both the main program and the loaded form, so I created a js file, which is called up by both, since the form would not otherwise be able to access the javascript in the main file.

I am having problems troubleshooting. The process is acting like it is not finding the DBFunctions.php file, as the server is not receiving a request. However, as I was unsure of where the imported file was seeing itself, I changed the url to the full path and it is still failing. Click code works okay and the form serializes okay. Then, nothing.

Main File
    <div>
        <div id="UtilButtons">
            <div>
                <a class="btn" id="AddAdmin" href="javascript:void(0)">Add Program Admin</a>
            </div>
        </div>
    </div>

Open in new window



pAddPA.php

    <div class="SaveButton" id="ProgPAReg" data-formname="AddPA">Register</div>

Open in new window

jQueryEdit.js
    $(document).ready(function()
    {
        $("#AddAdmin").click(function()
        {
            $("#UtilButtons").hide("slow");
            $("#ReturnButton").show();
            $("#AddPAFile").show();
            

Open in new window

0
Greetings:

I'm using AJAX AjaxFileUpload.

My symptoms are the OnUploadComplete event is running twice when only 1 file is selected. The second time I receive an error as follows:

System.IO.DirectoryNotFoundException
  HResult=0x80070003
  Message=Could not find a part of the path 'C:\WINDOWS\TEMP\_AjaxFileUpload\974AB760-DCFE-2E04-E0D9-A0EE7E73221A\IMG_3001.JPG.tmp'.
  Source=mscorlib
  StackTrace:
   at System.IO.__Error.WinIOError(Int32 errorCode, String maybeFullPath)
   at System.IO.File.InternalCopy(String sourceFileName, String destFileName, Boolean overwrite, Boolean checkHost)
   at AjaxControlToolkit.AjaxFileUpload.SaveAs(String fileName)
   at Graphic.AjaxFileUpload1_UploadComplete(Object sender, AjaxFileUploadEventArgs e) in C:\inetpub\ClientWebs\AJAX File Upload Test\Graphic.aspx.vb:line 13
   at System.EventHandler`1.Invoke(Object sender, TEventArgs e)
   at AjaxControlToolkit.AjaxFileUpload.UploadRequestProcessor.XhrDone(String fileId)
   at AjaxControlToolkit.AjaxFileUpload.UploadRequestProcessor.ProcessRequest()

The AjaxFileUpload event results in this error because this event is entered a 2nd time for reasons I do not, as yet, understand.

My aspx page is as follows:
<%@ Page Language="VB" AutoEventWireup="false" CodeFile="Graphic.aspx.vb" Inherits="Graphic" %>

<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="ajaxToolkit" %>

<!DOCTYPE html>

<html 

Open in new window

0
Is there any way to assign the Search box on a JQuery/JSON/DataTable page the focus?  I want the page below to have the search box keep the focus so end users viewing their results can just step up and enter their bib number to view their results.  Thanks!

https://www.gopherstateevents.com/results/fitness_events/digital_results.asp?event_id=811&race_id=1404
0
Access to XMLHttpRequest at 'http://someURL' from origin 'http://someURL' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: The 'Access-Control-Allow-Origin' header contains multiple values '*, *', but only one is allowed.


This is a call to a REST API controller action method. I enabled CORS on the top of controller like below:
[EnableCors(origins: "*", headers: "*", methods: "*")]
 public class TestController : ApiController
    {
    }

Open in new window


Also in the web.config:

<httpProtocol>
      <customHeaders>
        <add name="Access-Control-Allow-Credentials" value="true" />
        <add name="Access-Control-Allow-Headers" value="Content-Type" />
        <add name="Access-Control-Allow-Methods" value="GET,POST,PUT,DELETE" />
		<add name="Access-Control-Allow-Origin" value="*" />
      </customHeaders>
    </httpProtocol>

Open in new window


Any ideas please thanks.
1
https://stackoverflow.com/questions/32470906/how-to-upload-a-image-in-asp-net-mvc-using-ajax-request

I use above codes to upload a file. but if I want to add a parameter from <input type="text" id="firstname"> to ajax like below. How can I do that? Basically, I upload the image but I also want to update the database behind.


type: "POST",
           url: '/Home/Upload',
           data: formData, document.getelementid("firstname").value,
           dataType: 'json',
           contentType: false,
0
Hi,

This following function works fine.

function loadData() {
  const xhr = new XMLHttpRequest();
  xhr.open('get', 'data.txt', true);
  xhr.onload = function () {
    console.log('ReadyState', this.readyState);
    console.log(this.status);
    if (this.status == 200) {
      document.getElementById('output').innerHTML = `<h1>${this.responseText}</h1>`;
    }
  }
  xhr.send();
}

Open in new window


However, when I use an arrow function for xhr.onload, the code is not working.
any idea why?  Also how should I fix this issue?

function loadData() {
  const xhr = new XMLHttpRequest();
  xhr.open('get', 'data.txt', true);

  xhr.onload = () => {
    console.log('ReadyState', this.readyState);
    console.log(this.status);
    if (this.status == 200) {
      document.getElementById('output').innerHTML = `<h1>${this.responseText}</h1>`;
    }
  }
  xhr.send();
}

Open in new window

0
JSON POST.  Can anyone show me a simple example of a JSON POST?
0
I use js datatable and everything is working. Now I want to use ajax loading because my report will take some time to generate the report.
I tried to use processing in the js datatable but it is not working to me. Hope you can show me how it works.


 $('#data-table').DataTable({
                            "dom": 'Bfrtip',
                            "buttons": ['copyHtml5', 'excelHtml5', 'pdfHtml5', 'csvHtml5'],
                            "paging": true,
                            "ordering": true,
                            "info": true,
                            "bDeferRender": true,
                            "pageLength": 100,
                            "scrollY": 600,
                            "bSort": true,
                            "stateSave": true,
                            "fixedHeader": true,
                            "responsive": true,
                            "bDestroy": true
                        });

Open in new window

1
The following item is not working and not sure why.

1. I see the result set / value, but the first row shown 'No data available in table'
2. when I click on the <th></th> and try to sort, all data is disappeared.
3. when the table is loading (it may take 10 seconds just because of the large report),
where i can add the like ajax loading animated images? or how should I handle it?
4. The paging is not working. it shows every rows (10,000).
5. when I keep refresh the webpage, it keeps adding up the rows every 10,000

Thanks




 
 <table id="data-table" class="table table-bordered" width="100%">
                    <thead>
                        <tr>
                            <th>Row Count</th>
                            <th>id</th>
                        </tr>
                    </thead>
                </table>

 function test2() {
        $(document).ready(function () {
            $('#data-table').DataTable({
                "paging": true,
                "ordering": true,
                "info": false,
                "bProcessing": true,
                "bDeferRender": true,
                "pageLength": 50,
                "scrollY": 600,
                "bSort": true,
                "stateSave": true
            });
            var tr;
            var data = new Array();
            var x=0;
            $.ajax({
                url: "/Accounting/TestMe",
                type: "Post",
                data: JSON.stringify(data),
              

Open in new window

0
I have an ASP.Net webforms app with a GridView.  (The Gridview automatically generates the columns on binding because the data source is dynamic and the number of columns vary.)

I have code in place so when a cell in the GridView is clicked by the user it will display some data relative to the clicked cell in a Panel via the ModalPopupExtender control (from AJAX control toolkit).

The problem I have is the ModalPopupExtender fires BEFORE the GridView_RowCommand.   I need to run a query in the GridView_RowCommand event to collect the data to populate the labels in the Panel control, that is displayed via the ModalPopupExtender.   The query needs to run in the GridView_RowCommand event because this is where I get the needed Row and Cell index data for the query.

How do I get the ModalPopupExtender to fire AFTER the GridView_RowCommand event?

ASPX code (Pertinent):

<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="ajaxToolkit" %>


    <style type="text/css">

   .modalBackground

    {

        background-color: Black;
        filter: alpha(opacity=90);
        opacity: 0.8;

    }

    .modalPopup

    {

        background-color: #FFFFFF;
        border-width: 3px;
        border-style: solid;
        border-color: black;
        padding-top: 10px;
        padding-left: 10px;
        width: 300px;
        height: 140px;

    }

        </style>


                        <asp:GridView ID="grdKanban" runat="server" 

Open in new window

0
hi experts. can you show me super simple demo with mvc web api (without entity framework)  that using js datatable?
I have some troubles on the ajax part. The web api is showing data in the browser but I have some trouble to call web api in ajax jquery.
0
I would normally just echo out the search results using php when doing an Ajax search but this time I am trying to use a json response instead. For seem reason I am getting duplicate results like:

result 1
result 2
result 1
result 2

when it should just be

result 1
result 2

DB Query:

    public static function searchContacts($searchText)
    {
        $searchTerm = "%{$searchText}%";
        
        $db = static::getDB();
        $stmt = $db->prepare("SELECT `id`, `first_name` FROM `contacts` WHERE `first_name` LIKE ?");
        $stmt->execute([$searchTerm]);
        return $stmt->fetchAll(PDO::FETCH_CLASS, get_called_class());
    }

Open in new window


Controller:

    public function search()
    {
        if ($_SERVER['REQUEST_METHOD'] === 'POST') {
            
            $response = [];
            
            $searchText = trim($_POST['searchText']);
            
            $searchResults = Contact::searchContacts($searchText);
            $response['results'] = $searchResults;
            
            echo json_encode($response);
            
        }
    }

Open in new window


jQuery/Ajax

    $('#search').keyup(function () {
        var searchText = $('#search').val();
        if (searchText.length > 3) {
            $.ajax({
                    url: url + '/Contacts/search',
                    type: 'POST',
                    dataType: 'json',
                    data: {
                        searchText: searchText
                    }
                })

                .done(function (data) {

                    $.each(data.results, function (index, item) {
                        $('.search-results').append("<a href=' " + url + '/contacts/' + item.id + " '>" + item.first_name + "</a>" + "<br>").show();
                    });
                })

                .fail(function (jqXHR, textStatus, errorThrown) {
                    console.log(textStatus + ': ' + errorThrown);
                    console.warn(jqXHR.responseText);
                });
        } else {
            $('.search-results').hide();
        }
    });

Open in new window

0
AJAX and Javascript.  I have a function that creates an HTML Box.  However, the "dialog" is not placed in the box.  Here is the final script:

                self.options.dialogEl.dialog({
                    resizable: false,
                    draggable: true,
                    closeOnEscape: true,
                    width: data.error ? 320 : 640,
                    buttons: buttons
                });
                if (typeof self.options.onResponse == 'function')
                    self.options.onResponse(response);
            }

Open in new window


The line :  self.options.dialogEl.html(text);  Creates the box   But the Dialog / Buttons are not there.  Can anyone offer insight?
Most of the code:
 text = self.interpolate(templates.success, interpolateData);
                    buttons = [
                        {
                            'text': 'Apply Recommendation',
                            click: function () {
                                self.options.enabled = false;
                                hidePageSubmitIndicator();
                                jQuery(this).dialog("close");
                                jQuery(self.options.formFields.Address1).val(data.recommended.Address1);
                                jQuery(self.options.formFields.City).val(data.recommended.City);
                                jQuery(self.options.formFields.State).val(data.recommended.State);
                                

Open in new window

0
AJAX JSON Return.  Right now in my script that I am working on, the script returns a JSON response of a variable $response.  I want to also include $verifyResponse.  I'm not 100% sure how to write it.  This is what is in the code:

<?php
 comMember_activity_log::post('asa_address_validate', array('response' => $response, 'verifyResponse' => $verifyResponse));


// Respond
  header('Content-Type: application/json');
  echo json_encode($response,  JSON_PARTIAL_OUTPUT_ON_ERROR);

Open in new window

The var $response has half of the info I need.  $verifyResponse has the rest.  This is what the info looks like from the Network console of the JSON return:

{"error":false,"message":"","address":{"Address1":null,"Address2":"Blah Blah Court","City":"Hammond","State":"MS","Zip5":"1111","Zip4":null},"recommended":{"Address1":"Blah Blah Court","Address2":"","City":"Hamond","State":"MS","Zip5":"1111","Zip4":null},"verifyResponse":null}

Open in new window

There is info in the verifyResponse I need.
0

AJAX

12K

Solutions

7K

Contributors

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.

Top Experts In
AJAX
<
Monthly
>