While executing the following code in browser it will not shown an alert, its just shown empty page. anything wrong in the following code please help me.
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text.html; charset=utf-8">
<title> First Program </title>
<link rel="stylesheet" type="text/css" href ="http://localhost:8080/ext/ext-4.2.1.883/resources/css/ext-all.css"/>
<script type = "text/javascript" src = "http://localhost:8080/ext/ext-4.2.1.883/ext-all-dev.js"/>
<script type="text/javascript">
Ext.onReady(function(){
// alert("We are ready to go!");
Ext.Msg.alert("Hello World");
});
</script>
</head>
<body>
</body>
</html>
You are not calling the method properly. Ext.Msg.alert takes two parameters, title and message, as you can see in the docs.
Related
This is the code.
(I know that I must type here so many text to post my question, but please ignore this part in the parenthesis. It is due only to the rules of the site.)
I can not find the reason, but on screen only appears "{{adat}}".
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title> </title>
<script src="https://code.angularjs.org/1.8.2/angular.js">
</script>
<script type="text/javascript">
function todoc($scope) {
$scope.adat = "Szia!";
}
</script>
</head>
<body ng-app>
<div ng-controller="todoc">
<h1> {{adat}} </h1>
</div>
</body>
</html>
It turned out that this version of Angular works with a newer syntax.
For this syntax the appropriate version is 1.0.0
i am trying to use ng-admin for the firs time. i am just following the example in and i am unable to see anything in the browser. my code is minimal, so not sure what i am doing wrong.
any ideas? did i not install correctly? i just downloaded it from a site and unzipped the file.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>My First Admin</title>
<link rel="stylesheet" href="external/ng-admin/build/ng-admin.min.css">
<script src="external/ng-admin/build/ng-admin.min.js" type="text/javascript"></script>
<script src="admin.js" type="text/javascript"></script>
</head>
<body ng-app="myApp" ng-strict-di>
<div ui-view="ng-admin"></div>
</body>
</html>
// declare a new module called 'myApp', and make it require the `ng-admin` module as a dependency
var myApp = angular.module('myApp', ['ng-admin']);
// declare a function to run when the module bootstraps (during the 'config' phase)
myApp.config(['NgAdminConfigurationProvider', function (nga) {
// create an admin application
var admin = nga.application('My First Admin')
.baseApiUrl("http://vl-esifakis-ice:8000/tracker/");
var foundry = nga.entity('foundry');
foundry.listView().fields([
nga.field('name'),
nga.field('id')
]);
admin.addEntity(foundry);
// more configuration here later
// ...
// attach the admin application to the DOM and execute it
nga.configure(admin);
}]);
Here is a demo which i have made,
<!DOCTYPE html>
<html>
<head>
<link data-require="ng-admin#0.0.1" data-semver="0.0.1" rel="stylesheet" href="https://unpkg.com/ng-admin/build/ng-admin.min.css" />
<link rel="stylesheet" href="style.css" />
<script data-require="ng-admin#0.0.1" data-semver="0.0.1" src="https://unpkg.com/ng-admin/build/ng-admin.min.js"></script>
<script data-require="angular-mocks#*" data-semver="1.3.5" src="https://code.angularjs.org/1.3.7/angular-mocks.js"></script>
<script src="admin.js"></script>
<!-- <script src="backend.js"></script>
-->
</head>
<body ng-app="myApp">
<div ui-view="ng-admin"></div>
</body>
</html>
DEMO
I have written the following code in the HTML file.
<!DOCTYPE html>
<html lang="en" ng-app>
<head>
<title>Project Tracking Home Page</title>
<script src="Scripts/jquery-2.1.0.min.js"></script>
<link href="CSS/bootstrap.min.css" rel="stylesheet" />
<link href="CSS/Site.css" rel="stylesheet" />
<script src="Scripts/bootstrap.min.js"></script>
<script src="Scripts/angular.min.js"></script>
</head>
<body>
<h1>Welcome To Project Tracker</h1>
<p>Addition of Two Numbers (100+100) is - {{100+100}}</p>
</body>
</html>
The binding expressions do not return the value instead they are shown as it is.
When i run this code, i find the error ''Node' is undefined.'
I have used NuGet packages to install the Angular Js and JQuery into the scripts folder.
Make sure that your browser's document mode is greater than IE 8
If it's IE, try this:
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
Using Angular v1.3.13. Version1 does not work in Chrome:
<!doctype html>
<html lang="en" ng-app>
<head>
<meta charset="utf-8">
<title>Hello World</title>
</head>
<body>
<h1 ng-controller="HelloWorldCtrl">{{helloMessage}}</h1>
<script src="./bower_components/angular/angular.js"></script>
<script type="text/javascript">
function HelloWorldCtrl($scope) {
$scope.helloMessage = "Hello World";
}
</script>
</body>
</html>
Error:
Argument 'HelloWorldCtrl' is not a function, got undefined
Version2 works fine:
<!doctype html>
<html lang="en" ng-app=myApp>
<head>
<meta charset="utf-8">
<title>Hello World</title>
</head>
<body>
<h1 ng-controller="HelloWorldCtrl">{{helloMessage}}</h1>
<script src="./bower_components/angular/angular.js"></script>
<script type="text/javascript">
angular.module('myApp', []).controller('HelloWorldCtrl',
function HelloWorldCtrl($scope) {
$scope.helloMessage = "Hello World";
});
</script>
</body>
</html>
Version1 is the original code from a Pluralsight course. In the course the code works fine. Did I make an error or does this no longer work due to changes in AngularJs?
From angularV1.3 to use functions defined on window scope as controllers we need call alloGlobals method defined on $controllerProvider.
module.config(function($controllerProvider){
$controllerProvider.allowGlobals();
});
documentation
changelog
Yes. Using global functions is not supported anymore. But it's been quite a long time: since 1.3.0
So I'm just curious about something... it appears that when doing e2e tests with Protractor and doing things like "expect(element(by.css('.test')).getText()).toBe('Some Text');" this only works for elements in the BODY section of the document and not the HEAD section.
For example I tinkered with the tutorial phonecatApp index.html so that it looks like this:
!doctype html>
<html lang="en" ng-app="phonecatApp">
<head>
<meta charset="utf-8">
<title class="appTitle">Google Phone Gallery</title>
<link rel="stylesheet" href="../bower_components/bootstrap/dist/css/bootstrap.css">
<link rel="stylesheet" href="css/app.css">
<link rel="stylesheet" href="css/animations.css">
<script src="../bower_components/jquery/jquery.js"></script>
<script src="../bower_components/angular/angular.js"></script>
<script src="../bower_components/angular-animate/angular-animate.js"></script>
<script src="../bower_components/angular-route/angular-route.js"></script>
<script src="../bower_components/angular-resource/angular-resource.js"></script>
<script src="js/app.js"></script>
<script src="js/animations.js"></script>
<script src="js/controllers.js"></script>
<script src="js/filters.js"></script>
<script src="js/services.js"></script>
</head>
<body>
<div class="test">Some Text</div>
<div class="view-container">
<div ng-view class="view-frame"></div>
</div>
</body>
</html>
Then I added some simple tests to scenarios.js that look like this:
it('should set the title to "Google Phone Gallery"', function () {
expect(element(by.css('.appTitle')).getText()).toBe('Google Phone Gallery');
});
it('should set the div.test to "Some Text"', function () {
expect(element(by.css('.test')).getText()).toBe('Some Text');
});
The first test to check TITLE always fails with "Expected ' ' to be 'Google Phone Gallery'." But the DIV test works fine.
Is there anything special required to check elements in the HEAD section or is this just something you can't do with Protractor?