Re: Passing Javascript Variables between 2 A5W Page Dialogs
David,
This is a case of needing to traverse across the DOM to get the desired results. A5 runs .a5w pages in an Iframe. When you launch dialog two from the page that dialog one is on it opens in an ajax window (in an Iframe) on the current page. the Iframe, in essence, is another "document" hence it has another level of window vars that are a child of the parent window. You can get at the vars in the child from the parent and the parent from the child but you need to know the hierarchy.
Just another point I'd like to clarify that seems to have a lot of people confused. window.myvar = 'test' is the same as window['myvar'] = 'test' is the same as myvar = 'test'. They are all creating a variable at the top level (window) of the DOM. You don't need the window prefix anymore than you do when you use an alert(), which really means window.alert(). alert() is just one of the many methods of the window object. Prefixing "window" is a good practice since it lets you, and other developers reading your code, know that you intended to create a global var and didn't just forget to use the "var =" construct.
In your case where you want the dialog in the called page to set a variable that is part of the calling page you would get at the variable by prefixing window.parent to the variable, as in window.parent.variable_you_want_access. This is telling the browser to look for a variable in the "window" object that called this object. To go the other way, from the calling page to the called page you would use window.frames[1]. child_variable_you_want_access, where the index of the iframe is set by the order that it occurs in the html. In your case you're only opening one new Iframe so it will have the index of 1, since the parent page will be in the index slot of 0, because the parent is also running in an Iframe, as are all .a5w pages.
Once you get a grasp on the DOM and how A5 uses Iframes for just about everything it gets a lot easier to understand how to interact with them.
I've attached a zip with two pages and two dialogs to demonstrate the concept. Publish the pages to local host and run the parent page. Clicking the "Show Var" button will display the current value of the global variable in an alert(). Click the "open child page" button an the second dialog will open as an a5w page in a window. From the window you can see the value of the parent windows global var by clicking the "show window.parent.myparentvar" button. It will have the same value as the parent. Now if you click the "change parent var" button it will change the value of the global var that is in the parent window.
I hope this helps to clarify the whole DOM widow var thing.
In Frank's example, he's using two pages and opening them in the same window of the browser. If you use his example and open the second page in a new tab (a new window) you'll see that the window.name var's value does not persist. (name is a built in property of the window object which is why you don't get "undefined" in the alert)
child_var.zip
David,
This is a case of needing to traverse across the DOM to get the desired results. A5 runs .a5w pages in an Iframe. When you launch dialog two from the page that dialog one is on it opens in an ajax window (in an Iframe) on the current page. the Iframe, in essence, is another "document" hence it has another level of window vars that are a child of the parent window. You can get at the vars in the child from the parent and the parent from the child but you need to know the hierarchy.
Just another point I'd like to clarify that seems to have a lot of people confused. window.myvar = 'test' is the same as window['myvar'] = 'test' is the same as myvar = 'test'. They are all creating a variable at the top level (window) of the DOM. You don't need the window prefix anymore than you do when you use an alert(), which really means window.alert(). alert() is just one of the many methods of the window object. Prefixing "window" is a good practice since it lets you, and other developers reading your code, know that you intended to create a global var and didn't just forget to use the "var =" construct.
In your case where you want the dialog in the called page to set a variable that is part of the calling page you would get at the variable by prefixing window.parent to the variable, as in window.parent.variable_you_want_access. This is telling the browser to look for a variable in the "window" object that called this object. To go the other way, from the calling page to the called page you would use window.frames[1]. child_variable_you_want_access, where the index of the iframe is set by the order that it occurs in the html. In your case you're only opening one new Iframe so it will have the index of 1, since the parent page will be in the index slot of 0, because the parent is also running in an Iframe, as are all .a5w pages.
Once you get a grasp on the DOM and how A5 uses Iframes for just about everything it gets a lot easier to understand how to interact with them.
I've attached a zip with two pages and two dialogs to demonstrate the concept. Publish the pages to local host and run the parent page. Clicking the "Show Var" button will display the current value of the global variable in an alert(). Click the "open child page" button an the second dialog will open as an a5w page in a window. From the window you can see the value of the parent windows global var by clicking the "show window.parent.myparentvar" button. It will have the same value as the parent. Now if you click the "change parent var" button it will change the value of the global var that is in the parent window.
I hope this helps to clarify the whole DOM widow var thing.
In Frank's example, he's using two pages and opening them in the same window of the browser. If you use his example and open the second page in a new tab (a new window) you'll see that the window.name var's value does not persist. (name is a built in property of the window object which is why you don't get "undefined" in the alert)
child_var.zip
Comment