ncolumntable or HTML table

Hi,

which is the best practice in terms of creating a table?

Is it ncolumntable or html table?

 

Thanks and Regards

Rohini

  Discussion posts and replies are publicly visible

  • Hi Rohini,

    Can you be more specific about what your use case is? Are you trying to display a table in the UI using pre-populated data or something else?

    Thanks
  • I will generally use ncolumntable() for a quick implementation when formatting is not necessary and column counts are low (ex. task history in email notifications). However, note this function is restrictive on columns (10) and formatting. For bigger and prettier HTML tables, such as in output documents from template, I will create the HTML manually which allows unlimited columns and formatting. In this example, the CSS classes are built into the HTML template and added via the rules.

    rule!createHtmlTable()

    with(
    local!data: rule!getData_qr(ri!id,a!pagingInfo(1,-1),
    local!columnNames: {"Employee","Supervisor","Division","Location","Company","Department"},

    "<table class='TableStyle'>" &
    "<tr>" & joinarray(apply(rule!tableCell(tdClass: "TableHeader", item: _),local!columnNames),"") & "</tr>" &
    joinarray(apply(rule!tableRow,
    merge(
    {index(local!data.data,"employeeName",{})},
    {index(local!data.data,"supervisorName",{})},
    {index(local!data.data,"division",{})},
    {index(local!data.data,"location",{})},
    {index(local!data.data,"company",{})},
    {index(local!data.data,"department",{})}
    )
    ),"") &
    "</table>"
    )

    rule!tableCell()

    ="<td class='" & ri!tdClass & "'>" & ri!item & "</td>"

    rule!tableRow()

    ="<tr>" &
    joinarray(
    apply(rule!tableCell(tdClass: "TableStyle", item: _),
    {
    ri!col1,ri!col2,ri!col3,ri!col4,ri!col5,ri!col6
    }
    ),""
    ) &
    "</tr>"
  • Hi Andrew,
    I am in a process of understanding different scenarios where HTML table or ncolumntable is preferred,
    1) Is the usage of either of the one is dependent on specific use case ?
    2) can one be used in place of other?

    Thanks
    Rohini
  • 0
    Certified Lead Developer

    Hi Rohini

    As per my understanding, if you are looking to generate a dynamic table in Appian then i would prefer to go for Custom Implementation of HTML Table data generation.

    Considering the following table structure:

    <!DOCTYPE html>
    <html>
    <head>
    </head>
    <body>
    
    <table border="1">
      <tr>
        <th>Month</th>
        <th>Savings</th>
      </tr>
      <tr>
        <td>January</td>
        <td>$100</td>
      </tr>
      <tr>
        <td>February</td>
        <td>$80</td>
      </tr>
      <tr>
        <td>March</td>
        <td>$50</td>
      </tr>
    </table>
    
    </body>
    </html>

    We can create a HTML template which will be as follows: 

    <!DOCTYPE html>
    <html>
    <head>
    </head>
    <body>
    
    <table border="1">
      <tr>
        <th>Month</th>
        <th>Savings</th>
      </tr>
      ###data###
    </table>
    
    </body>
    </html>
    

     

    Now we can generate the data for this table dynamically as follows:

    1. Create an expression rule, let's say YourProject_generateTableContent which will have an input of type CDT, for which we want to generate the Table form data as shown below:

    a!forEach(
      ri!input_cdt,
      concat(
        "<tr>",
        "<td>"&index(fv!item, "month", null())&"</td>",
        "<td>"&dollar(index(fv!item, "amount", null()))&"</td>",
      "</tr>"
      )
    )
    /*
    Considering input_cdt is your Rule input of type CDT or Any Type 
    which has two fields, i.e. month and amount
    */

     

    Now you can make the use of this template wherever you need it. e.g. I want to send an email

    a. Use Send E-Mail Smart Service and choose, use a Text or HTML Template option >> Select your HTML Template >> This will populate data field to replace with a value >> Call your expression rule YourProject_generateTableContent(input_cdt: pv!input_cdt) by passing the input parameter value, setup other properties of this smart service >> Save and Publish and Execute this process.

     

    You can find an email will be triggered where the table data is generated dynamically in Appian(considering the process variable has the value to generate the table cell rows) using it's expression rule.

     

    As per my understanding it's a one time effort but once it's built, can be used for any cdt by defining the input of type AnyType and tweaking this rule a bit and also performance wise this is great as the rule takes very less time to generate the table cell rows/content.

     

    Hope this will help you.

  • Thanks Alok for such a detailed answer.
    It helped in understanding the concept.
  • You will have to write your own custom HTML formatting rules using concat() and strings of HTML code. The table rows can be generated using apply().

    For WordPress this link might help you, https://www.mediumtalk.net/best-table-plugins-wordpress

  • 0
    A Score Level 1
    in reply to aloks0189

    Thanks Alok,
    Your solution above worked in my case.