function readOnly(count){ }
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
+ Start a Discussion
Dennis PykaDennis Pyka 

VF: Is it possible to show only selected rows in a datatable?

Hello Everyone,

I have a datatable based on the OpportunityLineItems Object that shows every Product in the Opportunity Record.
Now I want only the products to be shown that are selected by a checkbox.
Is there a possibility to render only specific rows in pure Visualforce? Something like <apex:DataTable renderrow="{!Oli.Checkbox == True}?

I only have a Professional licence, so Apex Code isnt available.
Is there a possibility to only do this in VF on clientside? Maybe JavaScript could also work..

Here is my Code:
<apex:variable var="index" value="{!1}"/>
                        <apex:dataTable width="100%" value="  !Opportunity.OpportunityLineItems}" var="oli"
                            <apex:column width="10%" headerClass="tableheaderleft"  styleClass="tablebodycenter">
                                <apex:outputLabel value="{!index}."/>
                                <apex:variable var="index" value="{!index+1}"/>
                                <apex:facet name="header"></apex:facet>
                             </apex:column>
                            <apex:column width="40%" headerClass="tableheaderleft"  styleClass="tablebodyleft">
                                <apex:facet name="header">Bezeichnung</apex:facet>
                                <apex:OutputField value="{!oli.Name}"/> <br/>
                                    <table border="0" width="100%" style="border-collapse: collapse; margin-bottom:10px">
                                        <tr><td width="30%" style="padding: 0px;line-height: 100%;"><strong>Leistungszeitraum:</strong>&nbsp;<br></br><apex:outputText value="{0, date, dd.MM.yyyy}">
                                            <apex:param value="{!oli.ServiceDate}" /> </apex:outputText>&nbsp;-&nbsp;<apex:outputText value="{0, date, dd.MM.yyyy}">
                                            <apex:param value="{!oli.Licensing_Period_Calculated__c}" /> </apex:outputText></td></tr>
                                    </table>
                             </apex:column>
                            <apex:column width="10%" headerClass="tableheadercenter" footerClass="tablefootercenter" styleClass="tablebodycenter">
                                <apex:facet name="header">Anzahl</apex:facet>
                                <apex:OutputField value="{!oli.Quantity}"/>
                                <apex:facet name="footer"></apex:facet>
                            </apex:column>
                            <apex:column width="20%" headerClass="tableheadercenter"  styleClass="tablebodycenter">
                                <apex:facet name="header">Einzelbetrag</apex:facet>
                                <apex:OutputField value="{!oli.UnitPrice}"/>
                                <apex:facet name="footer"></apex:facet>
                            </apex:column>
                            
                            <apex:column rendered="{!Opportunity.TotalDiscount__c != 0}" headerClass="tableheadercenter" footerClass="tablefootercenter" styleClass="tablebodycenter">
                                <apex:facet name="header">Rabatt</apex:facet>
                                <apex:OutputField value="{!oli.Discount}"/>
                                <apex:facet name="footer"></apex:facet>
                            </apex:column>  
                            
                            <apex:column width="20%" headerClass="tableheaderright"  styleClass="tablebodyright">
                                <apex:facet name="header">Gesamtbetrag</apex:facet>
                                <apex:OutputField value="{!oli.TotalPrice}"/>
                                <apex:facet name="footer"></apex:facet>
                            </apex:column>                                                                                            
                        </apex:dataTable>

 
Abhishek BansalAbhishek Bansal
Hi Denis,

There is no such attribute like renderrow on the dataTable but you can use rendered attribute to control the visibility of any component within the data table. A small example is given below:
<apex:dataTable width="100%" value="  !Opportunity.OpportunityLineItems}" var="oli"
<apex:outputPanel rendered="{!oli.checked}">                            
<apex:column width="10%" headerClass="tableheaderleft"  styleClass="tablebodycenter">
</apex:column>
</apex:outputPanel>
</apex:dateTable>

If the oli.checked is true than column elements will appear otherwise not. Let me know if you need any further help or information on this.

Thanks,
Abhishek Bansal.
Dennis PykaDennis Pyka
Hi Abhishek,

many thanks for your fast reply! :)
I tried your solution, but it always throws this error: <apex:column> must be the direct child of either <apex:dataTable> or <apex:pageBlockTable>
This is the code:
<apex:dataTable width="100%" value="{!Opportunity.OpportunityLineItems}" var="oli" rendered="{!Opportunity.Invoice_Number_c__c== '889698'}">
                            <apex:outputPanel rendered="{!oli.To_Be_Billed__c}">
                            <apex:column width="10%" headerClass="tableheaderleft"        styleClass="tablebodycenter">
                                <apex:outputLabel value="{!index}."/>
                                <apex:variable var="index" value="{!index+1}"/>
                                <apex:facet name="header"></apex:facet>
                             </apex:column>
                            </apex:outputPanel>
