how to map fields from table to UI page

rajkrish
Tera Contributor

Hi,

        I have created a table with some fields. I need to map those fields into an UI page.   For example consider a table has Column headers XXX YYY ZZZ and has some value for the respective column, now I need to map those fields in a UI page. The UI page also has a table with similar Header names XXX YYY ZZZ, Please help me out how to map those field value from the table to the UI page.

Thanks,

Rajkumar.

1 ACCEPTED SOLUTION

Here you go. I am modified your code (marked in bold) to get the data from the table.



<?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 class="col-md-12" style="padding:0px;">


  <table st-table="rowCollection" class="table table-striped table-intel" style="margin:0px;   width:100%; border-left:1px solid #0071C5; border-right:1px solid #0071C5; border-bottom:1px solid #ccc; border-top:none;">


        <th colspan="4">


  <div class="table-nav" st-pagination=""   st-items-by-page="itemsByPage" st-displayed-pages="3"></div>


  </th>


  <thead>



  <tr style="cursor:pointer;">


  <th><a ng-click="checkAll();" class="btn btn-sm btn-secondary">Check All</a></th>


  <th st-sort="" ><i></i>XXX</th>


  <th st-sort=""><i></i>YYY</th>


          <th st-sort=""><i></i>ZZZ</th>


          </tr>


      </thead>


 


  <tbody>


          <tr     ng-repeat="row in rowCollection">


   


  <g:evaluate var="jvar_not" object="true">


  var not = new GlideRecord('u_font_style'); <!-- provide your table name here -->


  not.query();


  not;


  </g:evaluate>



  <j:while test="${jvar_not.next()}">


  <tr>


    <td>


  <input type="checkbox" ng-click="checkChecked()" id="check_{{$index}}" class="row-item mlaf-checkbox" name="serial_number" value="{{ row.serial_number }}"/>


        <label style="height:16px;line-height:16px;" for="check_{{$index}}"></label>


  </td>



  <td>${jvar_not.getValue('u_name')}</td> <!-- provide proper field name of the table here -->


  <td>${jvar_not.getValue('u_name')}</td> <!-- provide proper field name of the table here -->



  </tr>


  </j:while>


 


  </tr>


        </tbody>



      </table>


  </div>


</j:jelly>




The output what I am getting is:



Capture.JPG



The values are coming from u_font_style (in my case).


View solution in original post

8 REPLIES 8

Kalaiarasan Pus
Giga Sage

Share the script that you have done so far.


table.PNG


This is the table which i have created. Column name and lable are same.



Below is the UI Script which i have done so far.



<?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 class="col-md-12" style="padding:0px;">


  <table st-table="rowCollection" class="table table-striped table-intel" style="margin:0px;   width:100%; border-left:1px solid #0071C5; border-right:1px solid #0071C5; border-bottom:1px solid #ccc; border-top:none;">


        <th colspan="4">


  <div class="table-nav" st-pagination=""   st-items-by-page="itemsByPage" st-displayed-pages="3"></div>


  </th>


  <thead>



  <tr style="cursor:pointer;">


  <th><a ng-click="checkAll();" class="btn btn-sm btn-secondary">Check All</a></th>


  <th st-sort="" ><i></i>XXX</th>


  <th st-sort=""><i></i>YYY</th>


          <th st-sort=""><i></i>ZZZ</th>  


          </tr>


      </thead>


   


  <tbody>


          <tr     ng-repeat="row in rowCollection">


  <td>


  <input type="checkbox" ng-click="checkChecked()" id="check_{{$index}}" class="row-item mlaf-checkbox" name="serial_number" value="{{ row.serial_number }}"/>


        <label style="height:16px;line-height:16px;" for="check_{{$index}}"></label>


  </td>


   


  </tr>


        </tbody>



      </table>


  </div>


</j:jelly>


Could you please provide a screenshot of how the UI page looks like now.


rajkrish
Tera Contributor

d1.PNG


I have changed the header name.