Develop Reference

Ajax function in javascript is not working in mozilla firefox browser, why?

Follownig is my javascript code, ajax function is used to read response from
server. but xmlhttp.status is always 0 in firefox browser, why? please help me.
function ajaxAsyncRequest() {
var xmlhttp;
if (window.XMLHttpRequest) {
xmlhttp = new XMLHttpRequest();
} else {
xmlhttp = new ActiveObject("Microsoft.XMLHTTP");
}
//creating asynchrounous GET request
var tempValUrl = $(".urlVal").val();
var urls = tempValUrl + '/Department/departmentAdminTokenReceive';
xmlhttp.open("GET", urls, true);
xmlhttp.send();
xmlhttp.onreadystatechange = function() {
if (xmlhttp.readyState == 4) {
alert("readyState"+xmlhttp.readyState);
alert("status"+xmlhttp.status);
if (xmlhttp.status == 200) {
var data = xmlhttp.responseText;
//for signing
var signarr = data.split("$$");
//for signing
document.getElementById('signName').value = signarr[1];
document.getElementById('signCertName').value = signarr[2];
document.getElementById('signCa').value = signarr[3];
document.getElementById('signExpiryDate').value = signarr[4];
document.getElementById('signPublicKey').value = signarr[5];
}
}
}
}

If my javascript array has values that have two elements how can I use one element without the other?

My alert(arr[0]) equals something like
http://server/folder/images/title.png, tagname
I want to be able to display the image and use the tagname to sort the order. The build function and json etc is working. I just want to be able access path on it's own and the tag on it's own but still have them related to each other for ordering.
function importJson(str) {
if (str=="") {
document.getElementById("content").innerHTML="";
return;
}
if (window.XMLHttpRequest) {
// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
} else { // code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function() {
if (xmlhttp.readyState==4 && xmlhttp.status == 200){
//alert(xmlhttp.response);
arr = JSON.parse(xmlhttp.response);
for (var index = 0; index < arr.length; var parts = arr[i].split(',');
var url = parts[0].trim();
var tag = parts[1].trim();
alert("h"); index++){
}
buildImage(url);
}
}
xmlhttp.open("GET","http://xxxx/~xx/xxxx/content.php");
xmlhttp.responseType = "json";
xmlhttp.send();
function buildImage(imagesrc) {
var img = document.createElement('img');
img.src = imagesrc;
document.getElementById('content').appendChild(img);
}
}
Current Code:
var arr = [];
var index = 0;
function importJson(str) {
if (str=="") {
document.getElementById("content").innerHTML="";
return;
}
if (window.XMLHttpRequest) {
// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
} else { // code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function() {
if (xmlhttp.readyState==4 && xmlhttp.status == 200){
// alert(xmlhttp.response);
arr = JSON.parse(xmlhttp.response);
for (var index = 0; index < arr.length; index++) {
var url = arr[index][0];
var tag = arr[index][1];
buildImage1(url);
}
//buildImage(arr[0]);
}
}
xmlhttp.open("GET","http://cs1.ucc.ie/~mmg6/swipeApp/content.php");
xmlhttp.responseType = "json";
xmlhttp.send();
function buildImage1(imagesrc) {
var img = document.createElement('img');
img.src = imagesrc;
document.getElementById('content').appendChild(img);
}
}

You're returning a 2-dimensional array from your AJAX. So just access the appropriate index of each element of the main array.
for (var index = 0; index < arr.length; index++) {
var url = arr[index][0];
var tag = arr[index][1];
buildImage(url);
}
Then buildImage should take two arguments:
function buildImage(imagesrc) {
var img = document.createElement('img');
img.src = imagesrc;
document.getElementById('content').appendChild(img);
}
DEMO

Json object successfully filled with xmlhttprequest suddenly is "null"

function getOptionsData()
{
var xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState == 4 && xmlhttp.status == 200)
{
json_options = JSON.parse(xmlhttp.responseText);
}
}
xmlhttp.open("GET", "getData.php", true);
xmlhttp.send();
}
"json_options" is a global variable, which should get filled with the responseText of the XMLHttpRequest, which is containing a valid json String:
[{"id":"3","model":"NZ\/","model1":"","tablenr":"1","tabkey":"SSG\/","length":"4","descript":"Schukostecker gerade","matchcode":"","price":"0","pricex":"0","code":"1","textnr":"0","artikelnr":"0","funktion":"Seite 1"},{"id":"4","model":"NZ\/","model1":"","tablenr":"1","tabkey":"SWS\/","length":"4","descript":"Schuko gewinkelt \/ angled 90 Grad","matchcode":"","price":"0","pricex":"0","code":"1","textnr":"0","artikelnr":"0","funktion":"Seite 1"}]
At this point everything is fine and json_options contains a valid json Object.
The function "getOptionsData" gets called in the function "createOptionsTable":
function createOptionsTable()
{
getOptionsData();
var element = null;
for(var i = 0; i < json_options.length; i++)
{
[...]
When i want to access "json_options" at this point, it says that it is null and i dont have any idea why.
Any help is greatly appreciated, thanks in advance!

In your code the code after getOptionsData(); is executed before the call's success callback. so u get json_options as null
Try like this
function getOptionsData(callback)
{
var xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState == 4 && xmlhttp.status == 200)
{
json_options = JSON.parse(xmlhttp.responseText);
callback();
}
}
xmlhttp.open("GET", "getData.php", true);
xmlhttp.send();
}
function createOptionsTable()
{
var callback = function()
{
var element = null;
for(var i = 0; i < json_options.length; i++)
{
[...]
}
}
getOptionsData(callback);
}

