Debug UI Page

Ketan Pandey · ‎08-28-2023

Please suggest how to debug UI page

I have written script in UI Page inside the bellow jelly.How to debug this

<g2:evaluate>

</g2:evaluate>

SwarnadeepNandy · ‎08-28-2023

You donot need <g2:evaluate> to build grid table using UI page.

The <g:evaluate> tag is used to evaluate an expression written in Rhino JavaScript and sometimes to set a variable to the value of the expression.

To build a grid table in a UI page, you need to use HTML tags to define the table structure and content, and optionally use CSS classes to style the table appearance. You can also use Bootstrap, a popular framework for responsive web design, to make your table more a...

Here is an example of how you can create a simple grid table in a UI page using HTML and Bootstrap:

<!-- Include Bootstrap CDN link in the head section -->
<head>
  <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
</head>

<!-- Use the table tag to create the table element -->
<table class="table table-bordered">
  <!-- Use the thead tag to create the table header -->
  <thead>
    <!-- Use the tr tag to create a table row -->
    <tr>
      <!-- Use the th tag to create a table header cell -->
      <th>First Name</th>
      <th>Last Name</th>
      <th>Email</th>
    </tr>
  </thead>
  <!-- Use the tbody tag to create the table body -->
  <tbody>
    <!-- Use the tr tag to create another table row -->
    <tr>
      <!-- Use the td tag to create a table data cell -->
      <td>John</td>
      <td>Doe</td>
      <td>john.doe@company.com</td>
    </tr>
    <!-- Repeat the same for other rows -->
    <tr>
      <td>Jane</td>
      <td>Doe</td>
      <td>jane.doe@company.com</td>
    </tr>
    <tr>
      <td>Bob</td>
      <td>Smith</td>
      <td>bob.smith@company.com</td>
    </tr>
  </tbody>
</table>

<!-- Include Bootstrap CDN script at the end of the body section -->
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script>

This code will produce a grid table like this:

First Name Last Name Email

John	Doe	john.doe@company.com
Jane	Doe	jane.doe@company.com
Bob	Smith	bob.smith@company.com

You can modify this code according to your needs and preferences. For example, you can add more rows or columns, change the data values, or use different CSS classes to customize the look and feel of your table. You can also use Jelly tags or scripts to dynamically generate or manipulate the table content based on data from ServiceNow tables or variables.

Hope this help.

Kind Regards,

Swarnadeep Nandy

View solution in original post

SwarnadeepNandy · ‎08-28-2023

Hello @Ketan Pandey,

Why would you use "evaluate" tag.

If it's an HTML page simply put the page details in the HTML section of the UI page.

If you are really planning to use Jelly, then use jelly tags, that too where it is needed.

Kind Regards,

Swarnadeep Nandy

Ketan Pandey · ‎08-28-2023

I need to build the grid table that why i am using the tag <g2:evaluate>, I want to debug the code inside the tag <g2:evaluate>

SwarnadeepNandy · ‎08-28-2023

Hello @Ketan Pandey,

You donot need <g2:evaluate> to build grid table using UI page.

The <g:evaluate> tag is used to evaluate an expression written in Rhino JavaScript and sometimes to set a variable to the value of the expression.

To build a grid table in a UI page, you need to use HTML tags to define the table structure and content, and optionally use CSS classes to style the table appearance. You can also use Bootstrap, a popular framework for responsive web design, to make your table more a...

Here is an example of how you can create a simple grid table in a UI page using HTML and Bootstrap:

<!-- Include Bootstrap CDN link in the head section -->
<head>
  <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
</head>

<!-- Use the table tag to create the table element -->
<table class="table table-bordered">
  <!-- Use the thead tag to create the table header -->
  <thead>
    <!-- Use the tr tag to create a table row -->
    <tr>
      <!-- Use the th tag to create a table header cell -->
      <th>First Name</th>
      <th>Last Name</th>
      <th>Email</th>
    </tr>
  </thead>
  <!-- Use the tbody tag to create the table body -->
  <tbody>
    <!-- Use the tr tag to create another table row -->
    <tr>
      <!-- Use the td tag to create a table data cell -->
      <td>John</td>
      <td>Doe</td>
      <td>john.doe@company.com</td>
    </tr>
    <!-- Repeat the same for other rows -->
    <tr>
      <td>Jane</td>
      <td>Doe</td>
      <td>jane.doe@company.com</td>
    </tr>
    <tr>
      <td>Bob</td>
      <td>Smith</td>
      <td>bob.smith@company.com</td>
    </tr>
  </tbody>
</table>

<!-- Include Bootstrap CDN script at the end of the body section -->
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script>

This code will produce a grid table like this:

First Name Last Name Email

John	Doe	john.doe@company.com
Jane	Doe	jane.doe@company.com
Bob	Smith	bob.smith@company.com

You can modify this code according to your needs and preferences. For example, you can add more rows or columns, change the data values, or use different CSS classes to customize the look and feel of your table. You can also use Jelly tags or scripts to dynamically generate or manipulate the table content based on data from ServiceNow tables or variables.

Hope this help.

Kind Regards,

Swarnadeep Nandy

Ketan Pandey · ‎08-29-2023

How to retrieve the value from any servicenow table