Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 5 of 5
  1. #1
    New to the CF scene
    Join Date
    Sep 2008
    Posts
    5
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Exclamation Object Oriented Gone Wrong

    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:

    Code:
    /*****************
     * @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:
    Code:
    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

  • #2
    Senior Coder A1ien51's Avatar
    Join Date
    Jun 2002
    Location
    Between DC and Baltimore In a Cave
    Posts
    2,717
    Thanks
    1
    Thanked 94 Times in 88 Posts
    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
    Tech Author [Ajax In Action, JavaScript: Visual Blueprint]

  • #3
    New to the CF scene
    Join Date
    Sep 2008
    Posts
    5
    Thanks
    1
    Thanked 0 Times in 0 Posts
    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:

    Code:
    req.onreadystatechange = alert(req.readyState);
    That works fine but if I reference another function other than alert it fails to run...

  • #4
    Senior Coder A1ien51's Avatar
    Join Date
    Jun 2002
    Location
    Between DC and Baltimore In a Cave
    Posts
    2,717
    Thanks
    1
    Thanked 94 Times in 88 Posts
    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
    Tech Author [Ajax In Action, JavaScript: Visual Blueprint]

  • Users who have thanked A1ien51 for this post:

    jaitaiwan (09-16-2008)

  • #5
    New to the CF scene
    Join Date
    Sep 2008
    Posts
    5
    Thanks
    1
    Thanked 0 Times in 0 Posts
    Thankyou soo much, very helpful indeed. Problem Solved


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •