Javascript return array through http request - javascript

I am opening a PHP file with http request:
// Load PHP File for Ajax
function downloadUrl(url, callback) {
var request = window.ActiveXObject ? new ActiveXObject('Microsoft.XMLHTTP') : new XMLHttpRequest;
request.onreadystatechange = function() {
if (request.readyState == 4) {
request.onreadystatechange = doNothing;
callback(request.responseText, request.status);
}
};
request.open('GET', url, true);
request.send(null);
}
However, that (url) will be returning an array as so in PHP:
return array(
'xml' => $googleMaps->generateXML($results),
'results' => $googleMaps->getResults()
);
So when I call the function as so:
// generate xml and markup map
downloadUrl(searchURL, function(data) {
var xml = parseXml(data);
}
I want to be able to distinguish between the xml and results indexes in the array. I return it as data. I'm just confused on how to parse just the xml and not the entire array.

Related

How to get array from ajax call in javascript

My ajax call looks like this:
request = new XMLHttpRequest();
request.open("GET","/showChamps?textInput=" + searchChamp.value,true);
request.send(null);
request.onreadystatechange = function () {
if (request.status == 200 && request.readyState == 4) {
//how do i get my array
}
};
}
I have sent an array from my node.js server but I don't know how to get that array because request.responseText does not give me back an array. Also it would be appreciated if the answer is in javascript.
Thanks in Advance!
var xhr = new XMLHttpRequest();
xhr.onload = function() {
if(xhr.status === 200) {
var responseHTML = xhr.responseText, // HTML
responseXML = xhr.responseXML, // XML
responseObject = JSON.parse(xhr.responseText); // JSON
}
};

open and read binary file (javascript)

I have a binary file on a server and I want to read it.
I did something like that to get the file :
var request = new XMLHttpRequest();
request.open("GET", file);
request.onreadystatechange = function() {
if (request.readyState == 4) {
doSomething(request.responseText);
}
}
request.send();
but after that I'm not really sure what to do... What is the proper way to do this ?
is there a way to use fileReader.readAsArrayBuffer() to do what I want to do ?
Set the responseType to arrayBuffer like so:
var request = new XMLHttpRequest();
request.open("GET", file);
request.responseType = 'arrayBuffer'; // the important part
request.onreadystatechange = function() {
if (request.readyState == 4) {
doSomething(request.mozResponseArrayBuffer || request.response); // your arrayBuffer
}
}
request.send();

Explanation of downloadUrl() in Javascript?

I have looked far and wide for an explanation so that i am able to understand the above function. The situation which i have encountered it is in Google Maps API documentation:
function downloadUrl(url, callback) {
var request = window.ActiveXObject ?
new ActiveXObject('Microsoft.XMLHTTP') :
new XMLHttpRequest;
request.onreadystatechange = function() {
if (request.readyState == 4) {
request.onreadystatechange = doNothing;
callback(request.responseText, request.status);
}
};
request.open('GET', url, true);
request.send(null);
}
function doNothing() {}
If someone could shed some light it would be appreciated.
function downloadUrl(url, callback) { // pass a URL and a function to call on success
var request = window.ActiveXObject ?
new ActiveXObject('Microsoft.XMLHTTP') :
new XMLHttpRequest; // create an xmlhttprequest, native if possible, activeX for older IE - the construct is a ternary conditional statement
// set up handling of the state change, we only want the 4th
request.onreadystatechange = function() { // when the request changes state
// i.e from sending to having received
if (request.readyState == 4) { // request done
request.onreadystatechange = doNothing; // removed this anonymous function on 4th state (done)
callback(request.responseText, request.status); // call the supplied function with result
}
};
request.open('GET', url, true); // now initialize
request.send(null); // now execute
}
Update: it is these days (July 2018) more likely to find the XMLHttpRequest than the activeX, so any of the following are recommended:
switch the test around,
remove the test for activeX,
add a try/catch or
use Fetch
this code uses AJAX functionality in the browser to fetch the contents of the URL.

function to return string in javascript

I am trying to call an ajax request to my server for json data using a function. If I console out the resp variable inside the ajax function it will show the data successfully. If i try to set the ajax function to a variable, and then console that variable it returns undefined. Any ideas who to make the function request the data and then set ti to a variable to be consoled?
function jsonData(URL) {
var xhr = new XMLHttpRequest();
xhr.open("GET", URL, true);
xhr.onreadystatechange = function() {
if (xhr.readyState == 4) {
var resp = JSON.parse(xhr.responseText);
return resp;
}
}
xhr.send();
}
jsonString = jsonData(http://mywebsite.com/test.php?data=test);
console.log(jsonString);
This is actually pretty simple.. Change your call to by synchronous..
xhr.open("GET", URL, false);
That being said this will block the browser until the operation has been completed and if you can use a callback instead it would likely be preferred.
function jsonData(URL, cb) {
var xhr = new XMLHttpRequest();
xhr.open("GET", URL, true);
xhr.onreadystatechange = function() {
if (xhr.readyState == 4) {
var resp = JSON.parse(xhr.responseText);
cb(resp);
}
}
xhr.send();
}
jsonData("http://mywebsite.com/test.php?data=test"
, function(data) { console.log(data); });

javascript XMLHttpRequest requestXML is null

I'm trying to grab an xml document from a url and then parse it. I am able to open it fine on a browser, but it doesnt seem to work through my javascript. Can anyone help me?
function downloadUrl(url, callback) {
var request = window.ActiveXObject ?
new ActiveXObject('Microsoft.XMLHTTP') :
new XMLHttpRequest;
request.onreadystatechange = function() {
if (request.readyState == 4) {
request.onreadystatechange = function(){};
callback(request, request.status);
}
};
request.open('GET', "url", true);
request.send(null);
}
downloadUrl("http://jojo.theone.net/survey.xml", function(data) {
alert("Inside downloadURL"); // shows up
var xml = request.responseXML;
alert(xml); // Doesn't even show up.
alert(request.responseText); // Doesnt show up.
});
You are using data as the parameter name in your callback method, but calling the callback method as callback(request, request.status). The result is that the request object is now in the var called "data", and the request.status is not referenced at all.
Try
downloadUrl("http://jojo.theone.net/survey.xml", function(request, status) {
alert("Inside downloadURL");
var xml = request.responseXML;
alert(xml);
alert(request.responseText);
});
Try to use data value not the request object. Also it is better to use some framework like Mootools or jQuery to perform AJAX requests -- you'll get a more compatible and predictable interface.
Also note that request will fail if the url you're requesting has different server, port and protocol than the script that is making request.

Categories

Resources