UI Pages with AngularJS
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
09-17-2015 09:31 AM
I've got a UI page that uses AngularJS that's working great from the client side of things. Now I'm ready to press the OK gutton (via the g:ui_form tag) which will run the processing script. Usually from there I can just access variables that were defined in the client script, but with AngularJS there's not really a variable.
Is there a way to get at the data from the angular controller in the processing script so I can actually, you know, process it?
- Labels:
-
Scripting and Coding

- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
09-17-2015
09:34 AM
- last edited on
09-17-2023
12:54 AM
by
ServiceNow
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
09-19-2015 10:39 AM
Both of those links simply talk about how to get AngularJS setup. I already have that done, and a 99% done AngularJS application. Neither of those speak to my specific question though.

- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
09-19-2015 01:02 PM
Hey Scott,
Have you looked into Angular Services? A Service within Angular is a singleton and can house an object or separate variable values. You can then pass in the service as a dependency to all your controllers. Whatever scope the submit button is running within would then have access to the Service variables to submit or any functions as well.
Hope that helps!
Jared Healy
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
09-19-2015 01:20 PM
Hi Scott,
Processing script runs on server side. Angular however is a client side framework. So, u need to create your custom button that will call a function on client side. You can access any jelly variable on client side. Moreover, you can write any GlideRecord logic in g:evaluate tag.
I created a test UI Page for you. Copy and paste the code given below. Give it name 'test_page' and save it. Now go to "<instance-name>/test_page.do?sysparm_sys_id=12345". Click the button and you shall see 12345 passed in url.
<?xml version="1.0" encoding="utf-8" ?>
<j:jelly trim="false" xmlns:j="jelly:core" xmlns:g="glide" xmlns:j2="null" xmlns:g2="null">
<html>
<script>http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script>
<body>
<div ng-app="myApp" ng-controller="myCtrl">
First Name: <input type="text" ng-model="firstName"></input><br/>
Last Name: <input type="text" ng-model="lastName"></input><br/>
<br/>
Full Name: {{firstName + " " + lastName}}
<br/>
<button type="button" ng-click='f()'>Click Me!</button>
</div>
<script>
var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope) {
$scope.firstName = "Yetesh";
$scope.lastName = "Chaudhary";
$scope.f = function ()
{
alert("I m clicked ${sysparm_sys_id}");
}
});
</script>
</body>
</html>
</j:jelly>
Hope it helps!