How can we use addCallback function in flex - javascript

How can i call the flex frunction from the java script?
i am using below code which is define in below links
ExternalInterface.addCallback( "javascriptfunction", flexfunction);
http://www.switchonthecode.com/tutorials/flex-javascript-basics-using-externalinterface
http://circlecube.com/2010/12/actionscript-as3-javascript-call-flash-to-and-from-javascript/

You should give more context for your problem. From what I read on the tutorials, it is possible that you have omitted to add security access to your code. More precisely look here: http://help.adobe.com/en_US/FlashPlatform/reference/actionscript/3/flash/external/ExternalInterface.html#addCallback%28%29 , especially here:
SecurityError — The containing environment belongs to a security sandbox to which the calling code does not have access. To fix this problem, follow these steps:
In the object tag for the SWF file in the containing HTML page, set the following parameter:
param name="allowScriptAccess" value="always"
In the SWF file, add the following ActionScript:
flash.system.Security.allowDomain(sourceDomain)
Hope it helps.

In flex 4.5
Add a addcallback first, like this in your mxml
public function initApp():void {
ExternalInterface.addCallback("myFlexFunction",myFunc);
}
myFlexFunction can now be accessed from your javascript.
Make your index.template.html looks like this
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<!-- saved from url=(0014)about:internet -->
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head>
<title>addCallback() Wrapper</title>
<script type="text/javascript" src="swfobject.js"></script>
<script type="text/javascript">
var swfVersionStr = "0";
var xiSwfUrlStr = "";
var flashvars = {};
var params = {};
params.quality = "high";
params.bgcolor = "#ffffff";
params.allowscriptaccess = "sameDomain";
var attributes = {};
attributes.id = "AddCallbackExample";
attributes.name = "AddCallbackExample";
attributes.align = "middle";
swfobject.embedSWF(
"AddCallbackExample.swf", "flashContent",
"100%", "100%",
swfVersionStr, xiSwfUrlStr,
flashvars, params, attributes);
</script>
</head>
<SCRIPT LANGUAGE="JavaScript">
function callApp() {
window.document.title = document.getElementById("newTitle").value;
var AddCallbackExample = document.getElementById("AddCallbackExample");
AddCallbackExample.myFlexFunction(window.document.title);
}
</SCRIPT>
<body>
<form id="f1">
Enter a new title: <input type="text" size="30" id="newTitle" onchange="callApp()">
</form>
<div id="flashContent"/>
</body>
</html>
and your flex application like this
<?xml version="1.0"?>
<!-- wrapper/AddCallbackExample.mxml -->
<s:Application
xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:mx="library://ns.adobe.com/flex/mx"
xmlns:s="library://ns.adobe.com/flex/spark" creationComplete="initApp()">
<fx:Script>
import flash.external.*;
public function initApp():void {
ExternalInterface.addCallback("myFlexFunction",myFunc);
}
public function myFunc(s:String):void {
l1.text = s;
}
</fx:Script>
<s:Label id="l1"/>
</s:Application>
Hope this helps

Related

Open Excel file instead of download using HTML and Javascript

Can anyone please suggest any idea about how to open an Excel file, kindly check below code and let me know how to achieve opening the instead of downloading the file.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script type="text/javascript">
function read()
{
var txtFile = new XMLHttpRequest();
txtFile.open("GET", "C:\Users\user-temp\Downloads\test.xlsx", true);
txtFile.onreadystatechange = function()
{
if (txtFile.readyState === 4)
{
// Makes sure the document is ready to parse.
if (txtFile.status === 200)
{
// Makes sure it's found the file.
document.getElementById("div").innerHTML = txtFile.responseText;
}
}
}
txtFile.send(null)
}
</script>
</head>
<body onload="read();">
<form id="form1" runat="server">
<div id="div">
</div>
</form>
in your case you can use following methodswith google viewer iframe:
<iframe src="http://docs.google.com/gview?url=https://sifr.in/img/292/1/courseAndroid.xlsx&embedded=true"></iframe>
or with microsoft viewer iframe:
<iframe src='https://view.officeapps.live.com/op/embed.aspx?src=https://sifr.in/img/292/1/courseAndroid.xlsx'></iframe>
or open it in another tab / window with following:
Open your excel file
credit must also go tothis guy

How to take this string from user at run time?

