UI page to display record details

[Community Alums]

I'm working on a requirement to create a UI page that takes catalog item as input and display info of catalog item from Maintain item table.

Also a way to call this UI page from Catalog item itself, so UI page should take catalog item id as input when called.

Below is my html script but this is direct display , I'm able to add input variable as well but not get info when changed.

Any inputs ?

<?xml version="1.0" encoding="utf-8" ?>
<j:jelly trim="false" xmlns:j="jelly:core" xmlns:g="glide" xmlns:j2="null" xmlns:g2="null">
	<div style="font-weight:bold;font-size:20px;; padding-left:500px">Catalog Item details</div>
<g:evaluate jelly="true">
		var nameSCI='';
		var sd='';
		var gr = new GlideRecord('sc_cat_item');
		gr.addQuery('sys_id','ff6933fedbd4a45014670010ba9619bf');
		gr.query();	
		if(gr.next()){
		nameSCI = gr.name.toString();
		sd = gr.short_description;
		}	
</g:evaluate>
<table class="table table-bordered">
<tr style="background-color:#428BCA; color:#FFFFFF;">	
	<td>Title</td>
	<td>Value</td>
</tr>
<tr>
<td style="font-weight:bold">Name</td>
<td>${nameSCI}</td>
</tr>
<tr>
<td style="font-weight:bold">Short Description</td>
<td>${sd}</td>
</tr>
</table>
</j:jelly>

[Community Alums]

@Ankur Bawiskar any inputs please

[Ankur Bawiskar]

@Community Alums 

how are you calling this and from where?

from where the input is fetched?

[Community Alums]

My initial thought is to call from Catalog item description, "for more details click here" hyperlink contains UI page url passing catalog item sys id. Input (catalog item sys id) will be fetched in UI page to get details of catalog item and display . I'm not sure if this is possible.

[Community Alums]

any Ideas is this possible ? @Ankur Bawiskar @Allen Andreas