web
You’re offline. This is a read only version of the page.
close
Skip to main content

Announcements

News and Announcements icon
Community site session details

Community site session details

Session Id :
Power Platform Community / Forums / Power Apps / How to add number colu...
Power Apps
Answered

How to add number column for items in PowerApps HTML Table

(0) ShareShare
ReportReport
Posted on by 35

Hello Teams.

I have a collection to put on HTML text:

ClearCollect(
 ItemforHTML,
 AddColumns(
 Filter(
 [@EvenList],
 Text(
 TglEvent,
 "dd/mm/yyyy"
 ) in Text(
 varNewDate,
 "dd/mm/yyyy"
 )
 ),"NumberRows",0
 )
);
Set(VarNumber, VarNumber + 1) 
 
 

This is the HTML text:

"<table style='background-color: lightgray; border: 1px solid black;'>
 <tr>
 <th style='background-color: gray; border: 1px solid black; text-align: center;'>Number</th>
 <th style='background-color: gray; border: 1px solid black; text-align: center;'>Title</th>
 <th style='background-color: gray; border: 1px solid black;text-align: center;'>Description</th>
 <th style='background-color: gray; border: 1px solid black;text-align: center;'>Location ($)</th>
 <th style='background-color: gray; border: 1px solid black;text-align: center;'>Tag</th>
 <th style='background-color: gray; border: 1px solid black;text-align: center;'>Picture</th>
 </tr>" &
 
 Concat(
 ForAll(
 ItemforHTML, // Collection Name
 "<tr>
 <td style='border: 1px solid black;text-align: center;'>" & VarNumber &"</td>
 <td style='border: 1px solid black;text-align: center;'>" & JudulEvent &"</td>
 <td style='border: 1px solid black;text-align: center;'>" & KeteranganEvent &"</td>
 <td style='border: 1px solid black;text-align: center;'>" & EventsKM &"</td>
 <td style='border: 1px solid black;text-align: center;'>" & TagEvent &"</td>
 <td style='border: 1px solid black;text-align: center;'><img src='" & LookUp(EVENTS,Substitute('File name with extension',Right('File name with extension',6),"")=IdEvent,'Gambar mini'.Large)
 &"' alt='Image' style='width:300px; height:200px;'/></td>
 </tr>"
 ), Value
 )
 
 & "</table>"
 

I need to have a column that numbers all the items in the table automatically starting from 1 till the end of the table rows (1, 2, 3 and so on). I tried assigning the  VarNumber for Number Header but it returns blank.

The image below showing items in Number column are still blank

HTML Table previewHTML Table preview

 

How do I create that column?
Please help.

Thank you

 

Categories:
I have the same question (0)
  • v-dezhili-msft Profile Picture
    Microsoft Employee on at

    Hi @Bima_2003 ,

     

    Please try:

    "<table style='background-color: lightgray; border: 1px solid black;'>
     <tr>
     <th style='background-color: gray; border: 1px solid black; text-align: center;'>Number</th>
     <th style='background-color: gray; border: 1px solid black; text-align: center;'>Title</th>
     </tr>"&
     Concat(
     ForAll(
     Sequence(CountRows(listB)),
     "<tr>
     <td style='border: 1px solid black;text-align: center;'>" &ThisRecord.Value&"</td>
     <td style='border: 1px solid black;text-align: center;'>" &Index(listB,ThisRecord.Value).Name&"</td>"
     ), Value
     )
     
     & "</table>"

     

    vdezhilimsft_1-1675226778019.png

    vdezhilimsft_0-1675226755121.png

     

    Best Regards,

    Dezhi

  • Bima_2003 Profile Picture
    35 on at

    Hi @v-dezhili-msft 

     

    I tried your suggestion but still got error or I didn't write the code properly Screenshot 2023-02-01 143146.jpg

     

     

    Any idea how to create another collection with a dedicated column for row number?

    Thanks for your reply

  • v-dezhili-msft Profile Picture
    Microsoft Employee on at

    Hi @Bima_2003 ,

     

    You don't need to use two ForAll(), you can use index() to get the data.

    Concat(
     ForAll(
     Sequence(CountRows(ItemforHTML)), // Collection Name
     "<tr>
     <td style='border: 1px solid black;text-align: center;'>" & ThisRecord.Value &"</td>
     <td style='border: 1px solid black;text-align: center;'>" & Index(ItemforHTML,ThisRecord.Value).JudulEvent &"</td>
     <td style='border: 1px solid black;text-align: center;'>" & Index(ItemforHTML,ThisRecord.Value).KeteranganEvent &"</td>
     <td style='border: 1px solid black;text-align: center;'>" & Index(ItemforHTML,ThisRecord.Value).EventsKM &"</td>
     <td style='border: 1px solid black;text-align: center;'>" & Index(ItemforHTML,ThisRecord.Value).TagEvent &"</td>
     <td style='border: 1px solid black;text-align: center;'><img src='" & LookUp(EVENTS,Substitute('File name with extension',Right('File name with extension',6),"")=IdEvent,'Gambar mini'.Large)
     &"' alt='Image' style='width:300px; height:200px;'/></td>
     </tr>"
     ), Value
     )
     
     & "</table>"

     

    Best Regards,

    Dezhi

  • Bima_2003 Profile Picture
    35 on at

    Sorry my bad.

    Anyway I still got error:Screenshot 2023-02-01 151424.jpg

     

     It says:  Name isn't valid, 'Value' isn't recognized
    Thanks.

     

    Best Regards
    Bima

     

     

  • Verified answer
    v-dezhili-msft Profile Picture
    Microsoft Employee on at

    Hi @Bima_2003 ,

     

    In LookUp() you can try to use only Value without ThisRecord.

    vdezhilimsft_0-1675241249783.png

     

    Best Regards,

    Dezhi

  • Bima_2003 Profile Picture
    35 on at

    Okay, now that works perfectly.

    No error.No error.

     

    Thank you so much @v-dezhili-msft 
    Have a great day

Under review

Thank you for your reply! To ensure a great experience for everyone, your content is awaiting approval by our Community Managers. Please check back later.

Helpful resources

Quick Links

Season of Sharing Community Challenge Launch!

Jump in, show your community spirit, and win prizes!

Kudos to our 2025 Community Spotlight Honorees

Expanding mentorship, skilling, and AI innovation

Congratulations to the May Top 10 Community Leaders!

These are the community rock stars!

Leaderboard > Power Apps

#1
Valantis Profile Picture

Valantis 491

#2
WarrenBelz Profile Picture

WarrenBelz 407 Most Valuable Professional

#3
11manish Profile Picture

11manish 331

Last 30 days Overall leaderboard