Beginner [Exercise 6: Iterations] (Training slides exercise)

Create a table with 4 columns (it doesn’t matter which layout you use). Within that table create a fori loop to input the below data related to the company’s investments. The category field should have 3 options: computers, vehicles and phones. (tip: the fori loop should go after the header and layout definition of the table)
Bonus question: input some data in the table you have just created and below the table, print the name and value of the items with the category “computers”
The final output should look like this:

|653px;x221px;

Solution:

{% stripnewlines %}
| Name
| Asset category
| Disposed?
| Value (£)
{% newline %}
|--------
|--------
|--------
|--------#+
{% newline %}
{% fori item in custom.investments %}
|{% input item.name %}
|{% input item.category as:select options:'computers|vehicles|phones' %}
|{% input item.disposed as:boolean %}
|{% input item.value as:currency %}
{% newline %}
{% endfori %}
{% endstripnewlines %}

{% for item in custom.investments %}
  {% if item.category == 'computers' %}
    {{ item.name }} = {{ item.value | currency }} 
  {% endif %}
{% endfor %}

Solution using HTML Tables:

<table class="usr-width-100 usr-bordered">
  <thead>
    <tr>
      <th class="">Name</th>
      <th class="">Asset category</th>
      <th class="">Disposed?</th>
      <th class="">Value (£)</th>
    </tr>
  </thead>
  <tbody>
    {% fori item in custom.investments %}
      <tr>
        <td class="">{% input item.name %}</td>
        <td class="">{% input item.category as:select options:'computers|vehicles|phones' %}</td>
        <td class="">{% input item.disposed as:boolean %}</td>
        <td class="">{% input item.value as:currency %}</td>
      </tr>
    {% endfori %}
  </tbody>
</table>

{% for item in custom.investments %}
  {% if item.category == 'computers' %}
    {{ item.name }} = {{ item.value | currency }} 
  {% endif %}
{% endfor %}