Look at the below code, this JavaScript is used to take a string (in a language other than English) and convert it into English.
<script type="text/javascript">
google.load("language", "1");
function initialize() {
var content = document.getElementById('translation');
// Setting the text in the div.
content.innerHTML = '<div id="text">HELLO WORLD<\/div>
<div id="translation"/>';
// Grabbing the text to translate
var text = document.getElementById("text").innerHTML;
// Translate from Spanish to English, and have the callback of
// the request put the resulting translation in the
// "translation" div. Note: by putting in an empty string for
// the source language ('es') then the translation will
// auto-detect the source language.
google.language.translate(text, '', 'en', function(result) {
var translated = document.getElementById("translation");
if (result.translation) {
translated.innerHTML = result.translation;
}
});
}
google.setOnLoadCallback(initialize);
</script>
I want that the string "HELLO WORLD" must be entered by user at run time in a text field and then that string is passed to the div id text. So is this possible?
Hope you are referring to the document below:
http://code.google.com/apis/language/translate/v1/getting_started.html
Please refer to the section "Getting Started" where it says about "Signing up for an API key". This needs to be done before you could implement the code in your page.
Once done, make the modification to the script file which you include in the html page with your key.
Here, replace your key with "MY_KEY_STRING" in the bottom code and get started.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
<title>Google AJAX Language API Sample</title>
<script src="https://www.google.com/jsapi?key=MY_KEY_STRING"></script>
<script type="text/javascript">
google.load("language", "1");
function initialize() {
//Show the translate button
document.getElementById("translateButton").style.display = "";
}
google.setOnLoadCallback(initialize);
function translate() {
var text = document.getElementById("fromText").value;
google.language.translate(text, 'es', 'en', function(result) {
var translated = document.getElementById("toText");
if (result.translation) {
translated.innerHTML = result.translation;
}
});
}
</script>
</head>
<body style="font-family: Arial;border: 0 none;">
From:<input type="text" id="fromText"/>
To:<span id="toText"></span>
<input type="button" value="Translate" onclick="translate()" style="display: none;" id="translateButton">
</body>
</html>
HTML:
<form id="translate">
<textarea id="translate-me"></textarea>
<input type="submit" />
</form>
JavaScript:
var form = document.getElementById('translate')
var textarea = document.getElementById('translate-me')
form.onsubmit = function () {
google.language.translate(textarea.value, ...)
return false; // prevent default action (form submission)
}
Using jQuery or something similar would make this easier, of course.

reading flashvars problem for swfobject

I have a flash swf of 1.2mb.
am embeding it with swfobject using dynamic embeding .
<script type="text/javascript">
var flashvars = {};
flashvars.campaignid = "12345678890";
var params = {};
params.allowscriptaccess = "always";
var attributes = {};
swfobject.embedSWF("soccer.swf", "myAlternativeContent", "550", "400", "10.0.0", false, flashvars, params, attributes);
</script>
am tring to read campaignid inside my document class ...
the code is like
public function Main()
{
loaderInfo.addEventListener(ProgressEvent.PROGRESS,update);
loaderInfo.addEventListener(Event.COMPLETE,onLoadedMovie);
}
private function update(e:ProgressEvent):void
{
}
private function onLoadedMovie(e:Event)
{
campId=this.root.loaderInfo.parameters["campaignid"];
}
when i alert the value i got null
when i use the same method in a small file it works..
can anyone help me?
regards
I got the answer by adding variable in the embed code. like this
swfobject.embedSWF("soccer.swf?campaignid=1234556"", "myAlternativeContent", "550", "400", "10.0.0", false, flashvars, params, attributes);
Thanks for the help :)
Adam Harte's answer is correct, I think the problem lies somewhere within your AS3 code, the following especially confused me:
public function Main()
{
loaderInfo.addEventListener(ProgressEvent.PROGRESS,update);
loaderInfo.addEventListener(Event.COMPLETE,onLoadedMovie);
}
private function update(e:ProgressEvent):void { }
private function onLoadedMovie(e:Event)
{
campId=this.root.loaderInfo.parameters["campaignid"];
}
I've created a simple(and working) example of how your code should look:
index.html:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>FlashVars</title>
<meta name="language" content="en" />
<meta name="description" content="" />
<meta name="keywords" content="" />
<script src="js/swfobject.js" type="text/javascript"></script>
<script type="text/javascript">
var flashvars = { campaignid: "12345678890" };
var params = { menu: "false", scale: "noScale", allowFullscreen: "true", allowScriptAccess: "always", bgcolor: "", wmode: "direct" };
var attributes = { id:"FlashVars" };
swfobject.embedSWF("FlashVars.swf", "altContent", "100%", "100%", "10.0.0", "expressInstall.swf", flashvars, params, attributes);
</script>
<style type="text/css">
html, body { height:100%; overflow:hidden; }
body { margin:0; }
</style>
</head>
<body>
<div id="altContent">
<h1>FlashVars</h1>
<p>Alternative content</p>
<p>
<a href="http://www.adobe.com/go/getflashplayer">
<img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash player" />
</a>
</p>
</div>
</body>
</html>
Main.as(document class):
package
{
import flash.display.Sprite;
import flash.events.Event;
import flash.text.TextField;
import flash.text.TextFieldAutoSize;
public class Main extends Sprite
{
public function Main():void
{
if (stage) init();
else addEventListener(Event.ADDED_TO_STAGE, init);
}// end function
private function init(e:Event = null):void
{
removeEventListener(Event.ADDED_TO_STAGE, init);
if (loaderInfo.parameters.campaignid)
{
var textField:TextField = new TextField();
textField.autoSize = TextFieldAutoSize.LEFT;
textField.text = loaderInfo.parameters.campaignid;
addChild(textField);
}// end if
}// end function
}// end class
}// end package
The following is an image of the example beening run in a browser:
Maybe try getting the var after your Main class has been added to the stage. This will make sure everything is loaded and ready. Try something like this:
public function Main()
{
if (stage) init();
else addEventListener(Event.ADDED_TO_STAGE, init);
}
private function init(e:Event = null):void
{
removeEventListener(Event.ADDED_TO_STAGE, init);
var campId:String = this.root.loaderInfo.parameters["campaignid"];
trace('campId', campId);
}

