[Solved] Sort with Multiple Columns using Custom Binding

[John]

Hi,
 I am currently experiencing an issue with sorting a grid using AJAX Custom Binding. When I receive the GridCommand in the controller it only contains the latest SortDescriptor for the grid, and not any of the other currently active ones. I have set sorting mode to be GridSortMode.MultipleColumn but this did not seem to make a difference. Do I need to change anything else to get it to tell me of all currently active sorts? Can you only sort by one column at a time when using CustomBinding?

Thanks,

-John

[Dadv]

show us some sample code please

[John]

Here is the View Portion

@(Html.Telerik().Grid(Model.Grid.GridRowViewModels)

    .Name("activity-grid")

        //.DataKeys(keys => keys.Add(a => a["_ActivityID"]))

    .DataBinding(dataBinding => dataBinding.Ajax()

        .Select("SelectActivities", "Activity"))

 

... Columns and Templates removed...

.Sortable(sorting => sorting.SortMode(GridSortMode.MultipleColumn))

    .EnableCustomBinding(true)

    .Pageable(paging => paging.Total(Model.Count).PageSize(Constants.DefaultGridPageSize))

    .Filterable()

    .ClientEvents(e => e

        .OnLoad("onActivityDataGridLoad")

        .OnDataBound("onActivityDataGridBound")

    )

 
Here is the Controller Portion. Within that GridCommand will only be the latest SortDescriptor. Maybe this is a
 bug or or even just how it is supposed to work, but how does one sort on multiple columns if so.

[GridAction(EnableCustomBinding = true)]

        public ActionResult SelectActivities(GridCommand command)

        {

.... Rest of Function ...

                }

[Dadv]

you remove or not write what i need to see ^^

Columns have a specific Sort option, do you use it?

.OnLoad("onActivityDataGridLoad")

        .OnDataBound("onActivityDataGridBound")

Could interfere with the sort command, could we see the scripts?

like often, you use server and ajax binding in the same time :

.Grid(Model.Grid.GridRowViewModels) => server binding
.DataBinding(dataBinding => dataBinding.Ajax().Select("SelectActivities", "Activity")) => Ajax binding

this can give some behavior too

could you provide more information? or a sample?

[John]

@(Html.Telerik().Grid(Model.Grid.GridRowViewModels)

    .Name("activity-grid")

        //.DataKeys(keys => keys.Add(a => a["_ActivityID"]))

    .DataBinding(dataBinding => dataBinding.Ajax()

        .Select("SelectActivities", "Activity"))

    .Columns(columns =>

    {

        Action<int, string, Type, ColumnDefinition> addColumn = (i, title, type, colDef) =>

        {

            ColumnCategory category = colDef.ColumnCategory;

            bool isSfdc = colDef.IsSfdc;

             

            // Telerik seems to be doing weird stuff with the indexer used with the foreach.  Having this inside this Action is required.

            columns.Bound(column => column.GridRowCellViewModels[i].Data)

                .Title(title)

                .HeaderHtmlAttributes(new { @data_columnname = title, @class = (isSfdc ? "Sfdc" : category.ToString()) + " columnheader" })

                .ApplyHtmlAttributesIf(isSfdc, new { @class = "sfdcEntity"})

                .ApplyFormatAndStyle(type, "padding-left:10px;")

                .FormatUTCIfDateType(type, "GridRowCellViewModels[" + i + "].Data");

        };

         

        Action<int, int> addCheckBoxColumn = (activityIndex, federationIndex) =>

        {

            columns

                .Template(

                    @<text>

                        <input name="activityRows" type="checkbox" title="Select Activity" />

                        <input type="hidden" class="activityID" value="@item.GridRowCellViewModels[activityIndex].Data" />

                        <input type="hidden" class="federationID" value="@item.GridRowCellViewModels[federationIndex].Data" />

                    </text>)

                .ClientTemplate(

                    "<input name='activityRows' type='checkbox' title='Select Activity' />" +

                    "<input type='hidden' class='activityID' value='<#= GridRowCellViewModels[" + activityIndex + "].Data #>' />" +

                    "<input type='hidden' class='federationID' value='<#= GridRowCellViewModels[" + federationIndex + "].Data #>' />")

                .HeaderTemplate(

                    @<text>

                        <input id="check-all" name="checkAll" type="checkbox" value="checkAll" title="Select All" />

                    </text>)

                .Width(36);

        };

 

        Action<int, int, int> addOverrideColumn = (overrideIndex, activityIndex, federationIndex) =>

        {

            columns

                .Template(

                    @<text>

                        <a href='/Activity/Override?federationID=@(item.GridRowCellViewModels[federationIndex].Data)&activityID=@(item.GridRowCellViewModels[activityIndex].Data)'

                            class="activity_override_cell activity-table-override-@(item.GridRowCellViewModels[overrideIndex].Data)">

                            <img src="@Url.Content("~/Content/images/override.png")" alt="Override" width="16px" height="16px"/>

                        </a>

                    </text>)

                .ClientTemplate(

                    "<a href='/Activity/Override?federationID=<#= GridRowCellViewModels[" + federationIndex + "].Data #>&" +

                        "activityID=<#= GridRowCellViewModels[" + activityIndex + "].Data #>' class='activity_override_cell activity-table-override-<#= GridRowCellViewModels[" + overrideIndex + "].Data #>'>" +

                        "<img src='/Content/images/override.png' alt='Override' width='16px' height='16px'/>" +

                    "</a>")

                .HeaderTemplate(@<text></text>);

        };

 

        addCheckBoxColumn(1, 0);

     

        for (int colIndex = 0; colIndex < Model.Grid.ColumnCount; colIndex++)

        {

            string columnName = Model.Grid.Titles[colIndex];

             

            if (!HiddenColumns.Activities.Contains(columnName))

            {

                //colDef should not be null for columns that are shown

                ColumnDefinition colDef = Model.ColumnDefinitions.FirstOrDefault(c => c.ColumnName == columnName);

                addColumn(colIndex, Model.Grid.Titles[colIndex], Model.Grid.Types[colIndex], colDef);

            }

        }

 

        addOverrideColumn(2, 1, 0);

    })

    .Sortable(sorting => sorting.SortMode(GridSortMode.MultipleColumn))

    .EnableCustomBinding(true)

    .Pageable(paging => paging.Total(Model.Count).PageSize(Constants.DefaultGridPageSize))

    .Filterable()

    .ClientEvents(e => e

        .OnLoad("onActivityDataGridLoad")

        .OnDataBound("onActivityDataGridBound")

    )

)

Here is the full grid definition, lets start with that. What are column specific sort options and 
how do you use them? I don't see anything in the js that would obviously impact sorting.
Thank you for your replies so far. 



[Dadv]

Ouch, sorry but this is beyond my skills ...

You use a lot of Extender that I do not know, you use foreach/for loops and indexer,
Server binding AND ajax binding with there templates, Action in Action/Func.. etc.
To much for my little skill :)

