Solved

ExternalInterface call back from javascript to Adobe flex

Posted on 2009-05-05
17
2,163 Views
Last Modified: 2013-11-11
Hi,

I want to set the value from JavaScript to AS method.
Below is the code for AS/JavaScript and HTML.
In javaScript i'm getting the object of "FlexApp" and trying to set the property using ExternalInterface.addCallBack method.

In my html file when i make some event like click on button and then set this value, its sets property, but when i try to do the same thing using browser URL in onLoad method, then its a JavaScript error "Object doesn't support this property or method"

Is it necessary to some event and how can i do that.

Thanks
Puneet
AS method:
 
 private function setupCallbacks():void
        {
             if (ExternalInterface.available)
            {
               	ExternalInterface.addCallback("setProperty",setProperty);
            }
        }
 
 
JavaScript Code 
getSWF().setProperty(finalValue);
 
 function getSWF() {
        if (theSWF == null)
        {
            theSWF = document.getElementById("flexApp");
        }
        return theSWF;
    }

Open in new window

0
Comment
Question by:PuneetKSaxena
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 9
  • 8
17 Comments
 
LVL 22

Expert Comment

by:rascalpants
ID: 24308108
I would assume you are getting this error, because of one of the following...

- you need to use different code in getSWF to reference the flash object ID
- you are not setting the Flash object ID
- you not viewing this from a browser


but I think your problem is that the code to setup everything is not getting set before your javascript code is being called... so there is not reference in Actionscript yet.


try using a 5 second timer on your javascript and see if that works...


rp / ZA
0
 
LVL 22

Expert Comment

by:rascalpants
ID: 24308131
yeah, I think it is an asynchronous coding issue... because the onLoad files when the SWF is loaded, but a SWF does not work the same way as the HTML text or images...  it is more of a progressive download system.  


rp / ZA
0
 

Author Comment

by:PuneetKSaxena
ID: 24308628
HI


- you need to use different code in getSWF to reference the flash object ID  
       when i use onclick method, the same code is getting the object ID
- you are not setting the Flash object ID
         its properly set and i debugged and i'm getting the object ID
- you not viewing this from a browser
          i'm not able to view when i call OnLoad method.

I guess there is something need to be done from ActionScript code.



But still its not clear. when i call onclick event, its properly gets the value
0
PeopleSoft Has Never Been Easier

PeopleSoft Adoption Made Smooth & Simple!

On-The-Job Training Is made Intuitive & Easy With WalkMe's On-Screen Guidance Tool.  Claim Your Free WalkMe Account Now

 
LVL 22

Expert Comment

by:rascalpants
ID: 24308681
I thought you said...

"In my html file when i make some event like click on button and then set this value, its sets property"

so this to me means when you click a button or something in the HTML it sets the property fine...  

but when you try to pass the value in with the Javascript onLoad method, it does not work...  right?


so them try to call the AS after 5 seconds instead of onLoad.  if it works, then you cannot use the onLoad method, and instead need to keep the timer, or send the value into the SWF with FlashVars or as a Query string...


rp / ZA

0
 

Author Comment

by:PuneetKSaxena
ID: 24308698
can you send me any code snippet for FlashVars/QueryString
0
 

Author Comment

by:PuneetKSaxena
ID: 24308763
When i run using broswer URL its giving me error

 "Object doesnot support this property or method"


but onclcik event is not giving any error and values are properly passed to SWF.

This method is not getting registered somehow.

Any idea why is it so
0
 
LVL 22

Expert Comment

by:rascalpants
ID: 24308803


you would just add a new parameter to the embed code... and depending on what technique you are using (ie, AC_FL_RunContent, SWFObject, normal Object/Embed ) it can vary...


AC_FL_RunContent :

'FlashVars', 'finalValue=VAL&finalValue2=VAL2&',



SWFObject:

so.addParam( "flashVars", "finalValue=VAL&finalValue2=VAL2&" );

or

var flashvars = { finalValue: "VAL", finalValue2: "VAL2" };



Object/Embed:

<param name="FlashVars" value="finalValue=VAL&finalValue2=VAL2&" />



rp / ZA

0
 
LVL 22

Expert Comment

by:rascalpants
ID: 24308821
yes... i have said this a number of times...  Flash has not completely loaded when you are trying to reference something inside of it.


why dont you post all of your html code... minus anything that is not important to this question


rp / ZA
0
 

Author Comment

by:PuneetKSaxena
ID: 24309106
Hi,

please find below the HTML file.
Hope it'll be easier for you to understand .


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
 <HEAD>
  <TITLE> ABC </TITLE>
<link rel="stylesheet" type="text/css" href="test.css">
 <script type="text/javascript" src="AC_OETags.js" ></script>
 
 </HEAD>
 
<script type="text/javascript">
  var theSWF;
 
