Glidewindow catalog client script Onload not working on service portal

[Piyush291]

hi All,

I have created a catalog client script on Load using glidewindow. When i tested on Portal it is triggering the Java console error. Kindly help

function onLoad() {

var dialog = new GlideDialogWindow('EAP_popup');
dialog.setTitle(new GwtMessage().getMessage('Confirmation'));
dialog.setSize(750,1000); 
dialog.removeCloseDecoration(); //Remove the dialog close icon
dialog.setPreference('cancel_url', '/google.com');
dialog.render();
}

[Piyush291]

UI page script

HTMl:

<?xml version="1.0" encoding="utf-8" ?>
<j:jelly trim="false" xmlns:j="jelly:core" xmlns:g="glide" xmlns:j2="null" xmlns:g2="null">
<g:ui_form id="EAP">
<!-- Scholarship dialog -->
<style type="text/css">
#hr_dialog_footer input {
width: 100%;
}
#info_message {
margin-left:10px;
color:#FFFF99
}
</style>
<g:evaluate var="jvar_cancel_url"
expression= "RP.getWindowProperties().get('cancel_url')" />
<input type="hidden" id="cancel_url" value="${jvar_cancel_url}" />
<div>
<div>
<label for="hr_comments" class="control-label col-sm-1">
<span class="required-marker"></span>${sysparm_text}
</label>
<br />

<p>
Service Centre Private Limited ('the Company') is committed to develop and sustain highly skilled and competent workforce by supporting learning and development for managers and employees in an open and non-discriminatory manner.
</p> <p>
We have now automated the Education assistance approval process for you. This will help you get automatic updates regarding the status of your approval application. Please ensure to read the Education Assistance Standard before applying

</p><br />
<span>
<g:ui_checkbox id="accept_terms2" name="accept_terms2" value="false" mandatory="true"/>
'Yes, I've read the Education Assistance Standard Policy.'
</span>
</div>
</div>
<a href="http://thesource.ca./static/Intranet/Corporate%20Office/Policies%20and%20Standards/files/Privacy%20Operating%20Guideline%20-%20Enterprise.pdf" style="text-decoration: underline" target="_blank">please ensure to read the Education Assistance Standard before applying</a>

<footer id="hr_dialog_footer" class="modal-footer">
<input type="hidden" id="state_sys_id" name="state_sys_id" value="${sysparm_state_sys_id}"></input>
<input type="hidden" id="task_sys_id" name="task_sys_id" value="${sysparm_task_sys_id}"></input>
<input type="hidden" id="task_table" name="task_table" value="${sysparm_task_table}"></input>
<input type="hidden" id="dialog_type" name="dialog_type" value="${sysparm_dialog_type}"></input>
<input type="hidden" id="is_comment" name="is_comment" value="${sysparm_is_comment}"></input>
<input type="hidden" id="button_clicked" name="button_clicked" value="ok"></input>

<g:dialog_buttons_ok_cancel ok="return submitOk()" ok_type="button" cancel="submitCancel()" cancel_type="button"/>

Client script:

function submitOk(){
var terms2 = gel('accept_terms2').value;
if(terms2 != 'true'){
//If terms are false stop submission
alert('Please confirm to continue fill the application form.');
return false;
}
else
{

}
//If accept checkbox is true do this...
GlideDialogWindow.get().destroy(); //Close the dialog window

}

function submitCancel(){

if($('cancel_url').value != 'null'){
window.location = $('cancel_url').value;
}
else{
window.location = '/google';
}
}

[Omkar Mone]

Hi 

You can create a widget in this case, same code as your UI Page with HTML div's ofcourse, and then you can call that widget on the spModal mentioned in the below link - 

https://developer.servicenow.com/app.do#!/api_doc?v=helsinki&id=SPModal-API

Regards,

Omkar Mone

[Piyush291]

Hi Omkar,

I have created a widget 

<div class="panel panel-danger">
<div class="panel-heading">
<h4 class="panel-title">Terma and conditions</h4>
</div>
<div class="panel-body">
<div class="alert alert-danger" role="alert">
Kindly check the Button or cancel the request<br>
</div>
</br>
India Service Centre Private Limited ('the Company') is committed to develop and sustain highly skilled and competent workforce by supporting learning and development for managers and employees in an open and non-discriminatory manner.
</br></br>
We have now automated the Education assistance approval process for you. This will help you get automatic updates regarding the status of your approval application. Please ensure to read the Education Assistance Standard before applying.</br></br>
<input type="checkbox" name="agree" value="agree" ng-model="c.data.agree"</input>
<span style="color: blue">Yes, I've read the Education Assistance Standard Policy.</span>

</div>

<div class="panel-footer text-right">
<button class="btn btn-secondary" ng-click="c.closemodal()">${cancel}</button>
<button class="btn btn-primary" ng-click="c.closemodal()">${OK}</button>
</div>
</div>

Now i have write a client script on load function so whenever user open a catalog item then it should display this message first.

function onLoad()
{

function test($uibModal, $scope,$window) {
var c = this;

c.openModal = function() {
c.modalInstance = $uibModal.open( {
templateUrl: 'EAP_test',
scope: $scope
});
};

c.closeModal = function() {
if( (c.data.agree == undefined || c.data.agree == '')){
$window.alert('Please confirm the EAP');
}
c.modalInstance.close();
};
}

}

But it is not working. Can you please help as i am not able to get this. Also this is first time i am creating the widget so dont no much about it.

[Omkar Mone]

Hi 

Can you try with the below code once, because i tried it in my PDI and it looks near to what you need to achieve - 

function onLoad() {

	var html = '<div class="panel panel-danger"><div class="panel-heading"><h4 class="panel-title">Terma and conditions</h4></div><div class="panel-body"><div class="alert alert-danger" role="alert">Kindly check the Button or cancel the request<br></div></br>India Service Centre Private Limited (the Company) is committed to develop and sustain highly skilled and competent workforce by supporting learning and development for managers and employees in an open and non-discriminatory manner.</br></br>We have now automated the Education assistance approval process for you. This will help you get automatic updates regarding the status of your approval application. Please ensure to read the Education Assistance Standard before applying.</br></br><input type="checkbox" name="agree" value="agree" ng-model="c.data.agree"</input><span style="color: blue">Yes, Ive read the Education Assistance Standard Policy.</span></div>';
	spModal.open({
		title: 'Testing',
		message:html
	});
}

Result - 

Regards,

Omkar Mone

[Piyush291]

Thanks Omkar it is coming like this

One more Request if user click on cancel button then i need to route him to another page. Also i need to add link in this pop-up. which will be the PDF link