Problems with ajax request from a window

[sonic_2k_uk]

Hi,

I have a problem trying to call a method in the parent window from a popup.

The problem isn't that the parent method cannot be called, but the method is either not managing to find an attribute or the ajax request it is executing is not being dealt with correctly.

The situation -

I have an object called "Event" with a method called "updateSessionDate", which runs as it should. The method uses an ajax object to execute an ajax request.

A date input field has an onchange event so that it calls the updateSessionDate method when the field is updated.

There is also an option to open up a popup with a calendar, which lists a bunch of dates, and when clicked updates the date input field.

When the date field is changed in this fashion the onchange event is not triggered. This could cause a few problems, so i have been attempting to call the updateSessionDate method from the popup window when a date is clicked.

/*
* Event.updateSessionDate Function
* Update the session date
* @param integer sessionID Breakout Session ID
*/
 
Event.prototype.updateSessionDate = function (sessionID)
{
 
	// Get details
 
	var arrDetails	= new Array (
		new Array ("action",						'update'),
		new Array ("section",						'sessions'),
		new Array ("type",							'session'),
		new Array ("value",							'date'),
		new Array ("event_id",						this.intEventID),
		new Array ("session_id",					sessionID),
		new Array ("session_date",					document.getElementById ('breakoutsessions-' + sessionID + '-date').value)
	);
 
	// Set query
 
	this.objAjax.setQuery (arrDetails);
 
	// Set Return
 
	this.objAjax.setReturn (new Array ('returnUpdate', this));
 
	// Post
 
	this.objAjax.Post ();
 
}

/*
* Ajax.Post Function
* Send a post ajax request
*/
 
Ajax.prototype.Post = function ()
{
 
	// Set HTTP request
 
	this.setRequest ();
 
	// Set the current object
 
	var _this			= this;
 
	// Set the state change function for the request object
 
	this.objRequest.onreadystatechange	= function () { _this.requestChange () };
 
	// Open request
 
	this.objRequest.open ('POST', this.strURL, true);
 
	// Set request header
 
	this.objRequest.setRequestHeader ("Content-type", "application/x-www-form-urlencoded");
 
	// Send the request
 
	this.objRequest.send (this.strQuery);
}
 
 
/*
* Ajax.requestChange Function
* Ran when the ajax object state changes
* readyState Codes:
* 0 = uninitialized
* 1 = loading
* 2 = loaded
* 3 = interactive
* 4 = complete
*/
 
Ajax.prototype.requestChange = function ()
{
 
	// If the request is complete
 
	if (this.objRequest.readyState == 4)
	{
 
		// Run the return function and pass the returned text
 
		if (this.objParent)
		{
 
			eval ('this.objParent.' + this.strReturn + '.call(this.objParent, this.objRequest.responseText);');
 
		}
		else
		{
 
			eval (this.strReturn + '(this.objRequest.responseText);');
 
		}
 
	}
 
}

And onto the problem...

The following code is called when a date is clicked in the calendar popup:

opener.objEvent.updateSessionDate (id);

Now i'd expected this to work, but it does not return any data from the ajax request.

The request is still executed and the query string is sent (tried alerting the string, and it works fine), and the requestChange method is called, but no response is returned UNLESS i add the alert after the this.objRequest.send () call in the ajax post method, and everything works fine!!!

I had also tried using something along the lines of:

opener.objEvent.updateSessionDate.call (opener.document.getElementById('elementID'), id);

But an error saying that "this.objAjax has no properties" referencing the ajax setQuery method call in the updateSessionDate method is returned.

If anyone is still reading this, any help is much appreciated!

Many thanks,

Andy

[gRoberts]

try window.opener rather then just opener. Also, make sure your window is being opened using window.open.

[sonic_2k_uk]

Hi,

Thanks for your reply.

Have used window.opener.objEvent.updateSessionDate (id); instead, and still same problem with no response.

Cheers,

Andy

[gRoberts]

Does the updateSessionDate work on the parent page? what is objEvent?

[sonic_2k_uk]

Yes updateSessionDate works correctly on the parent page, just not when called from the popup.

objEvent is an object that contains the updateSessionDate method. It also contains other methods to deal with other event details as, apposed to an event session, and attrbitures such as the event ID and the ajax object, which are set in the object constructor.

[gRoberts]

use

alert(typeof(window.opener) + '\n' + typeof(window.opener.objEvent) + '\n' + typeof(window.opener.objEvent.updateSessionDate));

What does the above return?

[sonic_2k_uk]

Run in the popup in window:

object
object
function

[gRoberts]

very strange.

In your updateSessionDate, have you tried putting an alert to see whether it's actually being hit? Also, if your using Firefox, to install FireBug and then you can debug whats happening.

Also, could be worth typing the following into your address bar whilst the pop-up is open:

javascript:window.opener.objEvent.updateSessionDate('test'); and seeing whether it works?

[sonic_2k_uk]

Hi,

Yes the updateSessionDate and the ajax methods, and ajax return method are all being called. The problem seems to be that unless i put something like an alert after the post in the ajax post method nothing is returned.

The javascript:window.opener.objEvent.updateSessionDate('test'); in the address bar works.

[sonic_2k_uk]

Solved!

Problem was that async was enabled for every ajax request, which it didnt like on this occasion:

http://developer.mozilla.org/en/docs...chronous_Usage

Ajax method modified as follows:

/*
* Ajax.Post Function
* Send a post ajax request
*/
 
Ajax.prototype.Post = function (blnAsync)
{
 
	// Set HTTP request
 
	this.setRequest ();
 
	// Set the current object
 
	var _this			= this;
 
	// Set the state change function for the request object
 
	this.objRequest.onreadystatechange	= function () { _this.requestChange () };
 
	// Sort out request sync
 
	if (blnAsync == undefined)
	{
 
		blnAsync	= true;	
 
	}
 
	// Open request
 
	this.objRequest.open ('POST', this.strURL, blnAsync);
 
	// Set request header
 
	this.objRequest.setRequestHeader ("Content-type", "application/x-www-form-urlencoded");
 
	// Send the request
 
	this.objRequest.send (this.strQuery);
 
}

Many thanks,

Andy

(Shout out for Dave @ BF - cheers for the help)