function getOptionsData()
{
var xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState == 4 && xmlhttp.status == 200)
{
json_options = JSON.parse(xmlhttp.responseText);
for(var i = 0; i < json_options.length; i++)
{
[...]
}
}
}
xmlhttp.open("GET", "getData.php", true);
xmlhttp.send();
}
Your for loop should execute after you could actually get the reponse from ajax and not inside createOptionsTable()...

JS file works fine on IE but not on other browsers

The function below gets results in ie but not on the other browsers. Any suggestion?
function show_packet(str, company) {
var cam = document.getElementById("company");
if (window.XMLHttpRequest) {
var xmlhttp = new XMLHttpRequest();
} else {
var xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange = function () {
if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
document.getElementById("packet_1").innerHTML = xmlhttp.responseText;
document.getElementById("icon_1").innerHTML = "";
}
}
xmlhttp.open("GET", "show_packet.php?car_moto=" + encodeURIComponent(str, true) + "&cam=" + encodeURIComponent(cam.value, true));
xmlhttp.send();
}

vars and functions are hoisted to the top of their containing function. Declare your var once at the top, and only assign it in the if/else.

Returning an array and storing into another array, creating a multidimensional array

EDIT: I've tried to implemented the solution, but it still doesn't work. Sorry i'm a programming idiot. Thanks for the link to the page.
In my first function databaseBOscreens i am attempting to obtain symbols of stocks according to the filter selected for a broker and/or an asset class. The function sends a request to another file which performs SELECT statement to lookup for the relevant symbols using mysqli. The result would be an array of symbols, which i then encode and subsequently parsed in this js function.
Each symbol will then go through a second process, which is my second function generatePrice() to obtain the historical prices for that particular symbol. What i'm trying to do is to loop through all symbols to generate and store the priceArr as an array in the resultArr. Sorry for being unclear.
function databaseBOscreens(broker,assetClass) {
var xhr;
if (window.XMLHttpRequest) {
xhr = new XMLHttpRequest();
}
else if (window.ActiveXObject) {
xhr = new ActiveXObject("Microsoft.XMLHTTP");
}
var data = "broker=" + broker + "&category=" + assetClass;
xhr.open("POST", "generateSymbol.php", true);
xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
xhr.send(data);
xhr.onreadystatechange = receive_data;
function receive_data() {
if (xhr.readyState == 4 && xhr.status == 200)
{
var resultArr = JSON.parse(xhr.responseText);
var priceArr = new Array();
for(var ctr=0;ctr<resultArr.length;ctr++)
{
generatePrice(function(result,resultArr[ctr].symbol)){
priceArr[ctr] = result;
}
}
}
}
}
function generatePrice(callback,symbol) {
var xhr2;
if (window.XMLHttpRequest) {
xhr2 = new XMLHttpRequest();
}
else if (window.ActiveXObject) {
xhr2 = new ActiveXObject("Microsoft.XMLHTTP");
}
var data2 = "symbol=" + symbol;
xhr2.open("POST", "generatePrice.php", true);
xhr2.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
xhr2.send(data2);
xhr2.onreadystatechange = receive_data2;
function receive_data2() {
if (xhr2.readyState === 4)
{
if (xhr2.status === 200)
{
var priceArr = JSON.parse(xhr2.responseText);
callback(priceArr);
}
}
}
}
function receive_data() {
if (xhr.readyState == 4 && xhr.status == 200)
{
var resultArr = JSON.parse(xhr.responseText);
var priceArray = new Array();
for(var ctr=0;ctr<resultArr.length;ctr++)
{
priceArray = generatePrice(resultArr[ctr].symbol);
}
alert(priceArray.length);
}
}
My function generatePrice() returns an array, but i can't seem to store it in another array to create a multidimensional array. I've search everywhere i can't seem to get it work. Thanks in advance for any help rendered
generatePrice function:
function generatePrice(symbol) {
var xhr2;
if (window.XMLHttpRequest) {
xhr2 = new XMLHttpRequest();
} else if (window.ActiveXObject) {
xhr2 = new ActiveXObject("Microsoft.XMLHTTP");
}
var data2 = "symbol=" + symbol;
xhr2.open("POST", "generatePrice.php", true);
xhr2.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
xhr2.send(data2);
xhr2.onreadystatechange = receive_data2;
function receive_data2() {
if (xhr2.readyState == 4 && xhr2.status == 200)
{
var priceArr = JSON.parse(xhr2.responseText);
return priceArr;
}
}
}

My function generatePrice() returns an array,
No it doesn't, it returns undefined. XHR is asynchronous, see How do I return the response from an asynchronous call?.
priceArray = generatePrice(resultArr[ctr].symbol);
I can't seem to store it in another array
You didn't attempt to do so, you just stored the result of every call in the priceArray variable - instead of in a property of the array. Use
priceArray[ctr] = generatePrice(resultArr[ctr].symbol);
// or
priceArray.push( generatePrice(resultArr[ctr].symbol) );