Open a modal after form submission

jonndoe
Kilo Contributor

Hi guys,

I was wondering if I could open a modal popup with some data in it after a record producer is submitted in Service Portal. I have this record producer that requires displaying some information to the users upon submitting a form and wonder if someone could shed some light on how to achieve this please?

Many thanks,

JD

1 ACCEPTED SOLUTION

here is an example onload client script I wrote that should work for either SP or OOB views. you can render direct content in the glidemodal like this code below. If you would rather use a ui page that is fine for the GM, but for the spModal, you would need to create a new SP widget to display it. this should give you the concept though. spModal is only available on Portal, so that is why we handle both cases in one script. Make sure you select UI Type = All in your client script.



function onLoad() {


    //Type appropriate comment here, and begin script below


  if (typeof spModal != 'undefined') {


      spModal.open({


          message: 'This is a test SP modal',


          title: 'Test SP Modal'


      });


  } else {


      var gm = new GlideModal();


      gm.setTitle('Test GM');


      gm.renderWithContent('This is a test GlideModal');


  }


}



This technically should work the same in a catalog onSubmit client script, but I still feel there will be an issue with redirects in the OOB view, though it actually may work fine in the SP because it is a single page app so doesn't do a true redirect after submission.


View solution in original post

29 REPLIES 29

here is an example onload client script I wrote that should work for either SP or OOB views. you can render direct content in the glidemodal like this code below. If you would rather use a ui page that is fine for the GM, but for the spModal, you would need to create a new SP widget to display it. this should give you the concept though. spModal is only available on Portal, so that is why we handle both cases in one script. Make sure you select UI Type = All in your client script.



function onLoad() {


    //Type appropriate comment here, and begin script below


  if (typeof spModal != 'undefined') {


      spModal.open({


          message: 'This is a test SP modal',


          title: 'Test SP Modal'


      });


  } else {


      var gm = new GlideModal();


      gm.setTitle('Test GM');


      gm.renderWithContent('This is a test GlideModal');


  }


}



This technically should work the same in a catalog onSubmit client script, but I still feel there will be an issue with redirects in the OOB view, though it actually may work fine in the SP because it is a single page app so doesn't do a true redirect after submission.


Thanks a lot for this,Jon!



I have now included the IF section of the function and made the script mobile only as I have a separate script taking care of the OOB view. Modal generates perfectly and now my task is to bring the UI page functionality onto the modal so that depending on the option a user selects on the form a different message is displayed.



Really appreciate your help with this one.



Cheers!



JD


CA5
Tera Contributor

Hello All,

Can you help me on this?

I have written the below Catalog Client Script to open a PopUp Window when user submits a request for an item on service portal.

function onSubmit() {

spModal.open({
title: 'Dialog Window',
content: '<form>' +
'<label for="name">Your name:</label><br/>' +
'<input id="name" class="input" name="name" type="text"/><br/>' +
'<label for="email">Your email:</label><br/>' +
'<input id="email" class="input" name="email"/><br/>' +
'<label for="message">Your message:</label><br/>' +
'<textarea id="message" class="input" name="message"></textarea><br/>' +
'</form>',
buttons: [{
label:'Yes', primary: true,
},
{
label: 'No', primary: true,
}]
});
}

1> popup window is opening without displaying form on it which i defined in then "content" of spModal.

 2>  how can we get form's variables value on spModal Modal PopUP Window

Thank you Jon,

 

I've used the same script on onsubmit. But, I want to remove cancel button and if I click on OK button page should redirects to some other page. How can we do this. Please let me know ASAP.

 

find_real_file.png

jonndoe
Kilo Contributor

Thank you all for your replies - much appreciated!