How should I use ejs to render table vertically?

Question

I have an array like the following:

quotation: [{
              "dimension" : 0,
              "currency": "RMB",
              "quantity": "100",
              "price": "3",
              "factory": "rx"},
            {
              "dimension" : 0,
              "currency": "RMB",
              "quantity": "200",
              "price": "4",
              "factory": "rx"},
           {
              "dimension" : 1,
              "currency": "RMB",
              "quantity": "100",
              "price": "3",
              "factory": "rx"},
           {
              "dimension" : 1,
              "currency": "RMB",
              "quantity": "200",
              "price": "5",
              "factory": "rx"},
            {
              "dimension" : 0,
              "currency": "RMB",
              "quantity": "100",
              "price": "1.2",
              "factory": "hsf"},
            {
              "dimension" : 0,
              "currency": "RMB",
              "quantity": "200",
              "price": "2.4",
              "factory": "hsf"},
           {
              "dimension" : 1,
              "currency": "RMB",
              "quantity": "100",
              "price": "3",
              "factory": "hsf"},
           {
              "dimension" : 1,
              "currency": "RMB",
              "quantity": "200",
              "price": "4.5",
              "factory": "hsf"}]

How should I use ejs to turn into the following table?

<table>
   <tr>
      <th>Dimension</th><th>Quantity</th><th>Factory: rx</th><th>Factory: hsf</th>
   </tr>
   <tr>
      <td>0</td><td>100</td><td>3</td><td>1.2</td>
   </tr>
   <tr>
      <td>0</td><td>200</td><td>4</td><td>2.4</td>
   </tr>
   <tr>
      <td>1</td><td>100</td><td>3</td><td>3</td>
   </tr>
   <tr>
      <td>1</td><td>200</td><td>5</td><td>4.5</td>
   </tr>
</table>

I have to make sure that the price is from the correct factory. I think this problem is easy if html allows me to define table column by column. But html table only allows me to do it row-wise.

Thank you very much for any help.

score 15 · Answer 1 · answered Nov 05 '14 at 13:55

<table>
   <tr>
      <th>Dimension</th><th>Quantity</th><th>Factory: rx</th>
   </tr>

   <% for (var i = 0; i < quotation.length; /* I save the data in a variable 'quotation', I don't know how you named your variable  */  i++) { %>
    <tr>
      <td><%= quotation[i].dimension %></td>
      <td><%= quotation[i].quantity %></td>
      <td><%= quotation[i].factory %></td>
    </tr>    
   <% } %>
</table>

score -1 · Answer 2 · answered Mar 23 '18 at 08:13

// Making a div tag and fetching its value to make table

<div id="tableDiv" style="margin-top: 40px">

//Create table and fetch data from JSON Object.

var table_body = '<table border="1" id="example"><thead><tr><th> Dimension </th><th> Quantity </th><th>Factory</th></tr></thead><tbody>';

                for(var i =0; i<quotation.length;i++){
                    table_body+='<tr>';

                    table_body +='<td>';
                    table_body +=`quotation[i].dimension`;
                    table_body +='</td>';

                    table_body +='<td>';
                    table_body +=quotation[i].Quantity;
                    table_body +='</td>';

                    table_body +='<td>';
                    table_body +=quotation[i].Quantity;
                    table_body +='</td>';                

                    table_body+='</tr>';

                }

                table_body+='</tbody></table>';
               $('#tableDiv').html(table_body);//display data of the table

How should I use ejs to render table vertically?

2 Answers2