1

Thanks for your time. i want to display data table records vertically in visual force page,here is my below code. how to achieve this

 <div id="CountrySelection" >
                    <apex:variable var="count" value="{!1}"   />
                     <legend>Country Selection for National Filing Records Creation</legend>
                    <table cellspacing="0" cellpadding="0" class="slds-table slds-table--bordered slds-no-row-hover">

                        <tr>
                            <apex:repeat value="{!lstAllCountries}" var="f"> 
                                <td class="slds-text-heading--label" style="vertical-align: middle;"> <input type="checkbox" id="chk_national_{!count}" value="{!f.Id}" title= "{!f.Name}" style="margin-right: 3px;vertical-align: middle;"/>{!f.Country_code__c}</td>
                                <apex:outputText rendered="{!AND((MOD(count, 8) == 0), (count < lstAllCountries.size))}" value="</tr><tr>" escape="false"/>
                                <apex:variable var="count" value="{!count+1}"/>
                            </apex:repeat>                                        
                        </tr>                                
                    </table>
                </div>

This is displaying like this, enter image description here

i want this to be in vertical orderwise, is it possible?

Improve this question
1
  • You would need to use a wrapper class and structure the data accordingly. It would be much easier in controlling the columns and height instead of trying to display a flat data in desired format. Also your table is not schematically correct because you have some data outside a td.
    – Raul
    Oct 10, 2017 at 12:01

1 Answer 1

Reset to default
1

Change the code to this.

<div id="CountrySelection" >
                    <apex:variable var="count" value="{!1}"   />
                    <legend>Country Selection for National Filing Records Creation</legend>
                    <table cellspacing="0" cellpadding="0" class="slds-table slds-table--bordered slds-no-row-hover">
                    <apex:repeat value="{!lstAllCountries}" var="f"> 
                        <tr>
                        <td class="slds-text-heading--label" style="vertical-align: middle;"> <input type="checkbox" id="chk_national_{!count}" value="{!f.Id}" title= "{!f.Name}" style="margin-right: 3px;vertical-align: middle;"/>{!f.Country_code__c}</td>
                                <apex:outputText rendered="{!AND((MOD(count, 8) == 0), (count < lstAllCountries.size))}" value="</tr><tr>" escape="false"/>
                                <apex:variable var="count" value="{!count+1}"/>                                         
                        </tr> 
                    </apex:repeat>                                
                    </table>
                    </div>

You need to apply the apex:repeat tag before creating a new row (tr tag). See if this helps

Improve this answer
1
  • it displaying vertically fine,but it coming in single col . i need atlest 4 col.
    – Elango
    Oct 10, 2017 at 11:13

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .