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
Shri BEShri BE 

I need to group a header in visualforce page

Hello All,
I am working on VF Page and I got stuck in one part of the requirement where I need to display the value of based on grouping header.
But it is not not displaying as group and it is showing as individual header and values are repeating.
Apex Class:
public with sharing class previewController {
    public List<Survey__c> surveyList {get; set;}
    public List<SurveyQuestion__c> quesList {get; set;}
    public List<Sections__c> sectionsList {get;set;}
    public Id suvrecordId {get; set;}
    public String[] sections {get; set;}
    ApexPages.StandardController sc;
    public PEPESurveyPreview(ApexPages.StandardController sc) { = sc; 
        suvrecordId = ApexPages.currentPage().getParameters().get('suvrecordId');
        System.debug('--- SurveyId: ---' + suvrecordId);
        surveyList = [SELECT Id, Name, SurveyName__c, Description__c FROM Survey__c WHERE Id =:suvrecordId];
        System.debug('--- Suv: ---' + surveyList);
        quesList = [SELECT Id, SurveyQuestion__c, Ratings__c, Comments__c, Required__c, 
                    	   Survey__c, SectionName__c
                      FROM SurveyQuestion__c
                      WHERE Survey__c =:suvrecordId
                      ORDER BY SectionName__c asc];
        System.debug('--- Ques: ---' + quesList);

        sectionsList = [SELECT SectionName__c, Survey__c, Name
                         FROM Sections__c
                      	 WHERE Id =:suvrecordId];
        Set<String> sectionSet = new Set<String>();
        for(SurveyQuestion__c sq : quesList) {
        sections = new String[sectionSet.size()];
        Integer i = 0;
        for(String section : sectionSet) {
            sections[i] = section;
VF Page:
<apex:page standardController="Survey__c" extensions="Preview" >
    <apex:form >
        <div class="center" />
        <h1 class="center"> Preview </h1>

        <div class="box">                    
           <!-- Survey Questions -->
            <div style="margin-left:75px; margin-right:75px">                
                <table class="table1" width="100%" cellspacing="0" >
                    <apex:repeat value="{!sections}" var="section">
                        <apex:repeat value="{!quesList}" var="suq">
                                <th> {!section} </th>                                
            </div> <br/>
            <!-- Submit Button with NO ACTION -->
            <div style=" height: 40px; text-align: center; margin-top:10px">
                <apex:commandlink style="text-decoration:none;padding:12px;font-size: 25px; margin-left: -20px; background-color: #00bceb;border-radius: 20px;" value=" Submit "/>
            </div> <br/>
Preview Header

I want display the above image like
Test 123
Testing *
Testing 67890

It would be helpful if you added more detail. Can you actually share with us the data structure you are looping through? Are these SObject records? Some other form of data? How would they be grouped by Account? What is their relationship to it?
indigocard (
Shri BEShri BE
Survey - Custom Object
SurveyQuestion - Custom Object
Sections - Custom Object
Survey and SurveyQuestion has Masterdetail.
SurveyQuestion and Sections is lookup.

I need to group SurveyQuestions based on Sections.
Ex: In the above Image, Test 123 should be displayed only once and under Test 123 all questions should be displayed.

Did you got the requirement I am trying to achieve?