However, I'm not surprise that you got some sort behavior, columns are define dynamically by indexer and modify 
by some extender whose name reminds them to change styles and attributes. All of that should disturb
the initial js script (I am disturbed too :) ).

Do you really need a so complex functionality?

All my escuses it's too complicated for me

Regards,

[John]

Thank you for looking at it, Hopefully someone else comes along that can help me out. :)

[Atanas Korchev]

Hello,

 I tried enabling multiple column sort mode in our custom binding example and everything seemed to work fine: both sort descriptors were populated in the GridCommand (see attached screenshot).

 Could you send a runnable project which we can check?

Kind regards,
Atanas Korchev
the Telerik team

[John]

I'm afraid our application is quite large, and I do not wish to send it in. I was hoping you could point me in the direction of something I had missed. If it should just be a matter of properly adding that sortmode then I will keep looking for what may be causing it. Let me know if there is anything else specific I should be focusing on.

Thanks,

-John

[Atanas Korchev]

Hello,

 Can you confirm that only one sort descriptor is being sent in the GridCommand? You can check that with the debugger.

Greetings,
Atanas Korchev
the Telerik team

[John]

Yes, the debugger shows that only one sort descriptor is being sent in, it is always the latest column that was selected. The previous columns are not sent in once more.

[Petur Subev]

Hello John,

On our side everything is working fine. Please check the attached project and use the debugger to inspect the SortDescriptors property of the Grid command object after you sort multiple times on different columns. If we missed something please modify the project and send it back so we can check it.

Kind regards,
Petur Subev
the Telerik team

[John]

Thank you for the response, we have decided to disable multi-column sort instead at this time. I believe that in the example it works, but something must be getting in the way in our implementation, but we are no longer spending time on it.