How to create a Button on Catalog item

AbdulAzeez
Mega Guru

Hello Everyone,

We have a requirement where we need to create a Button on Catalog item once the user enter details once the user click on the button it should redirect to some 'x' table and write those records.

It should work on Catalog & as well as Serive Portal

1 ACCEPTED SOLUTION

Hello Azeez,



I have tried below code in Serviceportal and it worked for me.



HTML:



<input type="text" name="name" ng-model="inputValue" />


<button type="button" class="btn btn-danger btn-block" ng-click="c.setFieldValue(inputValue)">Value</button>



Client Controller:



function($scope) {


var c = this;


c.setFieldValue = function(uploadname) {


var g_form = $scope.page.g_form;


if (g_form.getValue('a1') != '') { // a1, a2 Replace with your variable names


g_form.setValue('a2', g_form.getValue('a1'));


g_form.clearValue('a1');



}


else {


g_form.setValue('a2', $scope.inputValue);


$scope.inputValue = '';


}


}



Reference:


Service Portal: Catalog Item Buttons — ServiceNow Elite



Thank You


Srikanth


View solution in original post

10 REPLIES 10

Hi Abdul,



Are you saying you are getting difficulty in passing the catalog variable values to ui page or issue during inserting record in the target table in the ui page?



Regards


Ankur


Regards,
Ankur
✨ Certified Technical Architect  ||  ✨ 9x ServiceNow MVP  ||  ✨ ServiceNow Community Leader

Ankur,



Let me explain you what i did,



I created a button widget on SP now when the user enter all the variable details and click that widget i:e. Button then all the value need to captured which is not happening.



I hope you got my point.


Hello Azeez,



I think this might help you.


So, I created a button on the catalog item form as shown in the below image.


find_real_file.png


So now when the user clicks that button then the variable value(hellio) is getting copied into the another table i.e to the problem table.


find_real_file.png



I used the ui macro script below is the script:



<?xml version="1.0" encoding="utf-8" ?>


<j:jelly trim="false" xmlns:j="jelly:core" xmlns:g="glide" xmlns:j2="null" xmlns:g2="null">


<input type='button'   value ='Button' onclick="button1()"></input>  




<script>      


function button1(){      


              var kbcreate = new GlideRecord('problem');      


              alert('calling gliderecord');      


              kbcreate.initialize();


var call = g_form.getValue('test')


alert(call);


              kbcreate.short_description = 'Create value in KA'     /// This is working since its a static value      


              kbcreate.description = call;


              kbcreate.insert();                


                }      


              </script>      


</j:jelly>  




I think this might help you.



Regards,


Ajay.


Hello Ajay,



Glad to see your response



But UI Macro doesnt work in Service Portal, i am trying it using AngularJS


Hello Azeez,



I have tried below code in Serviceportal and it worked for me.



HTML:



<input type="text" name="name" ng-model="inputValue" />


<button type="button" class="btn btn-danger btn-block" ng-click="c.setFieldValue(inputValue)">Value</button>



Client Controller:



function($scope) {


var c = this;


c.setFieldValue = function(uploadname) {


var g_form = $scope.page.g_form;


if (g_form.getValue('a1') != '') { // a1, a2 Replace with your variable names


g_form.setValue('a2', g_form.getValue('a1'));


g_form.clearValue('a1');



}


else {


g_form.setValue('a2', $scope.inputValue);


$scope.inputValue = '';


}


}



Reference:


Service Portal: Catalog Item Buttons — ServiceNow Elite



Thank You


Srikanth