Friday, November 23, 2012

How to show table having alphabetical ordered section

Keyword: ios6, table view, delegate,datasource, rotation, category,should Autoraotate, interface orientation, dictionary, section, cell, reuse identifier, iphone,sample project 

Get contacts of all your emergency needs on single tap. Download Quick-Finder for iPhone

How to show table having alphabetical ordered section

1) Create a new project name TableSample.

2) Open ViewController.xib and paste a tableView on it . Make the IBOutlet of it as 

     @property (retain, nonatomic) IBOutlet UITableView *tbl;

and also synthesize it.

3) Now Attach datasource and delegate of tableView with File owner.

4) Now open ViewController.h as (Modified code is in different color) 

#import <UIKit/UIKit.h>

@interface ViewController : UIViewController<UITableViewDataSource,UITableViewDelegate>

@property (retain, nonatomic) IBOutlet UITableView *tbl;
@property (nonatomic,retain) NSMutableDictionary *tblDictionary;
@property (nonatomic,retain)NSMutableArray *keyArray;
@property (nonatomic,retain)NSMutableArray *tableArray;
@property (nonatomic,retain)NSMutableArray *filteredArray;

5) Now open ViewController.m

  implement the following method

  i) - (UIView *)tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section

   // This method is used to create headers of section

 ii)   -(NSInteger)numberOfSectionsInTableView:(UITableView *)tableView

// This method is used to define number of sections

iii)- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section

// This method is used for number of rows in each section

we are using a custom method that fill the values of array in dictionary.

6) Now Modified The code of ViewController.m as

#import "ViewController.h"

@interface ViewController ()


@implementation ViewController
@synthesize tableArray;
@synthesize filteredArray;
@synthesize tblDictionary;
@synthesize keyArray;

- (UIView *)tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section
    UIView *header=[[UIView alloc]initWithFrame:CGRectMake(0, 0, 320, 20)];
    [header setBackgroundColor:[UIColor blackColor]];
    UILabel *lbl=[[UILabel alloc]initWithFrame:CGRectMake(20, 0, 320, 20)];
    [header addSubview:lbl];
    [lbl setTextColor:[UIColor whiteColor]];
    [lbl setBackgroundColor:[UIColor clearColor]];
    [lbl setText:[keyArray objectAtIndex:section]];
    return header;


-(NSInteger)numberOfSectionsInTableView:(UITableView *)tableView
    return  [keyArray count];

- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section

    NSArray *ary=[self.tblDictionary valueForKey:[keyArray objectAtIndex:section]];
    return [ary count];


- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
    UITableViewCell *cell=[[UITableViewCell alloc]initWithStyle:UITableViewCellStyleDefault reuseIdentifier:@"Cell"];
    NSString *key=[keyArray objectAtIndex:[indexPath section]];
    NSArray *array=(NSArray *)[self.tblDictionary valueForKey:key];
    NSString *cellTitle=[array objectAtIndex:[indexPath row]];
    [cell.textLabel setText:cellTitle];
    return cell;

-(NSMutableDictionary *)fillingDictionary:(NSMutableArray *)ary

// This method has the real magic of this sample

    keyArray=[[NSMutableArray alloc]init];
    [keyArray removeAllObjects];
    NSMutableDictionary *dic=[[NSMutableDictionary alloc]init];
    // First sort the array
    [ary sortUsingSelector:@selector(compare:)];
    // Get the first character of your string which will be your key
    for(NSString *str in ary)
        char charval=[str characterAtIndex:0];
        NSString *charStr=[NSString stringWithUTF8String:&charval];
        if(![keyArray containsObject:charStr])
            NSMutableArray *charArray=[[NSMutableArray alloc]init];
            [charArray addObject:str];
            [keyArray addObject:charStr];
            [dic setValue:charArray forKey:charStr];
            NSMutableArray *prevArray=(NSMutableArray *)[dic valueForKey:charStr];
            [prevArray addObject:str];
            [dic setValue:prevArray forKey:charStr];
    return dic;


- (void)viewDidLoad
    [super viewDidLoad];
    NSMutableArray *ary=[[NSMutableArray alloc]init];
    [ary addObject:@"gfwfhlr"];
    [ary addObject:@"irofhqrlo"];
    [ary addObject:@"gfwtgfhlr"];
    [ary addObject:@"gegirofgewghqrlo"];
    [ary addObject:@"dsfgverg"];
    [ary addObject:@"gergqrlo"];
    [ary addObject:@"gregerg"];
    [ary addObject:@"gegqrlo"];
    [ary addObject:@"getwgtgt"];
    [ary addObject:@"uyuqrlo"];
    [ary addObject:@"hmnjmj"];
    [ary addObject:@"mjhmghqrlo"];
    [ary addObject:@"mjmjm"];
    [ary addObject:@"irofhmjmjqrlo"];
    [ary addObject:@"sgfwfhlr"];
    [ary addObject:@"daimrofh;qrlo"];
    [ary addObject:@"fgfwfhlr"];
    [ary addObject:@"girofhqrlo"];
    [ary addObject:@"hgfwfhlr"];
    [ary addObject:@"jirofhqrlo"];
    [ary addObject:@"kgfwfhlr"];
    [ary addObject:@"lirofhqrlo"];
    self.tblDictionary =[self fillingDictionary:ary];
    [self.tbl reloadData];
  // Do any additional setup after loading the view, typically from a nib.

- (void)didReceiveMemoryWarning
    [super didReceiveMemoryWarning];
    // Dispose of any resources that can be recreated.

- (void)dealloc {
    [_tbl release];
    [super dealloc];

You can also download the code from here

or click to link


  1. This Code SAVED MY BUTT!!! Simple, straightforward and simply works!!

  2. Thanks for sharing as it is an excellent post would love to read your future post
    Android App Development & Android Application Development Company

  3. Buy & sell new and used iPhones.
    Wide selection of new and used iPhones for sale.
    More at computers for sale

  4. Interesting blog, helped to clarify many things, definitely this will be a useful article. Good work, excepting these kinds of more useful blogs and articles.
    Mobile app development Company