function parseXML()
{
 
	var userSelDropDown = false;
	var args = new Object();
	var userSelValue;
	var optionLevelValue;
	var userselLevel;
	var query = location.search.substring(1);
	if(query!=null){
		var pairs = query.split("&");
		for(var i = 0; i < pairs.length; i++) {
			var pos = pairs[i].indexOf('=');
			if (pos == -1) continue;
			var argname = pairs[i].substring(0,pos);
			userSelValue = pairs[i].substring(pos+1);
			optionLevelValue = userSelValue.split("/");
			userselLevel  = optionLevelValue.length;
			userSelDropDown = true;
		}
	}
 
 
 
	try //Internet Explorer
	{
		xmlDoc=new ActiveXObject("Microsoft.XMLDOM");
	}
	catch(e){
		try //Firefox, Mozilla, Opera, etc.
		{
	   		xmlDoc=document.implementation.createDocument("","",null);
		}catch(e){
		}
	}
	xmlDoc.async=false;
	xmlDoc.load("test.xml");
	var lev1 = xmlDoc.getElementsByTagName('ES')[0];
	var level1 = document.searchtools.level1;
}
 
 
function setOptions(theData, selection, userSelValue, userSelDropDown)
{
			var finalValue  =  theData;
			getSWF().setProperty(finalValue);
 
	}
}
 
 
 
	 function getSWF() {
        if (theSWF == null)
        {
            theSWF = document.getElementById("flexApp");
        }
        return theSWF;
    }
 
 
</script>
 
</head>
<body style="margin-top:0px; margin-left:5px; background:#000000 ; background-repeat: no-repeat;" onload="parseXML();">
<div style="position: absolute; top:-4px; left:240px; width:930px; height:615px; overflow:hidden;">
<script>
AC_FL_RunContent("src", "test",
                    "width", "930",
                    "height", "615",
                    "align", "middle",
                    "id", "flexApp",
                    "quality", "high",
                    "bgcolor", "#ffffff",
                    "name", "catalog",
                    "allowScriptAccess","always",
                    "type", "application/x-shockwave-flash",
                    "pluginspage", "http://www.adobe.com/go/getflashplayer",
					"wmode", "transparent"
					);
 
</script>
</div>
<style type="text/css">
select{
	background: #222222;
	border: 1px solid #4C77B6;
	color: #e7e6e6;
	font-family: Trebuchet MS;
	font-size: 12px;
	margin: 0px;
	padding: 0px;
	vertical-align: middle;
}
 
 
</style>
 
<form name="searchtools" size="30">
 <label style="color:#FFFFFF"><font face="Trebuchet MS" size="+1"><B>Select a Category :  <B></font> </label>
<BR> <BR>
<select name="level1" id="level1"  onchange="setOptions(document.searchtools.level1.options[document.searchtools.level1.selectedIndex].value,'level2', null, false);">
<option>-Select-</option>
</select><BR><BR>
<select name="level2"  id="level2" onchange="setOptions(document.searchtools.level2.options[document.searchtools.level2.selectedIndex].value,'level3', null, false);">
<option>-Select-</option>
</select><BR><BR>
 
</form>
</body>
</html>

Open in new window

0
 
LVL 22

Expert Comment

by:rascalpants
ID: 24309190
so what are you using to call setOptions()  ?  i don't see that getting called anywhere...


rp / ZA
0
 

Author Comment

by:PuneetKSaxena
ID: 24309214
Ohh... thats is called from parseXML..

setOptions is doing something and accordingly sets the value in  getSWF().setProperty(finalValue);

This is to get the "finalValue" variable and set it to SWF
0
 
LVL 22

Expert Comment

by:rascalpants
ID: 24309327
you can't call parseXML until later then if it is dependent on the Flash application.


rp / ZA
0
 

Author Comment

by:PuneetKSaxena
ID: 24309571
not clear... can you elaborate..

Onload method calls --> parseXMl()-> setOptions-> getSWF()

This is the flow.
Something wrong in this???
0
 
LVL 22

Expert Comment

by:rascalpants
ID: 24309661
yes...  

do not call any javascript function with the onLoad method.  Do you understand what I mean by that?

When you do that, your javascript code is referencing something that does not exist yet.  That is not good.  Don't do that.


set up a timer and test it.

http://www.elated.com/articles/javascript-timers-with-settimeout-and-setinterval/



rp / ZA

0
 
LVL 22

Accepted Solution

by:
rascalpants earned 500 total points
ID: 24309675
here put this code on your page...


<input type="button" name="clickMe" value="Click me and wait!" onclick="setTimeout('parseXML', 5000)"/>


click it and see what happens...



rp / ZA

0
 

Author Comment

by:PuneetKSaxena
ID: 24310063
Yuppie.. That timer works for me..


I added it in onLoad method itself.

<body style="margin-top:0px; margin-left:5px; background:#000000 ; background-repeat: no-repeat;" onload="setTimeout('parseXML();', 500)"">

and it worked.
Thanks a lot
0
 

Author Closing Comment

by:PuneetKSaxena
ID: 31578163
I added it in onLoad method itself.

0

Featured Post

Industry Leaders: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Today, the web development industry is booming, and many people consider it to be their vocation. The question you may be asking yourself is – how do I become a web developer?
This article discusses how to implement server side field validation and display customized error messages to the client.
In this tutorial viewers will learn how to create a basic motion tween animation in Flash Open a new document in Flash: Draw/import an image: Press CTRL + F8 to convert it into a graphic symbol: Select a frame (how long you want the tween to last): …
The goal of the tutorial is to teach the user how to select the video input device. Make sure you have an input device that in connected and work and recognized by Adobe Flash Media Live Encoder and select it in the “video input” menu.
Suggested Courses

734 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question