ServiceNow - 5 useful onSubmit Client Scripts (for Service Catalog) in New York
my name is Jason Miller found harassment now solutions and we're about to unlock the power service now I like to start off by thanking all twenty six hundred and twenty-two subscribers in over 80 countries globally if you believe in transferring knowledge to those who need it most please click Subscribe your user data will not be transferred to anyone outside of Aspen now without your consent hello everyone well today we're gonna be going over five onsubmit client scripts that you should have in your arsenal as a developer and if you're just getting started with ServiceNow these are probably gonna be pretty helpful for you because these are some of the client scripts that I've seen used in the past in order to address you know certain customer requirements that you get on the daily when you're doing development of applications within the ServiceNow platform apologies for not posting any videos for I don't know a couple of weeks now I just had a lot of stuff going on I'm a doggie daddy now so I have a couple of puppies as of Friday so a couple of days ago so I've been very busy with that too and now let's just take it away and take a look at this form here this application called shell BTS you see you're wearing scoped app if you haven't dealt with scoped apps no big deal you can use these client scripts and a domain excuse me domain separated by but also but also in scoped apps but I'm going to demonstrate each one so we have about five five or six here that I've seen used in the past to address certain requirements so the first one centers around if you're doing like catalog this will probably be helpful so you might have a scenario where you have like box one right here which is an integer field and then box two which is just the check box and this one might be something like I don't know how many power chords need or something like this and this is will be like do you need a laptop so meaning that one would be the Mount that's you know the maximum amount and you're probably asking like well why wouldn't just make it an integer and a choice field or whatever the bottom line or the the main answer is this because the customer wants it this way so if you face that on the daily like I do sometimes hey no big deal so let's just take a look at this one right here I'm gonna hit zero in this box right here in box one and I'm gonna hit save and it's gonna give me this error here right so you need to add a number to box one or you need a check box to write so you need to do one or the other so I'm just going to hit save and it'll go ahead and submit so we have here under the hood what it looks like so notice here our type is on submit which means our script knees start it needs to start with function on submit and then I think I had like three there but I figured if I'm just going to show you a true/false and an integer I think you know two is fine so you can see the way we would set this basically here saying if and then remember G underscore form right so remember when we're dealing with client scripts what are we talking about what happens in the form action so and and sometimes it's debatable whether you want to use a like an on submit client script or a lot of times people use a business rule instead and it's just a matter of preference and you know if you want this to be just client side remember client side stuff isn't going to be as heavy as the business rules business rule will add that server logic the back end to it right so going back to this we have our g underscore form we're getting the value of box one and we're saying if it's zero and this one box two which is a true false is false then we're gonna kick out this error message right here and then we have this return false so feel free to copy that down if you like you have trouble copying it down contact me and I'll be more than happy to send you a copy of it so then our second one is going to be just a simple copying from one field to another now don't ask me why they wanted this I can't remember was so far back but let's just put in a number like 200 or we're gonna click Save and we're gonna see our copies over into another field and I really can't remember if this field was hitting on the forum or if there was an ACL locking it down or something where you know there was one group that need to see this one or enters and things here then this one saw this but anyway if you want to do it using it on some and client script that's how you would do it also one thing it'll help you with like if you're just getting started you'll be able to see how this is set up so we're saying here is G underscore form and they were saying set value right and we're setting the value of sold amount with this chief warm dot get value amount at sale now keep in mind that these are integer fields so if you were going to do this with like reference fields it would be set up a little bit differently and maybe I'll do that in the future okay so then our third one we're gonna say we want our begin date to be before the end date now if you're doing catalog it's kind of like with this one right you might have few dates here on your front end where the user s say you know I need this to be in here or like a change request like it needs to start here and then it's gonna end here so then we'll we're just gonna test that we're going to put in the 24th here and then we're going to put the end date before in the past right so before the 24th and we're gonna watch a kick out an error so we'll see your end date must be must be after begin date and let's go ahead and take a look at that was called validate begin end date something like that so what do we have here we have a very with three variables here right so we have begin 1 and 1 and we're getting the value begin in getting the value of n then we're saying with this format here we're going to use the date-time format user and then we're gonna say okay if they're not filled in no big deal and then we're gonna say okay here's the deal boom boom would be with these new variables all right we have begin to and then we're going to get the day for a format begin 1 and then a format and then end two but here's where it's determining right here this if statement so remember this you know like begin is before and that's fine right it's less than return true else then we're going to kick out this error message here right and then we have our return false right there so a little bit to digest there but no big deal again if you need a copy of something like this this is something we face on the daily as developers so you probably have seen this before but I just want to show you how you would set that up now remember that these are date/time fields so if we look at this form right here we have date and time whereas down here we just have the date so we're gonna see a little bit of a different constructs here in a second so the next thing we're gonna have here is low bid high bid so let's just pretend us an auction click on eBay or something and we bid here like a hundred and then let's say right here so lament and put in 110 but in fact they put in excuse me someone went to put in 1,100 or 110 excuse me they put in 11 for the high bid and then they click Save now we're going to get to error messages here alright so once telling us a little bit needs to be higher than the high bid and then the high bit needs to be low okay fine we got it to our masters maybe a little excessive but no big deal so let's just go ahead and see how this almost set up so we're gonna have here our on submit and then we have our variable low bid g-form get value again for a little bit high bid same thing okay so then we're saying if they're not you know there's nothing going on with them or nothing in those fields fine whatever and then we're gonna say here get decimal value a little bit right for these this new variable called low and then high get the decimal values high and then it almost looks like the previous one that we looked at so if low is less than high that's fine if not then we're gonna see this g-form schofield message so that's why it's popping up underneath the field so we can actually take it to that field and if you have a long form sometimes you'll see this chief worm show field message like in catalog I've seen that a lot where the form is just you know it's a little bit longer than the screen they want to take them to the exact fields on an on submit that's especially helpful because if they went through the entire process of going down that form you want to kind of bring them to that one field so I can tell you like filling out like a federal government clearance form you know it's kind of a massive amount of question so you might want to use this and last I checked that this show field message you can't use it like in a tab but you can use it on the main section of people or something that you know sometimes will refer choosing the header section so if you had tabs down here then it won't go down there and don't and I don't want to confuse you guys like tabs are different than related lists so there's a two different things so if you're in tabs it's not gonna bring it down there no it won't navigate so what I would do is kind of like bring it as low as it could go if it's in a tab and then show the field message there okay so then we got here start date end date and let me just go ahead and correct this make it one-time hit save and then our end ow did I not fix that all right listen let's make this the 14th then shall we just kicking out errors all over the place great okay so now we're gonna do the same thing with this start date end date will hit save alright so end date must be after start date so let's look at the contract this won't remember this isn't a date I'm feel these are just strict dates so here's how much simpler it looks so on submit and remember all these the type on submit so we're getting our form value or excuse me we're doing G form get value end date and then we're saying here if end date is less than start date they're going to clear the message we're going to add this error message right here and then on top of it I saw that and this one had this G form get label of end date which is pretty cool and you know like end date must be after so I really haven't seen this one in a while with the G form get label o so I thought that was kind of cool to include and show you guys so and then last lastly let's say you have people in there like sometimes they want to do like the customer really wants I could kind of firm on like update or let's just pretend this this you know UI action was like a custom one you made so when they click update here and let me first make sure that I changed just to 14 so it allows me to do that when I click update if you want to have your own message that pops up or you sure you want to update the record you can do something like this so yeah this is actually the sixth one I guess that we're doing today you'll see here function on submit and then G form dot get an action name right so the UI actions name is sis Ferb underscore update you know if you're gonna create a custom one or whatever the custom ones name is right here and then this variable message is going to be a get message and that message that you just shut the saw that showed up on the screen and then we have this return and then that's right so that's the construct of this one how that that script is set up so just to review here's our five on submit client scripts that we reviewed today so we had our check box I guess this is check spell check box slash integer or true/false validation copy field we had our date time field validation and we had our low versus high number validation or date field validation I just may set out and then as a bonus I showed you that confirm on submits and that's it for today if you feel like you learned something go ahead and click like if you need a copy of any of these just go ahead and feel free to ping me or just submit a comment in the video down below my name is Jason Miller founder of Aspen now solutions and we just unlock the power to service now
https://www.youtube.com/watch?v=kJ79uGMHg7o