</apex:dataTable>
And to be as prezise as possible: I dont want the whole column to be hidden. If I have this list:
  • Element 1 (with checkbox checked)
  • Element 2 (with checkbox not checked)
  • Element 3 (with checkbox checked)
Then I want the Datatable to output only 2 rows, one for Element 1 and one for Element 3. So the row for Element 2 should not be rendered.
I think your solution would hide the whole column? Or do I understand something wrong?

Many thanks for your effort!
 
Abhishek BansalAbhishek Bansal
Hi Dennis,

You can add the rendered attribute in each column of the table like this:
<apex:dataTable width="100%" value="{!Opportunity.OpportunityLineItems}" var="oli" rendered="{!Opportunity.Invoice_Number_c__c== '889698'}">
                            <apex:column width="10%" headerClass="tableheaderleft"        styleClass="tablebodycenter" rendered="{!oli.To_Be_Billed__c}">
                                <apex:outputLabel value="{!index}."/>
                                <apex:variable var="index" value="{!index+1}"/>
                                <apex:facet name="header"></apex:facet>
                             </apex:column>
</apex:dataTable>
In this way all the column in a row will be only displayed if this checkbox is true.

I think your solution would hide the whole column? Or do I understand something wrong?
Yes it will hide all the columns in a row which is exactly what you want.

Please add this condition in all the columns and then let me know if it worked for you or not. 

Thanks,
Abhishek Bansal.
Dennis PykaDennis Pyka
Hi Abhishek,

thanks again! :)
There seems to be a misunderstanding about columns and rows :D
I attached a screenshot to clarify that.
In this table I have the rows 1 and 2 and each of them shows a product, corresponding price and quantity in different columns. I do not want to hide the column price for example, instead I want to hide the row with number 2
Dennis PykaDennis Pyka
This is how the table looks:
Abhishek BansalAbhishek Bansal
Hi Dennis,

This is what I am saying, add the rendered condtion on all the columns, in this way the entire row will be hidden when the checkbox is false.
Did you added the rendered condition on all the columns? Please add and try once. Let me know if you still need any further clarification on this.
You can also reach out to me directly on:
Gmail: abhibansal2790@gmail.com
Skype: abhishek.bansal2790

Thanks,
Abhishek Bansal.
Heather_HansonHeather_Hanson
Hello,

I'm using this same solution on a VF page as well.  I have OLI and I only want to show those with a field value of "NQP" so my columns each have rendered = hasNQP (proper format though! haha).  It works SOMETIMES but not always.  I often get PDF generation failed. Check the page markup is valid. The thing is there is always NQP so there is always something to be populated.  As soon as I remove that datatable my form generates in PDF as expected with no problems.  

I'm wondering if Dennis has run into this issue and found a solution or if either of you can suggest what I'm missing.  Here is my datatable causing the problem:
<apex:dataTable value="{!Opportunity.opportunityLineItems}" var="OP" style="width:98.7%; border:1.5px solid #d9d9d9; border-bottom: 0px !important;" >
                            <apex:column rendered="{!OP.Lease_Service_Group__c = 'NQP'}" headerValue="{!lblQty}" headerClass="column_ttl tac" styleClass="tbl_bdr tac" style="width:5%;"><apex:outputText value="{0, number,###,###,##0}"><apex:param value="{!OP.Quantity}" /></apex:outputText></apex:column>
                            <apex:column headerValue="Description" value="{!OP.PriceBookEntry.Name}" headerClass="column_ttl" styleClass="tbl_bdr tal" rendered="{!OP.Lease_Service_Group__c = 'NQP' && Opportunity.Language__c = 'ENGLISH'}"></apex:column>
                            <apex:column headerValue="Description" value="{!OP.Product2.Product_name_french__c}" headerClass="column_ttl" styleClass="tbl_bdr tal" rendered="{!OP.Lease_Service_Group__c = 'NQP' && Opportunity.Language__c = 'FRENCH'}"></apex:column>
                            <apex:column rendered="{!OP.Lease_Service_Group__c = 'NQP' && NOT(CONTAINS(strServiceType, 'PREPAID'))}" headerValue="{!lblSubTot}" value="{!OP.TotalPrice}" headerClass="column_ttl tac" styleClass="tbl_bdr tar" style="width:15%;"></apex:column>
                            <apex:column rendered="{!OP.Lease_Service_Group__c = 'NQP' && strServiceType = 'Cisco UC-One PBX - PREPAID 36'}" headerValue="{!lblSubTot}" value="{!OP.Prepaid_NEW_36_Month_Subtotal__c}" headerClass="column_ttl tac" styleClass="tbl_bdr tar" style="width:15%;"></apex:column>
                            <apex:column rendered="{!OP.Lease_Service_Group__c = 'NQP' && strServiceType = 'Cisco UC-One PBX - PREPAID 60'}" headerValue="{!lblSubTot}" value="{!OP.Prepaid_NEW_60_Month_Subtotal__c}" headerClass="column_ttl tac" styleClass="tbl_bdr tar" style="width:15%;"></apex:column>
                        </apex:dataTable>