I'm working on creating PDF Purchase order page in VisaulForce. I get stuck when rendering Purchase order line items, which are related items to Purchase order. All worked great until I put a condition in tr, apex:outputPanel to not render related items with status Cancelled. After that change, the rows of table are not rendered properly, without table formating and borders, just as plain text. How can I fix it?
<apex:variable var="lineNumber" value="{!1}" />
<table class="lineItems">
<tr>
<th>
Line Nr.
</th>
<th>
Item
</th>
<th>
Description
</th>
<th>
Total Cost
</th>
</tr>
<apex:repeat value="{!purchaseOrder.SCMC__PurchaseOrderLineItems__r}" var="line" rendered="true">
<apex:outputPanel rendered="{!line.SCMC__Status__c != 'Cancelled'}">
<tr>
<td>
<apex:outputText rendered="true">
{!lineNumber}
</apex:outputText>
<apex:variable var="lineNumber" value="{!lineNumber+1}" />
</td>
<td>
<apex:outputText rendered="true">
{!line.SCMC__Item_Master__r.Name}
</apex:outputText>
</td>
<td>
<apex:outputText rendered="true">
{!line.SCMC__Description__c}
</apex:outputText>
</td>
<td>
<apex:outputText value="{0, number, ### ##0.00}">
<apex:param value="{!line.SCMC__Total_Cost__c}" />
</apex:outputText>
<apex:outputText rendered="true">
{!purchaseOrder.SCMC__Currency_Master__r.Name}
</apex:outputText>
</td>
</tr>
</apex:outputPanel>
</apex:repeat>
</table>