CODEWITHSUNDEEP
c#asp.net-mvckendo-uikendo-grid
Mark
Mark

Reputation: 4873

Kendo UI Grid- - Default Sort Date Asc

I'm using kendo UI, and am looking to default sort my grid by ascending date, but can't figure out how to modify this. My understanding is that it is part of the data-source section:

@(Html.Kendo().Grid<CustomerAnimalViewModel>()
                .Name(gridId)
                .HtmlAttributes(new { @class = "grid" })
                .Columns(columns =>
                {
                    columns.Bound(c => c.AnimalId).Visible(false);
                    columns.Bound(c => c.RegistrationNumber).ClientTemplate("<a class='active' href=javascript:viewAnimal(\"" + "#: AnimalId #" + "\",\"" + "#=escape(Name) #" + "\")  >#: RegistrationNumber #</a>");
                    columns.Bound(c => c.Type);
                    columns.Bound(c => c.Prefix);
                    columns.Bound(c => c.Name);
                    columns.Bound(c => c.DateOfBirth).ClientTemplate("#= kendo.toString(DateOfBirth == null ? '' : DateOfBirth, '" + Constants.DateFormat + "') #");
                    columns.Bound(c => c.Sex);
                    columns.Bound(c => c.HMC);
                    columns.Bound(c => c.Usability).Visible(false);
                    columns.Bound(c => c.Status);
                    columns.Command(command => { command.Destroy(); }).Title(Resources.Actions);
                })
                .DataSource(dataSource => dataSource
                    .Ajax()

                    .Model(model =>
                    {
                        model.Id(p => p.AnimalId);
                        model.Field(p => p.RegistrationNumber);
                        model.Field(p => p.Type);
                        model.Field(p => p.Prefix);
                        model.Field(p => p.Name);
                        model.Field(p => p.Status);
                        model.Field(p => p.Sex);
                        model.Field(p => p.HMC);
                        model.Field(p => p.Usability);
                        model.Field(p => p.Status);
                    })
                    .Read(read => read.Action("ReadTypes", "Customer").Data("filterData"))
                    .Destroy(destroy => destroy.Action("DeleteAnimal", "Customer"))
                )
                .Navigatable()
                .Sortable()
                .Filterable()
                .Pageable()

           )

Upvotes: 11

Views: 12486

Answers (3)

NinjaCoder
NinjaCoder

Reputation: 51

Single column sort:

@(Html.Kendo().Grid<T>()
    .Name("grid")
    .DataSource(dataSource => dataSource
        .Ajax()
        .Sort(x=>x.Add("DateOfBirth").Ascending())
    ....)

Multi-column sort:

@(Html.Kendo().Grid<T>()
    .Name("grid")
    .Sortable(sortable => sortable.SortMode(GridSortMode.MultipleColumn))
    .DataSource(dataSource => dataSource
        .Ajax()
        .Sort(s =>
                {
                    s.Add(l => l.F_NAME).Descending();
                    s.Add(l => l.L_NAME).Descending();                        
                })
    ....)

Upvotes: 3

Mr.LamYahoo
Mr.LamYahoo

Reputation: 1546

add .Sort(x=>x.Add("DateOfBirth").Ascending()) in dataSource

@(Html.Kendo().Grid<CustomerAnimalViewModel>()
                    .Name(gridId)
                    .HtmlAttributes(new { @class = "grid" })
                    .Columns(columns =>
                    {
                        columns.Bound(c => c.AnimalId).Visible(false);
                        columns.Bound(c => c.RegistrationNumber).ClientTemplate("<a class='active' href=javascript:viewAnimal(\"" + "#: AnimalId #" + "\",\"" + "#=escape(Name) #" + "\")  >#: RegistrationNumber #</a>");
                        columns.Bound(c => c.Type);
                        columns.Bound(c => c.Prefix);
                        columns.Bound(c => c.Name);
                        columns.Bound(c => c.DateOfBirth).ClientTemplate("#= kendo.toString(DateOfBirth == null ? '' : DateOfBirth, '" + Constants.DateFormat + "') #");
                        columns.Bound(c => c.Sex);
                        columns.Bound(c => c.HMC);
                        columns.Bound(c => c.Usability).Visible(false);
                        columns.Bound(c => c.Status);
                        columns.Command(command => { command.Destroy(); }).Title(Resources.Actions);
                    })
                    .DataSource(dataSource => dataSource
                        .Ajax()
                        .Sort(x=>x.Add("DateOfBirth").Ascending())
                        .Model(model =>
                        {
                            model.Id(p => p.AnimalId);
                            model.Field(p => p.RegistrationNumber);
                            model.Field(p => p.Type);
                            model.Field(p => p.Prefix);
                            model.Field(p => p.Name);
                            model.Field(p => p.Status);
                            model.Field(p => p.Sex);
                            model.Field(p => p.HMC);
                            model.Field(p => p.Usability);
                            model.Field(p => p.Status);
                        })
                        .Read(read => read.Action("ReadTypes", "Customer").Data("filterData"))
                        .Destroy(destroy => destroy.Action("DeleteAnimal", "Customer"))
                    )
                    .Navigatable()
                    .Sortable()
                    .Filterable()
                    .Pageable()

               )

Upvotes: 20

MikeV
MikeV

Reputation: 585

Your datasource is what needs to be sorted prior to sending it to the grid.

In your "ReadTypes" action you are probably getting a list of CustomerAnimalViewModel. You can use a linq query to the list with 

.OrderBy(d => d.DateOfBirth)

Upvotes: 1

Related Questions