Ignite UI Grid Sorting State

HTML

<script src="http://cdn-na.infragistics.com/jquery/20122/latest/js/infragistics.loader.js"></script>
<h1 class='logo'>Grid Unbound Columns</h1>
<p> Buttons and log box for column values below.</p>
<hr>
<table id='grid'></table>



<a title="Donwload your Ignite UI Free Trial now!" href="http://www.infragistics.com/products/jquery/downloads" target="_blank"><img alt="Donwload your Ignite UI Free Trial now!" src="http://media.infragistics.com/community/Release/12.2/jQuery/IgniteUI-download.jpg"></a>

CSS

.red
    {
        color: Red;
    }

/* --- Unrelated sample styling --- */

.logo
{
    background-image: url('http://www.infragistics.com/uploadedImages/Content/PRODUCTS/jQuery/ignite-secondary-navigation-logo.png');
    background-repeat: no-repeat;
    padding-left: 135px;
    margin: 5px;
    vertical-align: top;
    font-size: 1.2em;
}
body { font-size: 0.85em; font-family : "Segoe UI"}
button 
{
    text-decoration: none;
    line-height: 1.5em;
    background-color: #ACACAC;
    color: #fff;
    border: none;
}

button:hover
{
     background-color: #007FAF;
}
button:active
{
     background-color: #00AEEF;
}

JavaScript

//Note - arrays used for data are below
$.ig.loader({
    scriptPath: "http://cdn-na.infragistics.com/jquery/20122/latest/js",
    cssPath: "http://cdn-na.infragistics.com/jquery/20122/latest/css",
    resources: "igGrid.Paging.Sorting.Filtering.GroupBy",
    theme: 'metro'
});

$.ig.loader(function() {

    /*  ------ GRID --------*/
    $('#grid').igGrid({
        autoGenerateColumns: false,
        autoGenerateLayouts: false,
        primaryKey: "EmployeeID",
        columns: [
                    { headerText: "Employee ID", key: "EmployeeID", dataType: "number" },
                    { headerText: "First Name", key: "FirstName", dataType: "string" },
                    { headerText: "Last Name", key: "LastName", dataType: "string" },
                    { headerText: "Birth Date", key: "BirthDate", dataType: "date" },
                    { headerText: "City", key: "City", dataType: "string" },
                    { headerText: "Postal Code", key: "PostalCode", dataType: "number" }
                ],
        features: [{
            pageSize: 10,
            name: 'Paging',
            type: 'local'},
        {
            name: 'Sorting',
            type: 'local'},
     {
                   
                
                   
       },
        {
            name: 'Filtering',
            type: 'local'},
        {
            name: 'GroupBy',
            type: 'local'}
                                ],
        height: '600px',
        dataSource: employees,
        rendered: function(evt, ui) {
           
        }
    });
});


var employees =...