How to create a UI page with a filter on it

Nic Omaha
Tera Guru

Hello, 

Currently I have a UI page that I have written that queries a table and generates all the records that are in a "READY" status into a easy to read weekly report. Records are created on this table weekly by a scheduled job Monday mornings.

What I would like to do instead is have a drop down option at the top that allows me to choose a "DATE" ( only Mondays will be listed as that's when they are created" and then generate the report with all records that match that "date".

This will allow someone to run a report for say 2 weeks ago and compare it to this week. I'm pretty good at the HTML piece but am at a loss on how I would do this or if its even possible. 

I'm open to other options as well. 

See example of report below find_real_file.png

4 REPLIES 4

larstange
Mega Sage

Hi

 

What I do when I need a UI page to be dynamic, is the following

  1. I design the UI page to be able to read certain parameters in the URL server side. These parameters decide how the page is rendered.
  2. At first load there are no parameters, so the page loads with "defaults".
  3. Then the user fills out some input fields to set a filter of some sort. This triggers some client side scripting which reloads the page and adds the necessary parameters to the URL.
  4. When the page loads again the service side logic have rendered the page in accordance to the parameters in the URL

If you add a parameter to the url eg. ...?sysparam_myparm

you can get this value from the HTML script part if the UI page like this

 

In g_evaluate sections: var myParm = jelly.sysparm_myparm

 

In the HTML jelly code: <j:set var="jvar_myvar" value="${sysparm_myparm}"/>

Thanks! In theory that makes total sense however I've never done it before. I'm going to do some digging and see if I can find a example where I can see this in action. 

If you are new to Jelly scripting I would recommend these three videos from the TechNow youtube channel. 

 

https://www.youtube.com/watch?v=_MhWugMQegs&list=PLdWI6NcP0yplLRlfEx-sANLUcdIynII5S

gyedwab
Mega Guru

Hi Nicholas,

 

You may be able to do this without custom code using Explore Analytics' dashboard capabilities. Take a look at this example:

https://my.exploreanalytics.com/pub/dashboard/d4148c74021842ca841dee0285fb820e

That dashboard is real-time against ServiceNow data, and if you're logged in it allows drill-through to the data. It can be scheduled as you noted, or embedded in ServiceNow.

Take a look at the "date" slicer, which allows you to update multiple charts at once along the lines you said -- either "between" two dates, or during a custom date range.

You'd also be able to get a lot of comprehensive visualization, like this example:

https://my.exploreanalytics.com/pub/dashboard/37be862086ed40bb80e2d127694e8ba8

No code required, and you'd only need to license the people specifically using this dashboard. You can try it for free for thirty days here.