node.js - How can I generate a table with sections with Jade? -


Thanks in advance for taking the time to help I am using the Jade templates engine in node. Js, and one I want to generate HTML table with rows broken into squares.

Let's say the following thing in my memory:

{type: 'fruit', name: 'apple'}, {type: 'fruit', name: 'orange'}, { Type: 'vegetable', name: 'carrot'}, {type: 'vegetable', name: 'spinch'}]

(For simplicity, assume that the array is " Type "column).

And I want to generate a table for each "type" (fruits vs. vegetables) with rows for each object within a single class. That's why the HTML I am trying to generate:

  & lt; Table & gt; & Lt; Thead & gt; & Lt; Th & gt; & Lt; / Th & gt; & Lt; Th & gt; Name & lt; / Th & gt; & Lt; / Thead & gt; & Lt; Tbody id = "fruit" & gt; & Lt; TR & gt; & Lt; TD & gt; Fruit & lt; / TD & gt; & Lt; TD & gt; Apple & lt; / TD & gt; & Lt; / TR & gt; & Lt; TR & gt; & Lt; TD & gt; Fruit & lt; / TD & gt; & Lt; TD & gt; Orange & lt; / TD & gt; & Lt; / TR & gt; & Lt; / Tbody & gt; & Lt; Tbody id = "vegetable" & gt; & Lt; TR & gt; & Lt; TD & gt; Vegetable & lt; / TD & gt; & Lt; TD & gt; Carrot & lt; / TD & gt; & Lt; / TR & gt; & Lt; TR & gt; & Lt; TD & gt; Vegetable & lt; / TD & gt; & Lt; TD & gt; Parents & lt; / TD & gt; & Lt; / TR & gt; & Lt; / Tbody & gt; & Lt; / Table & gt;  

I think I would like to see my jade something:

  table thead th type name - var lastType; Objs in each o - if (o type! = Last type) TBI (id = '# {OP}}' - final type = o. Type; Tr td # {o.type} td # {o.name}  

But this results from:

   & Lt; Tbody & gt; & Lt; TR & gt; & Lt; TD & gt; Fruit & lt; / TD & gt; & Lt; TD & gt; Apple & lt; / TD & gt; & Lt; / TR & gt; & Lt; TR & gt; & Lt; TD & gt; Fruit & lt; / TD & gt; & Lt; TD & gt; Orange & lt; / TD & gt; & Lt; / TR & gt; & Lt; / Tbody & gt; & Lt; Tbody id = "vegetable" /> & Lt; Tbody & gt; & Lt; TR & gt; & Lt; TD & gt; Vegetable & lt; / TD & gt; & Lt; TD & gt; Carrot & lt; / TD & gt; & Lt; / TR & gt; & Lt; TR & gt; & Lt; TD & gt; Vegetable & lt; / TD & gt; & Lt; TD & gt; Parents & lt; / TD & gt; & Lt; / TR & gt; & Lt; / Tbody & gt; & Lt; / Table & gt;  

Any ideas?

This is in jade seems harder because we are not really See how your indentions really are set in your local code, but here (your post snippet) seems like your indentation is not correct.

You should try to: + Update (Another loop has been added to get all the same type of body inside)

  table thead th type th name - var lastType; Objs in each o - if (o type! = Last type) - final type = o. Type; TDI (id = '# {oprip}') Each T in OJGes (if T. type === final type) TR TD # {T.T.P.} TD # {T.}}  

+ Update

It will now produce this HTML code:

  & lt; Table & gt; & Lt; Thead & gt; & Lt; Th & gt; & Lt; / Th & gt; & Lt; Th & gt; Name & lt; / Th & gt; & Lt; / Thead & gt; & Lt; Tbody id = "fruit" & gt; & Lt; TR & gt; & Lt; Td> Fruit & lt; / Td> & Lt; TD & gt; Apple & lt; / TD & gt; & Lt; / TR & gt; & Lt; TR & gt; & Lt; Td> Fruit & lt; / Td> & Lt; TD & gt; Orange & lt; / TD & gt; & Lt; / TR & gt; & Lt; / Tbody & gt; & Lt; Tbody id = "vegetable" & gt; & Lt; TR & gt; & Lt; Td> Vegetation & lt; / Td> & Lt; TD & gt; The carrot is & lt; / TD & gt; & Lt; / TR & gt; & Lt; TR & gt; & Lt; Td> Vegetation & lt; / Td> & Lt; TD & gt; Parents & lt; / TD & gt; & Lt; / TR & gt; & Lt; / Tbody & gt; & Lt; / Table & gt;  

Comments