Add row dynamically

Question

I have 20 records..it was iterating in for each loop...when after showing 10 records on table i have to add one row and then follow remaining records..How can i do??I used Apex and Vf.. Actually i have a for loop in my controller..like below

results= [ SELECT Max(Practitioner__r.Territory__r.Target_Practitioners__c) maxtargetpractioner, 
                  Sum(Practitioner__r.Unique_Practitioner__c) sumunique,
                  Owner.Name callowner, Count(Id) counterval 
           FROM Call__c 
           Where (Call_Date__c>=:fromdate and Call_Date__c<=:todate)  
           GROUP by Owner.name ];

totalGPmapObj= new Map<String,List<String>>();

for (AggregateResult ar1: results) {

       detailedrows=new List<String>{};

       coverage=((Decimal) ar1.get('sumunique'))/((Decimal)ar1.get('maxtargetpractioner'));

       detailedrows.add(String.valueOf(ar1.get('counterval')));
       detailedrows.add(String.valueOf((coverage*100).setScale(2)));
       detailedrows.add(String.valueOf(ar1.get('maxtargetpractioner')));
       detailedrows.add(String.valueOf(coverage.setScale(2))); 
       detailedrows.add(String.valueOf(ar1.get('sumunique')));

     totalGPmapObj.put((String) ar1.get('callowner'),detailedrows);
}

and in my vf page i given to show table rows

<apex:repeat value="{!totalGPmapObj}" var="key">       
     <tr><td bgcolor="#87CEFA">{!key}</td>
         <td bgcolor="#87CEFA">{!totalGPmapObj[key][0]}</td>
         <td bgcolor="#87CEFA">{!totalGPmapObj[key][1]}%</td>
         <td bgcolor="#87CEFA">{!totalGPmapObj[key][2]}</td>
         <td bgcolor="#87CEFA">{!totalGPmapObj[key][3]}</td>
         <td bgcolor="#87CEFA">{!totalGPmapObj[key][4]}</td>            
     </tr>       
</apex:repeat>

Here it is iterating complete list(20 records) but i need after 10th record i have to add one row dynamically like

<tr><td colspan="6"> Region 2</td></tr>

and then follow to show remaining records in the table...

Answer 1

Have you tried something like the following?

<apex:variable value="{!0}" var="counter"/>

<apex:repeat value="{!totalGPmapObj}" var="key">
    <apex:variable var="counter" value="{!counter + 1}"/>
    <apex:outputText rendered="{!counter == 10}">
        <tr><td colspan="6"> Region 2</td></tr>
    </apex:outputText>
    <apex:outputText rendered="{!counter != 10}">
        <tr>
            <td bgcolor="#87CEFA">{!key}</td>
            <td bgcolor="#87CEFA">{!totalGPmapObj[key][0]}</td>
            <td bgcolor="#87CEFA">{!totalGPmapObj[key][1]}%</td>
            <td bgcolor="#87CEFA">{!totalGPmapObj[key][2]}</td>
            <td bgcolor="#87CEFA">{!totalGPmapObj[key][3]}</td>
            <td bgcolor="#87CEFA">{!totalGPmapObj[key][4]}</td>
        </tr>
    </apex:outputText>
</apex:repeat>

Basically you're creating a variable and setting it to 0 initially and for each row you increment it's value. When it reaches value of 10 you render specific output, all other times a different output.