SitePoint Sponsor |
|
User Tag List
Results 1 to 10 of 10
-
Jun 20, 2007, 05:46 #1
Problems with ajax request from a window
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.
Code JavaScript:/* * 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 (); }
Code JavaScript:/* * 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:
Code JavaScript: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:
Code JavaScript: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
-
Jun 20, 2007, 06:28 #2
- Join Date
- Oct 2004
- Location
- Birtley, UK
- Posts
- 2,439
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
try window.opener rather then just opener. Also, make sure your window is being opened using window.open.
-
Jun 20, 2007, 06:34 #3
Hi,
Thanks for your reply.
Have used window.opener.objEvent.updateSessionDate (id); instead, and still same problem with no response.
Cheers,
Andy
-
Jun 20, 2007, 06:52 #4
- Join Date
- Oct 2004
- Location
- Birtley, UK
- Posts
- 2,439
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Does the updateSessionDate work on the parent page? what is objEvent?
-
Jun 20, 2007, 06:59 #5
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.
-
Jun 20, 2007, 07:06 #6
- Join Date
- Oct 2004
- Location
- Birtley, UK
- Posts
- 2,439
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
use
Code:alert(typeof(window.opener) + '\n' + typeof(window.opener.objEvent) + '\n' + typeof(window.opener.objEvent.updateSessionDate));
-
Jun 20, 2007, 07:09 #7
Run in the popup in window:
object
object
function
-
Jun 20, 2007, 07:36 #8
- Join Date
- Oct 2004
- Location
- Birtley, UK
- Posts
- 2,439
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
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?
-
Jun 20, 2007, 07:47 #9
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.
-
Jun 21, 2007, 03:17 #10
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:
Code JavaScript:/* * 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)Last edited by sonic_2k_uk; Jun 21, 2007 at 03:18. Reason: shout for dave!
Bookmarks