I'm using Aptana Studio with the following source code:
<html>
<head>
<title>New Adobe AIR Project</title>
<script type="text/javascript" src="lib/air/AIRAliases.js"></script>
<script type="text/javascript" src="lib/air/AIRIntrospector.js"></script>
<script src="http://www.google.com/jsapi"></script>
<script type="text/javascript">
google.load("jquery", "1");
</script>
<script>
$(function() {
alert('ok');
})
</script>
</head>
<body>
</body>
</html>
This works if I just pull up the page as an html page.
But why am I getting
ReferenceError: Can't find variable: google.
ReferenceError: Can't find variable: $
When I use Aptana's Run command, or even if I build the application into an .air file and run it from Window's explorer.
You cannot load external JS files using the tag in an AIR application. It violates the AIR security stuff.
You MUST load js files from the application sandbox.
http://help.adobe.com/en_US/AIR/1.5/devappshtml/WS5b3ccc516d4fbf351e63e3d118666ade46-7f0e.html#WS5b3ccc516d4fbf351e63e3d118666ade46-7ef7
Related
I have done the installation steps. I tried every way but I can't run it in HTML file. Even if I throw the "gsap" file in the "node_modules" section and call it with the <script> tag, it doesn't work.
This is how I call "all.js" in HTML file. Tried all other ways too.
<script src="src/all.js"></script>
<script src="app.js"></script>
I want to use all plugins locally in my project.
<html>
<body>
<h1>Some content</h1>
<script src="path-to-my-scripts/gsap.min.js"></script>
<script src="path-to-my-scripts/ScrollTrigger.min.js"></script>
<script src="app.js"></script>
</body>
</html>
Okay, I solved it. It is necessary to write the "min.js" files, not the "all.js" file directly.
what seems to be wrong here i dont get any error but at the same time no progress in routing. .
index.html
<!DOCTYPE html>
<html>
<head>
<title>My Angular App</title>
<link rel="stylesheet" type="text/css" href="/myAngularApp/css/style.css">
<link rel="stylesheet" type="text/css" href="/myAngularApp/css/bootstrap/css/bootstrap.min.css">
<script type="text/javascript" src="/myAngularApp/css/angular/angular.min.js"></script>
<script src="/myAngularApp/css/mainpage.js"></script>
<script type="text/javascript" src="/myAngularApp/css/angular/angular-animate.min.js"></script>
<script type="text/javascript" src="/myAngularApp/css/angular/angular-resource.min.js"></script>
<script type="text/javascript" src="/myAngularApp/css/angular/angular-route.min.js"></script>
<script type="text/javascript" src="/myAngularApp/css/bootstrap/ui-bootstrap-tpls-2.2.0.min.js"></script>
</head>
<body ng-app="myApp">
<h1> this is index.html </h1>
<div ng-view></div>
</body>
</html>
mainpage.js // where my controller is
var app = angular.module('myApp', ['ngRoute', 'ngAnimate', 'ngResource', 'ui.bootstrap']);
app.config(function($routeProvider) {
$routeProvider
.when('/', {
templateUrl : 'index.html'
})
.when('/home', {
templateUrl : 'homepage.html'
})
.otherwise({
templateUrl : 'index.html'
});
});
when i load '/' in my browser nothins is happening same with /home i dont know where did i get wrong since there is no error in my console
The template for a route should be a partial view. Here index.html is the root of the single page app , this page should never reload (unless you want to destroy and rebootstrap the app). Try changing the templateUrl for / to a file that just has <h2> HELLO WORLD!</h2> and monitor the console (dev tools) for any 404 errors related to fetching the template
I think problem is with your javascript file name. In index you mentioned mainpage.js and in description its homepage.js.
Edit : Okay. Then try arranging files list like
<script type="text/javascript" src="/myAngularApp/css/angular/angular.min.js"></script>
<script type="text/javascript" src="/myAngularApp/css/angular/angular-animate.min.js"></script>
<script type="text/javascript" src="/myAngularApp/css/angular/angular-resource.min.js"></script>
<script type="text/javascript" src="/myAngularApp/css/angular/angular-route.min.js"></script>
<script type="text/javascript" src="/myAngularApp/css/bootstrap/ui-bootstrap-tpls-2.2.0.min.js"></script>
<script src="/myAngularApp/css/mainpage.js"></script>
As mentioned in the answer by user Priyanka, the filename can be the issue. But that should produce an error on the console and according to you there was no error on the console.
The other possible reason can be the sequence in which you've imported your files. I generally sequence my files this way -
<head>
<!-- 1. External CSS Libraries likes bootstrap, jquery -->
<!-- 2. My Application specific CSS files -->
<!-- 3. External JS libraries like Angular, bootstrap, JQuery -->
<!-- 4. My Application specific JS files like my controllers, services, directives etc.
</head>
Again the sequence in which you import the external JS libraries may also cause problems.
I'm trying to understand the "elm-make" command. I built 2 .elm files call Foo.elm and Bar.elm. I'd like to display them in a HTML file of this format :
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript" src="elm.js"></script>
</head>
<body>
<h2>Foo</h2>
<div id="foo-app"></div>
<h2>Bar</h2>
<div id="bar-app"></div>
</body>
<script type="text/javascript">
Elm.embed(Elm.Foo, document.getElementById("foo-app"));
Elm.embed(Elm.Bar, document.getElementById("bar-app"));
</script>
</html>
But Elm.Foo and Elm.Bar do not exist. Only Elm.Main.
Tried to compile with this command: elm make Foo.elm Bar.elm --output elm.js. What am I doing wrong ?
It's because I did not have the module declared at the top of my files, so it implied Main :
module Foo where
I have recently got stuck in the following situation.
I have a script which works perfectly in FF and GC,but not in IE10.
The IE is not loading the jQuery src files,so therefore it triggers the error '$' is undefined.The loading part looks like this:
<script type="text/javascript" src="/RequestCenter/modules/resources/dist/jquery.js"></script>
<script type="text/javascript" src="/RequestCenter/modules/resources/dist/jquery.jqplot.js"></script>
<script type="text/javascript" src="/RequestCenter/modules/resources/dist/plugins/jqplot.canvasTextRenderer.js"></script>
<script type="text/javascript" src="/RequestCenter/modules/resources/dist/plugins/jqplot.canvasAxisLabelRenderer.js"></script>
<link rel="stylesheet" type="text/css" hrf="/RequestCenter/modules/resources/dist/jquery.jqplot.css" />
<script type="text/javascript" src="/RequestCenter/modules/resources/dist/plugins/jqplot.highlighter.min.js"></script>
my function is simple:
$(document).ready(function() { .... });
so,the IE10 doesn't load the jQuery and triggers the error on this line.
Any ideas how to find a work around would be really appreciated.
Thanks
It might be a browser mode or document mode compatibility issue, press F12 in IE and change your document mode to highest standard
i've created another file testW.html beside main file and i've try to call worklight adapter in that file but it isn't work:
Here is my testW.html:
<html>
<head>
<script>window.$ = window.jQuery = WLJQ;</script>
<script type="text/javascript" data-dojo-config="isDebug: false, async: true, parseOnLoad: true, mblHideAddressBar: false" src="dojo/dojo.js"></script>
</head>
<body onload="WL.Client.init({})">
<h1>Hello</h1>
<button type="button" onclick="LoginWS();">Click Me!</button>
<script src="js/PushAppRealmChallengeHandler.js"></script>
<script src="js/initOptions.js"></script>
<script src="js/test2.js"></script>
<script src="js/configFb.js"></script>
<script src="js/messages.js"></script>
</body>
</html>
In here, LoginWS() is function call worklight adapter in test2.js,i've try call it in test2.html every thing is ok,how i call it in testW.html ?
IBM Worklight applications are single page applications, however that doesn't mean you can't use HTML from other files. Take a look at the Building a multi-page application getting started module and the associated sample code.
Related questions:
IBM Worklight Using Multiple HTML Files
type error: cannot call method 'invoke procedure' of undefined in worklight
How to pass data between pages through worklight client API