good morning everyone and welcome back to mobile app academy this is our live building series where you show you how to build and configure mobile apps on an app platform my name is david haw and i'm an outbound product manager here at servicenow and i'll be your host for today's session um i also have ian keener who is also on our mobile team and we want to give a warm welcome to everyone joining us live here today um if you are joining us for the first time welcome to our session uh you have our product experts here to provide guidance best practices and answer any questions that come up along the way and we do host these mobile app academies every two weeks at 10 a.m pacific in which our recordings will be posted to youtube on the service now now community channel just to quickly review um uh we have various other community channels that you can check out as well uh such as the hr service delivery academy platform foundations platform analytics virtual agent and many others that you can find on their respective community sites um but just to quickly review for today's session this will be about a 40-minute session um we'll start off with a quick 10 minute overview our goals for today what we're going to implement and how to get started and then we'll jump into the exercise in which we'll cover the fundamentals on what it's like to build an action function using an input form screen we are seeing a lot of questions on input form screens on community floating around and so we just want to address some of those common uh questions okay and then we'll open up to some q a afterwards um also if you are looking for more hands-on training um there are some additional skill building videos that we have that we can share in the chat um as well as a now learning course called mobile using baseline functions in rome um these are great resources that you can use to get started get hands-on experience and we'll throw those links in the chat in a second so definitely check those out if you haven't already but with that all said let's jump into our overview um just to provide some background on mobile functions in case you're new mobile functions are what we use to define what actions users can perform inside of our service time mobile apps in order for a user to execute any action whether it's updating a field creating a new record or any cred related operation the system admin will have to configure an action function for the user deal right it's quite different from web or um what you might be familiar with on the platform ui we built mobile with intention of building optimal mobile first experiences for users and what that means is we're not giving users complete access to their entire instances but really you have to define what is exactly you want your users to do on mobile and you have to build out those specific use cases you know what are those three to five most important actions that a user would actually want to do on their mobile device and building those out and by creating this optimal mobile experience for users they'll actually want to use your app to access their service on records and you will improve your app engagement and retention over time okay and there's really three types of main functions that you can use and configure for end users they are your right back actions navigations and smart buttons write back actions are probably the most common um that's anytime that you want to make a change to records on your instance things like creating a new task updating task maybe even reassigning a task to yourself and so forth um we also have navigation functions which are which are what we use to navigate between screens in our mobile apps and most commonly used to navigate users with record contacts meaning where that and where that user ends up landing will depend on the information on the record a quick example a user could open up incident 2000 and if they want to pull up more information on the caller of that record you can navigate to a profile screen that pulls up details on that caller right so that's how a navigation function could possibly be used and then the last type of function that we have are smart buttons and typically use smart buttons to interact with native applications on your mobile device such as your phone your map or email and you can create smart buttons where if the user taps on the location of the field it can pull up your apple maps or whatever native map app you have on your device and navigate you to that destination commonly used in the field service mobile app you can also use smart buttons to navigate to different urls so if you want to take your users to a specific portal page or even your company website you could do so okay so those are just a couple examples but for today's session we're really going to be focusing on the right back action since this is the most common form of how users perform actions inside of the apps creating and updating records um and if you've been with us prior to rome you might be familiar with the old method of building actions using item parameters and ui parameters and these were essentially inputs that were used to build your write back action right if you wanted to create an action that allowed users to update the short description or priority fields then you would create two item parameters and two ui parameters and then map them together right that was the experience prior to room but as we move into roman beyond we've introduced the concept of input form screens which will help enable further functionality and control on how you define your actions but the fundamentals are still the same with input form screens this essentially provides an interface for your users to change and update record information on mobile and there's been a ton of improvements that that have come with this you can now build more streamlined experiences for users to enter in data you can organize inputs by different sections of information you also have the flexibility to paginate your inputs into multiple pages so you know you don't have this super long list of 20 fields that a user has to fill out on a single screen you can break those out right and there's a lot more things that you can customize like the header of your input form screens the labels of your buttons and how just your how inputs appear on the screen themselves these are all things that you couldn't do with the old way of building actions okay um also we're supporting other very common use cases that we get asked on community all the time things like autofilling variables with script in fact ian actually did a video a skill building video on this that we can share in the chat you can also support multiple attachments as inputs and also do field value calculations okay so i think the most important takeaway here really is that we've released a new build a new way to build native actions for mobile and it's going to further expand into other use cases as we keep getting feedback from all of you right um we're not going to going to duplicate any of the old actions you can still continue using them today but just know that input form screens will be more dynamic and you'll be able to create better user experiences with them moving forward okay um but with that said i think we can now jump into the exercise for today um again we've been seeing a lot of questions on community asking how input form screens can be used to do things like supporting dependent inputs for reference fields uh or maybe even fields that use advanced preference qualifiers how do we make sure that the actions uh when the user selects those inputs that it's supporting um that reference field logic right or how do we use autofill variables these are all things that we will cover in today's exercise um and we'll be using the field service mobile app as an example um we're going to start with building an input form screen that allows agents to assign tasks to each other and let me reassure a screen really fast me share my desktop okay so here you can see my mobile app here i'm in the field service mobile app for servicenow agent and if i go to one of my work order tasks um all i'm going to do is i'm going to create a new function in this top menu function here and i'm going to i'm going to add a new function that allows me to assign tasks to other agents okay so let's go ahead and get started here um jumping into my instance let's go to the baseline here um i'll zoom in so it's a little easier to see um and the first thing we're going to want to do is open up mobile app builder so that we can build a new function uh and then we will jump into the field service mobile scope and then we are on the left side we're going to open up functions and create a new one here okay so typically the steps to build any function is you create the function you create the action item um you create the input form screen and then fill out all the attributes as well as the inputs that you want um and then once that function with input form screen is done you then associate the function to the screen that you want okay and the first step is really building that function and action item so let's do that now uh and we will call this assigned to uh we'll just call it it's line two function uh the function type is action item it's gonna be a record type because we're updating specific records we'll want to create a new action item um let's select the table that we want first since that's a required field it's going to pull from the work order task table you can set conditions here but i'm not going to set any and you can see that you know we still support the old way to build actions with ui parameters um and item parameters okay so let's create our action item now going to zoom out a little bit we'll call this assigned to action item uh we want to update the field since it's changing the assign to field and then this will also pull from the work order task table okay and now this field value is asking what are your inputs on this action item and we'll get to this we first need to build our inputs on the input form screen and then map them to the fields that live on the table okay so let's go to save for now and then let's now start building our input form screen we will call this the assign to input form screen um and you can see that you can do things like change the header of the card itself so when i say header it's this portion of your input form screen right if you're not okay with just the basic you know title of your screen that's something that you can configure you can also change the buttons we've had some requests to be able to modify things like the submit button the cancel button the next and previous and so you're able to do things like that the input form page display this is where you can now paginate your inputs so let's say that you know the inputs that you want to collect from that user have different categories of inputs one page could collect um you know the um who do you want to assign this task to um and then you know the second page could collect other information that's more related to the task so things like short description priority things like that or if you just want to have it all on one single page that's completely up to you but now we give you the flexibility to pick one or the other this can also be used to build like dynamic um you know serving experiences so if you wanted to i think this is something that safe workplace has done in their apps they paginate um their inputs based on what kind of information that's collected and so you have this streamlined serving experience that's um quite streamlined okay so we're going to build now our first input which in order to use the assigned to field it's actually dependent on the assignment group field and so we have to build our assignment group field first so i'm going to create a new input for assignment group um and then we'll also call this assignment group if you want a placeholder so let's say that this was a string field for example although we know that this is a reference type if it was a string filled in you can help explain what is it that the user is expected to type in there right so what um assign you won't actually see this placeholder unless it's a string um so i'm going to delete that for now [Music] we know that this is a reference type um and then you can actually set whether the field is mandatory or read-only um you can also autofill this and i'll show you that with another i'll get to that in a second so let's save this for now um we now in order for your input to work it now needs to have attributes this will determine where the data will come from and how you want to uh manipulate that input um so let's create um in order to understand what attributes are needed for each for various different input types you'll actually have to reference our product docs so if you look up input form screen on our docs and then open up the latest here you're going to want to scroll down and click on configure input form screen and then jump into variables and attributes and then depending on the field type uh let's look up variable for example um [Music] oh this is not the right stock is this one uh input form screen attributes for inputs here we go uh and this will show you all the different uh field types you have boolean choice date and time number ranking preference this is what we're looking for and it's going to tell you that for any reference input you need these three attributes so these are the three attributes that we need to fill out source table is uh it's going to be work order task the source field name is going to be the field itself which is assignment group and then the target table this is what makes it a reference or this is the table that we wanted to find that targets your reference field or even the reference qualifier to find this target table i'll show you we'll go to the table definitions so let's look up table under system definition and we're going to look up the work order task table there it is work order task and then for uh the field we're going to look up um assignment group this tells me that this assignment group field is a reference type of field and that it's referencing this table here this group table and if i look this up or open this up it'll tell me the actual label which is cis user group and this is what we're going to fill out um on our attribute okay so this will be cis user group so let's go ahead and build those out now on our attributes we're going to need three the first one will be the source table which again is work order task and this same logic applies to um fields that support advanced reference qualifiers as well um this uh the configuration is exactly the same whether it's just a reference or it uses advanced reference qualifiers okay and then we'll build our second attribute for source field the table's pulling from the work order task table and it's going to be assigning group okay um so right now this input does work but when the user starts to fill out this field it's going to see all of the values available on this table um but um since it's a reference type we need to point to the groups table to understand how it filters out that information that way the user is not trying to scroll through hundreds of records right um and so we're going to create this third attribute for source table sorry target table that points to this group table here that it's referencing so it's just user group okay and now it should only pull up the assignment groups that are are relevant to this record okay so now that we have the first input done for assignment group now we can build out the assigned to input so let's create the second one and we'll call this assign2 the label will be the same we can give it an order we want it below the assignment group so we'll save that and then we're going to start building out the attributes and again this is also a reference type so it's going to need these three attributes to find the target table let's go back to our um our dictionary uh we want to look up assigned to oh this is the wrong table let's go back to work order task assigned to so again this is a reference type and it's referencing the user table so our target table will be cis user okay so let's create our three attributes the source table is work order task the source field name is assigned to and then lastly the target table is sysuser okay and so now i have two inputs complete they should now correctly filter through these inputs so that it's only showing the values that are relevant to the task okay um but i'm not quite done with this function yet the last thing we need to do is um we need to now map these inputs back to our action item all right our action item was asking what are the field values we need to map it here so we want to make sure we're mapping the assignment group field to the input that we just created as well as the sine to field to the input that we created there and then we'll go and save um now at this point our action does work um so let me show you what the current behavior is and then i'm going to do a few things to improve the input formula okay so let's pull up our mobile app again i'm gonna do a swipe down to refresh um oh here's the first mistake although our action works we haven't put it anywhere yet um we now need to associate it to a screen right for it to pop up and where we want it to put it is on this critical task screen uh if you tap on see all um and then open up a record we want to put it on the top menu here of this record screen okay so let's go back to the home page of mobile app builder and find this screen i believe it's called critical we'll open this up and again the screen that we want is the record screen so on this left hand nav we just scroll down to the record screen and then scroll down here and you can see all of the functions that are currently associated you're probably seeing like 15 here but a lot of them are inactive that's the reason why they're not showing up here okay so let's create a new one um and we'll call this the assign tube function uh the display will just say assign to um and let's have this at the bottom so we'll just give it an order of 100 or a thousand okay it doesn't need an icon but let's choose the function that we just created which is called a sine two function okay and then we'll save so now if i do a refresh i should be able to see my function oops okay so right now it's automatically paginating the inputs for me what that means is it's going to put one input on each screen instead of if i select one and click next um you can see that the inputs are on different pages right i can go previous next um also notice that it's not showing me every assignment group that lives on this table it's only showing me the assignment groups that apply to this task because it knows that this task is located here and so i'm only seeing two values right um but you might be wondering why is it not working for this assigned to so let's double check what we did wrong here so let's go back to our function um and open up the assigned to and then check out that assigned to input oh and here's the prompt so we left the input type as string but what we really want is reference so now if we save this and do a refresh we should now see all of the um users that apply to this assignment group okay so notice how if i don't select um an assignment group is going to show me every user on this table right but as soon as i select one it's going to filter out the values and show me only the relevant ones and i can submit that and i'll update the record okay um now what if i wanted to have both of these since i only have two inputs right now how do i get them both on a single page um to do that we go back into our input form screen and there is a setting here called input forms page display by default every function will use this top one for one page for each input um but if you want more control you can then select the custom page and section setup so let's save that um once you've selected the setting you can now go into your inputs and scroll down and see input placement this will this gives you control on where you want to put this input now um so let's say that oh right now i don't have any pages so i need to create them um if i scroll down you can see pages here we'll create two pages um page one order 10 and then we'll create a second one page 2 order 20. okay so now i have two pages let's put both these inputs on page one and then i'll show you the experience so now if i refresh i can see both on a single screen okay but let's say that you had 10 inputs and you know five of those inputs are have one category and the other five relates in a different category you have more control on where to put them okay um similar experience and we can submit um i could probably just build two more inputs just to show you the that experience um let's now build a choice type of input let's say that we want to give the agents the ability to configure the priority field as well as the short description okay so let's go back to our input form screen and create uh another two inputs let's first create the short description which is a string type field um here is now where we can start using the placeholder so if there's a very specific description that you want users to put or some sort of instructions you can put in this placeholder um you know we'll just write description less than 20 characters um the input type will be string and then we also want this let's put this on the second page and then save uh for string types of inputs if you check out our docs you're gonna see that strings don't actually require any attributes um these are optional attributes and so if you actually wanted to specify a maximum number of characters for your short description you can configure that here and if you want it to be inline you can also do that so instead of tapping on this and having it pop up another module to type in you can actually just tap it and start updating so let's let me show you what that looks like um let's create a new attribute for inline uh this value is true to turn that on um and then we'll create a second attribute for um [Music] is it max length yeah max length let's do 10 characters okay uh so now if i i need to now map it to my action item so we'll do an and clause and do short description maps to my short description input and now if i swipe down to refresh i should be able to see that third input on the next page so you can see that there's a explanation um you know a broken laptop uh and i can't even type broken laptop fully because i maxed it out to 10 characters okay although this inline attribute's not quite working the way that i wanted to so let's double check that instead of popping up this module it should just allow me to type directly in here so let's see what happens if i turn this off huh this might be a defect on our side um uh in any what do you recall using this attribute recently um are we trying to lengthen that or oh no it's just the inline attribute so if i type here on the short description it should just allow me to type directly not pull up another module oh sorry i haven't uh okay we're gonna encounter that lately i will take that back to um i'll record that um but anyways uh let's also create one last attribute or one last input for choice um and if you look at choice attributes or inputs um you're going to need three attributes to make this work uh david sorry one one thought is that it may if we're talking about opening that uh string element in a modal it may only apply if there's only a single input oh is that true are you are you saying that for inline to work it only needs it requires only one or you can only use one but not three which i have here yeah no sorry i i was thinking about the pop-up like if you approve um if you're doing an approval oh not quite we don't want the pop-up right we just want to type yeah yeah yeah sorry i guess that won't that won't help yeah um but yeah let's let's move on from that um let's create our last uh input type and then i'm also going to show you the autofill and then we'll wrap up so for choice let's create an input for the priority field i saw a question on community that asked why they couldn't update the priority field using their actions and so hopefully this will answer that question for them um [Music] so let's create a fourth input on our input form screen and we'll create a new one for priority and this input type is going to be choice okay let's also put this on the second page and then save and then we will create two attributes first for table which is going to pull from the work order task table and then also pull from field which is gonna pull our priority field okay um for that third attribute this is if you want to multi-select and really this is a this works better for things like uh um possibly selecting multiple attachments or actually no no um ian have you run into use cases where the multi-select is used for choice what's a good use case here um i'm thinking um i guess if perhaps if multiple locations were being impacted by a user or or multiple assets we needed to change the state or something like that trying to think of an out of the box example but those are a couple quick ones off the top of my head um but for now this choice we'll just use two attributes um and then we'll save that and then lastly let's associate the choice field choice input to our choice field so we'll set party to priority and then save that um we did get a question recently um i think our docs are slightly outdated if you look at choice uh there is a note that says choice field dependencies are not supported um i believe there was a recent change in san diego was it in that um we actually now support field dependencies some choice um this might not apply on a roam instance but once you upgrade to san diego it will start working and so let's say that you want the values on your choice to filter uh based on whatever the task that you're applying it to right so instead of six values you should really be seeing four values this will work starting in san diego that's right an example another example use case would be selecting an incident category and seeing the filtered list of subcategories that use case is a pretty common one as well and will also apply okay um so now let's go ahead and refresh and see if we can see our fourth input okay so there's our party uh the last thing i want to show is you're currently seeing that all these fields are blank right you can't really see the pre-filled information that this um these values should be so i'm now going to show you how to set the autofill variables that way you can see that you know this this task in particular currently has assignment group of field service it's currently assigned to david hall and so forth so let's create four autofill variables the first for assignment group so we will go to our assignment group input actually we go to our input form screen and create those four variables we'll call this assignment group variable variable type will be a database field but also know that there's these other variable types as well you can autofill the date some sort of constant value as well as gps coordinates as well as the logged in user okay for assignment group we just want the database field for the variable attributes we are going to select field name um it's going to give us the current value from the workforce task table for the assignment group build and then save okay so now every time i pull up this input form screen it should show me the current value let's also do it for [Music] the other three fields really quickly this one will be assigned two variables and then map it to the assigned to group um let's do it for party and then lastly we'll do it for the short description okay so now that i have these four variables i now also have to map the variables to the inputs okay so with our first input for sine two we'll scroll down and um it has a field asking for the autofill variable if there is one and so we'll just map it to the autofill that we created we'll do this for the assignment group as well as well as short description and then this um priority okay so now my autofills should work i should be able to refresh and see the current values for all of those four inputs okay see and so if i wanted to change anything let's change this to moderate submit we can see that the priorities changed okay um let's see i think that's everything that i wanted to show oh a couple other common ones um it's just the mandatory and read-only settings for your inputs so let's say that i don't want agents to be able to modify the short description we can set the short description to read only so let's go to short description set this to read only and maybe the most important input that i want the agents to complete is actually uh you know the assigned to input i can make that one a mandatory type of field and save that so now if i refresh i should see one input that's required which is this one and then i no longer can modify the um short description input okay uh so that wraps up um our academy for input form screen fundamentals uh i think we were able to answer a lot of the common questions we're seeing around community um there are a few other questions that we saw things like being able to autofill script using the autofill variable and we actually have that video which ian has posted in the chat and i think the only other example that we saw were how to use how do you add attachments as an input to your input form screens and that's something that we can cover in the future academy but definitely let us know if there's any other specific topics that you want us to cover on input phone screens in the future um ian are there any questions that we want to highlight from [Music] the chat yeah so there was one question around um if we have a video on creating a new incident function um and you know i wanted to get your thoughts on that as well um basically like a lot of the the you know the the concepts that you showed today apply to creating a net new function like that obviously different inputs different variables but the same mechanism in terms of how you build it using you know an action item right back and so on um i'm not aware of a specific video on demonstrating that exact use case i'm not sure if you are um david uh i don't think we have an example but we can run through that really really fast um [Music] like ian said all the mechanisms are the same uh the only thing is when he goes to the action function um we're still using an action item the primary difference is we're no longer updating specific records or creating new records and so the function will now be a global function um we'll save this and the other primary difference is when we go to your action the type is no longer update but new okay um yeah i'm going to and i just wanted to mention that the global the global thing um is a great call out it will allow you to add that function outside of the context of a specific record so for example as a quick action at the top of the screen in ios um outside of a specific record you can add that type of function anywhere yep exactly so i think i now just need to associate it to this list screen here and this should work actually um this will allow us to create any uh work order task with short scription or priority actually this might not work because there's a lot of logic um taking place on the work order task table i forgot what the required fields are um but this would work better on like an instant table maybe i can switch to it really fast incidents i will create one input just for short description and show you what that looks like so um [Music] we'll even create a new input form screen so let's create an input for short description it doesn't need any attributes and then we'll just map our short description to that input and save i think this should work um i need to find a place to put it though let's enable our itsm scope we'll go back to mob builder let's find a navigation tab that shows me instance actually it might be faster i just add it as a quick action yeah i can just create launches exactly so going back into my builder um we'll open up the scope that already have open um and we'll open up this entire launcher screen which is called it's called my work yeah my work um and then quick actions well associated here um create new internet tests and then we'll select the function that we just created i forgot what it was called uh let's create another mob builder to find a function that we created earlier uh we called it oh is it the scientist still oh yeah it's called a scientific okay let's call this a create new there it is okay so now if i save this we should be able to see it in our quick actions create new incident i didn't give it an icon so it just pops up the question mark but you know i can say broken laptop and be able to successfully submit this so that's just one example of um a function with one single input right you have uh same all the other inputs that we created like for choice and reference those all apply as we were creating the our update function earlier hopefully that answers that question um ian are there any other questions we want to highlight that's all cool okay if no other questions thank you all for joining us today hope you found this session helpful which you can let us know in our post session survey there's also gonna be a couple questions asking you what topics you want us to explore in the future we love getting feedback from all of you um and this is actually a great way to share with us what topics we should cover next week in the following so please let us know in survey um if you're interested in any of these past app academies uh we'll upload them to youtube which you can find on both our community site as well as the now the servicenow community channel um so make sure to register to your academy series where you can get the latest notifications on latest updates and topics uh but with all that said thank you all for joining us today and we hope to see you again in two weeks um we're going to cover how to build native surveys or not native series just mobile surveys in general um and how to add those to your apps okay thanks everyone for joining cheers