Flex/AIR calling Javascript functions

I have problem with calling javascript function from my AIR / Flex App. In web App this is easy with externallInterface, but in native app it is a problem. My AIR app is similar like this ....
<?xml version="1.0" encoding="utf-8"?>
<mx:WindowedApplication xmlns:mx="http://www.adobe.com/2006/mxml"
initialize="init()" ... >
<mx:Script>
<![CDATA[
private function init():void
{
myHTML.addEventListener(Event.HTML_DOM_INITIALIZE,DOMInit);
myHTML.location="myAIRHTML.html";
}
private function DOMInit(e:Event):void{
myHTML.htmlLoader.window.inputFunction = testInputFunction;
}
private function testInputFunction(so:String):void{
//some code ......
}
public function someFunction(e:AIREvent):void{
myHTML.htmlLoader.window.outputFunction(e.param);
}
_]]>
</mx:Script>
<mx:HTML id="myHTML" width="5" height="5" visible="true" />
</mx:WindowedApplication>
myAIRHTML.html is
<html>
<head>
<script language="Javascript">
var interface = {};
function outputFunction(param){
var childInterface = document.getElementById("mySandbox").childSandboxBridge;
childInterface.remoteFunction(param);
}
interface.inputFunction = function(someData){
testInputFunction(someData);
}
function initBridge(){
document.getElementById("mySandbox").parentSandboxBridge = interface;
}
</script>
</head>
<body>
<iframe id="mySandbox"
src="js.html"
sandboxRoot="http://remote.example.com/js/"
documentRoot="app:/myAIRSandbox/"
ondominitialize="initBridge()">
</iframe>
</body>
</html>
and js.html is
<html>
<head>
<script language="Javascript" src="http://www/otherexample.com/other.js"></script>
<script language="Javascript" >
var interface = {};
interface.remoteFunction = function(st){
alert("st");
callFunctionInOtherJS(st);
}
window.childSandboxBridge = interface;
var someObject = {};
someObject.SomeFunction = function(someParam){
window.parentSandboxBridge.inputFunction(someParam);
}
</script>
</head>
<body ></body>
</html>
This throw "TypeError: Undefined value" when I call "remoteFunction" in myAIRHTML.html. It something important what I missed? Can anyone help? It something important what I forget about documentRoot - I don't use this name on other place ..... Thanks for all replies
it seems a bit confused to me anyway if i've understand this is your error:
If you define this
myHTML.htmlLoader.window.inputFunction = testInputFunction;
You js in myAIRHTML.html can't call testInputFunction(someData); but inputFunction(someData) because you passed your AS3 function testInputFunction to a variable called inputFunction
Hope this helps

document.title problems ie8

Why does IE8 fail to change the documents title with document.title="test title";
Following works on IE8 for me. But I did get the ActiveX security popup, so perhaps your IE8 is not set to prompt for these issues and just deny scripting.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>Test</title>
<script type="text/javascript">
function changeTitle() {
document.title = 'Foobar';
}
</script>
</head>
<body onload="changeTitle()">
</body>
</html>
Really? Using document.title = 'Foo Bar'; has always worked for me. Is your script even executing?
Try shoving this right before the document.title = ...:
alert('I work.');
If you don't get an alert box, your script isn't even running.
found this:
http://support.microsoft.com/kb/296113
<HTML>
<HEAD>
<SCRIPT LANGUAGE="JAVASCRIPT">
function runTest()
{
var s ="We should set this as the new title"
var mytitle = document.createElement("TITLE");
mytitle.innerHTML = s;
alert(s);
document.documentElement.childNodes[0].appendChild(mytitle);
}
function fix()
{
var s = "Now we change the title";
alert(s);
document.title = s;
}
</SCRIPT>
</HEAD>
<BODY>
<input type="button" value="Problem" onclick="runTest()"/>
<input type="button" value="Workaround" onclick="fix()"/>
</BODY>
for me this is works in IE 9,8,7
maybe you dont call your function, or there is something which not works.
the document.title must work!

Categories

Resources