Using UI Page we are going to show the list of Incident’s based on selected users as Caller. Follow the below simple steps to develop the logic.

Steps:

  1. -> Navigate to System UI> UI Pages.
    -> Click New to create New UI Page.
    -> Name: IncidentListBySelectedUserFILTEROne
    -> 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">
<h1><center>List of Incidents of Selected User</center></h1>
    <!--techimonster.com -->
    <style>
        .table1{background-color: #f1f1f1;margin: 20px 0;box-shadow: 0 2px 4px 0 rgba(0,0,0,0.16),0 2px 10px 0 rgba(0,0,0,0.12) !important; width:100%; text-align:center;}
        .button1{background-color: #066599b3 !important;color: white !important;border-color: white;border-radius: 6px;padding: 6px 20px 6px 20px;}
        .pad1{padding:15px !important;}
    </style>
<table class="table1">
    <tr>
     <td class="pad1">
        <label style="font-size: 17px;">Select the User</label>
     </td>
     <td class="pad1">
       <g:ui_reference name="name" id="name" table="sys_user" />
     </td>
        
    <td class="pad1">
    <button class="button1" type="button" value= "Generate Report" onclick="showResult()">Generate Report</button>
    </td>
    </tr>
    
</table>
    <iframe id="my_incident" frameborder="0" height="500px" scrolling="yes" name="my_incident" width="100%" allowtransparency="true" src="blank.do?" border="0" ></iframe>

<!--techimonster.com -->	
</j:jelly>

    Client Script:

    function showResult(){
    var user=document.getElementById("name").value;
    document.getElementById("my_incident").src="/IncidentListBySelectedUserFILTERTwo.do?sysparm_user="+user;
}

     

  2. -> Navigate to System UI> UI Pages.
    -> Click New to create New UI Page.
    -> Name: IncidentListBySelectedUserFILTERTwo
    -> 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">
<!--techimonster.com -->
<g:evaluate var="sysparm_id">
          var sysparm_user = RP.getParameterValue("sysparm_user"); 
</g:evaluate>
    <style>
    .table th{padding-left:10px;}
    .table td:hover{background-color: white;}
        .prio{margin-right: 6px; width: 15px;height: 15px;display: inline-block;vertical-align: middle;-moz-border-radius: 4px;-webkit-border-radius: 4px;border-radius: 15px;}
        .col1{background-color:red;}
        .col2{background-color:orange;}
        .col3{background-color:yellow;}
        .col4{background-color:green;}
        .col5{background-color:grey;}
</style>
    <table  border="1" style="width:100%" class="table">
        
    <tr style="background-color: #455464b3;color: white;line-height: 30px;">
   <th>Number</th>
   <th>Name</th>
        <th>Priority</th>
 </tr>
        <g:evaluate var="jvar_gr" object="true">
    var gr= new GlideRecord('incident');
    gr.addQuery('caller_id',sysparm_user);
    gr.query();     
</g:evaluate>
        <j:while test="${gr.next()}">
<!-- If priority is 1 -->
<j:if test="${gr.priority==1}">		
<tr style="background-color: #4554641a;line-height: 30px;">
<td><a href="incident.do?sys_id=${gr.getValue('sys_id')}">${gr.number}</a></td>
<td>${gr.caller_id.name}</td>
    <th><span class="prio col1"></span> ${gr.priority.getDisplayValue()}</th>
</tr>
</j:if>
            <!-- If priority is 2 -->
<j:if test="${gr.priority==2}">		
<tr style="background-color: #4554641a;line-height: 30px;">
<td><a href="incident.do?sys_id=${gr.getValue('sys_id')}">${gr.number}</a></td>
<td>${gr.caller_id.name}</td>
    <th><span class="prio col2"></span> ${gr.priority.getDisplayValue()}</th>
</tr>
</j:if>
            
            <!-- If priority is 3 -->
            <j:if test="${gr.priority==3}">		
<tr style="background-color: #4554641a;line-height: 30px;">
<td><a href="incident.do?sys_id=${gr.getValue('sys_id')}">${gr.number}</a></td>
<td>${gr.caller_id.name}</td>
    <th><span class="prio col3"></span> ${gr.priority.getDisplayValue()}</th>
</tr>
</j:if>
            <!-- If priority is 4 -->
            <j:if test="${gr.priority==4}">		
<tr style="background-color: #4554641a;line-height: 30px;">
<td><a href="incident.do?sys_id=${gr.getValue('sys_id')}">${gr.number}</a></td>
<td>${gr.caller_id.name}</td>
    <th><span class="prio col4"></span> ${gr.priority.getDisplayValue()}</th>
</tr>
</j:if>
        
            <!-- If priority is 5 -->
            <j:if test="${gr.priority==5}">		
<tr style="background-color: #4554641a;line-height: 30px;">
<td><a href="incident.do?sys_id=${gr.getValue('sys_id')}">${gr.number}</a></td>
<td>${gr.caller_id.name}</td>
    <th><span class="prio col5"></span> ${gr.priority.getDisplayValue()}</th>
</tr>
</j:if>
            
    </j:while>
    </table>

    
</j:jelly>

 

3. Output:

Run the First UI Page ‘IncidentListBySelectedUserFILTEROne’ then select the user and click the Generate Report button.