.png)
In this blog post, we will show you how you can create a form in UI Page which can create an incident record.
Navigate to System Definition > UI Pages in the ServiceNow instance.
Click on New to create a new UI Page.
Give a name for the UI Page, for example, "Create Incident".
In the HTML field, add the following code to create a form that contains the necessary input fields and a submit button:
<html>
<head>
<title>Create Incident</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css"></link>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"></script>
<script>
var app = angular.module('createIncidentApp', []);
app.controller('createIncidentCtrl', function($scope, $http) {
$scope.createIncident = function() {
var shortDesc = $scope.shortDesc;
var desc = $scope.desc;
var ci = $scope.ci.sys_id;
var gr = new GlideRecord('incident');
gr.initialize();
gr.setValue('short_description', shortDesc);
gr.setValue('description', desc);
gr.setValue('cmdb_ci', ci);
gr.insert();
alert("Incident created successfully!");
$scope.resetForm();
};
$scope.resetForm = function() {
$scope.shortDesc = '';
$scope.desc = '';
$scope.ci = '';
$scope.ciResults = [];
};
$scope.searchCi = function() {
var query = $scope.ciQuery;
var url = '/api/now/table/cmdb_ci?sysparm_query=' + encodeURIComponent('nameLIKE' + query + '^ORDERBYname');
$http.get(url).then(function(response) {
$scope.ciResults = response.data.result;
});
};
});
</script>
</head>
<body ng-app="createIncidentApp" ng-controller="createIncidentCtrl">
<div class="container">
<h2>Create Incident</h2>
<form>
<div class="form-group">
<label for="shortDesc">Short Description:</label>
<input type="text" class="form-control" id="shortDesc" ng-model="shortDesc"></input>
</div>
<div class="form-group">
<label for="desc">Description:</label>
<textarea class="form-control" id="desc" ng-model="desc"></textarea>
</div>
<div class="form-group">
<label for="ci">Configuration Item :</label>
<input type="text" class="form-control" id="ci" ng-model="ci.name" ng-change="searchCi()">
<ul class="list-group" ng-show="ciResults.length">
<li class="list-group-item" ng-repeat="result in ciResults" ng-click="ci = result">{{result.name}}</li>
</ul>
</input>
</div>
<button type="button" class="btn btn-primary" ng-click="createIncident()">Create Incident</button>
<button type="button" class="btn btn-default" ng-click="resetForm()">Reset</button>
</form>
</div>
</body>
</html>Save the UI Page configuration.
You have created a UI Page that allows users to create incidents with Short Description, Description, and CI fields.
When the "Submit" button is clicked, a new incident record is created in the background using GlideRecord APIs. Note that you may need to modify the code to fit your specific requirements and configurations.
Commentaires