...

View Full Version : Object Oriented Gone Wrong



jaitaiwan
09-15-2008, 03:53 AM
Hey Guys I'm new to the forums....

I have been making my own AJAX framework but unfortunatly for some reason it seems to not work under IE 6 or 7 Firefox or Google Chrome.

I have isolated the problem to where the onreadystatechange function is activated. The function doesnot appear to run.

However it appears the server is still requested and a result is returned.

Here's the Ajax Framework:



/*****************
* @author Daniel Holmes
* This File is copyrighted and not to be reproduced in part or
* full without the authors permission
*/

function dAjax()
{
this.method = NULL;
this.param = NULL;
this.async = true;
this.url = '';
this.status = NULL;
this.req = NULL;
this.statusText = '';
this.postData = NULL;
this.readyState = NULL;
this.responseText = NULL;
}
dAjax.init = function ()
{
if(!this.req)
{
try
{
this.req = new XMLHttpRequest();
}
catch (e)
{
try
{
this.req = new ActiveXObject('MSXML2.XMLHTTP');
}
catch (e)
{
try
{
this.req = new ActiveXObject('Microsoft.XMLHTTP');
}
catch (e)
{
return false;
}
}
}
}
return this.req;
};



dAjax.doQuery = function (element)
{
if(!this.init())
{
this.debug.errorCode += "\nError Code: init1. Could not create dAjax Module\n";
alert("Your Browser cannot run the application.\nPlease Return to the homepage for alternatives");
return;
}

var self = this;
var req = this.req
if(this.method == "POST") {
req.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
req.setRequestHeader("Content-length", this.param.length);
req.setRequestHeader("Connection", "close");
}
req.open(this.method, this.url, this.async);
req.onreadystatechange = function() {
if(self.readyState == 4) {
//this alert or any in this function doesnt run
alert('ready4');
dAjax.response( self.responseText, self.status, self.mimeType, element);
}
};
//the following alert runs
alert("sdjf")
this.req.send(this.postData);
//dAjax.response(this.req.responseText,this.req.status,this.req.mimeType,'me')
};

dAjax.response = function (response, status, mimeType, element)
{
dAjax.animation.fade.out(element);
setTimeout("document.getElementById('"+element+"').innerHTML = '"+response+"';",1400);
setTimeout("dAjax.animation.fade.into('"+element+"')",1500);
return true;
};

dAjax.abort = function ()
{
if(this.init)
{
this.onreadystatechange = null;
this.req.abort();
this.req = null;
}
};

/*Begin Animation Functions*/

dAjax.animation = {};

dAjax.animation.setOpacity = function(level,element) {
//element = document.getElementById(element);
element.style.opacity = level;
element.style.MozOpacity = level;
element.style.KhtmlOpacity = level;
element.style.filter = "alpha(opacity=" + (level * 100) + ");";
}

dAjax.animation.fade = {};
dAjax.animation.fade.duration = 1000;
dAjax.animation.fade.delay = 5000;
dAjax.animation.fade.steps = 20;


dAjax.animation.fade.into = function (element) {
for (i = 0; i <= 2; i += (1 / dAjax.animation.fade.steps)) {
setTimeout("dAjax.animation.setOpacity(" + i + ","+element+")", i * dAjax.animation.fade.duration);
}
}

dAjax.animation.fade.out = function (element) {
for (i = 0; i <= 2; i += (1 / dAjax.animation.fade.steps)) {
setTimeout("dAjax.animation.setOpacity(" + (1 - i) + ","+element+")", i * dAjax.animation.fade.duration);
}
}



Some Example Code to activate a request:


function init() {
dAjax.url = './ajax.php'; //the file that the request is sent to
dAjax.method = "GET"; //the method used to request
dAjax.params = '&action=getData'; //any params need for the file
dAjax.doQuery('elementToChange'); // do the request specifying which element to update
}


As a side note I have been using firebug and the IE developer toolbar to work this out.

Hope Someone can help:thumbsup:

A1ien51
09-15-2008, 05:20 AM
You have self pointing to the wrong thing inside that function. I am guessing that self.readyState is always null.

Hopefully that points you in the right direction.

Eric

jaitaiwan
09-16-2008, 12:36 AM
Unfortunately eric readyState is not null.... it returns all the values it should.

What I have done to try and get this to work is just make:


req.onreadystatechange = alert(req.readyState);

That works fine but if I reference another function other than alert it fails to run...:confused:

A1ien51
09-16-2008, 02:43 AM
self here

if(self.readyState == 4)

is not the same thing as req

You do it correctly here:
this.req.send(this.postData);

You do it incorrectly here
if(self.readyState == 4)

If you still do not get it, you are not referencing req.

self.req.readyState

Eric

jaitaiwan
09-16-2008, 10:08 AM
Thankyou soo much, very helpful indeed. Problem Solved:thumbsup:



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum