Forgot to attach the 2nd solution. Here it is

Hello Olga,

ok I see the idea behind the sorting.

Thanks alot!

Hi Matthias,

Are you saying when you click on the column header to sort the column the sorting indicate (image) does not show up? The image in the header does not show until the column is sorted (ie added to the sortable columns collection). If you are not adding the column to the sorted columns collection the only way to force the image to show up in the header is with javascript, in the following way:

var currentHTML = grid.get_columns().get_columnFromKey("Template").get_headerElement().innerHTML;

grid.get_columns().get_columnFromKey("Template").get_headerElement().innerHTML = currentHTML + " " + "<img id=\"x:680611362.3:img:1\" title=\"Ascending\" alt=\"Ascending\" style=\"margin-left:5px;\" src=\"ig_res/Default/images/igg_sortAsc.gif\" img=\"1\">";

Thanks,

Olga Kerchentseva

ASP.NET Principal Software Engineer

Infragistics, Inc.

Hello Olga,

seems like I'm still missing a piece of the puzzle:

We're initializing the images to sort with this code:

            if (this.Behaviors.Sorting != null)
            {
                this.Behaviors.Sorting.AscendingImageUrl = this.GetWebResourceUrl(EmbeddedImages.SortAsc);
                this.Behaviors.Sorting.DescendingImageUrl = this.GetWebResourceUrl(EmbeddedImages.SortDesc);
            }

I switched from using template fields in the header to something like this:

                    <ig:TemplateDataField Key="RoleType" Width="160px" Footer-CssClass="rowSelectEdit">
                        <Header Text ="Roletype" />
                        <ItemTemplate>

The sorting properties are still:
                    <ig:Sorting Enabled="true">
                        <ColumnSettings>
                            <ig:SortingColumnSetting ColumnKey="RoleType" Sortable="true" />
                        </ColumnSettings>

                        <SortingClientEvents ColumnSorting="dgrRoles_Sorting" />
                    </ig:Sorting>

Can you tell me what I'm missing that the images are shown? I hoped to see them in every column header I'm defining in the columnSettings, or am I wrong there?

Hi Matthias,

That approach is fine, as long as your code will actually trigger a sort before you cancel the sorting client event.  Sorting should be triggered every time you click on the header of the column, the reason that I can think of which would prevent this from happening is if you have a template in the header of the column and when you click you are actually clicking on the template (like a button). In which case it is possible that the templated control in the header will process the click event and will not bubble up the event to the TH element of the grid. If you have a click handler for your tempalted controls in the header make sure that you are not preventing the event from bubbling up.

Thanks

Olga

Hello Olga,

I guess i kinda miss-explained the problem: If I get the sorted event the preRender event fails, because it cant find the field on the datasource. The datasource is a is a rowviewtable, which is kinda special.

So my approach would be to let the Sorting event trigger and cancel this. Before cancelling I request the server-side to sort the datasource directly. Something like this:

                    <ig:Sorting>
                        <ColumnSettings>
                            <ig:SortingColumnSetting ColumnKey="RoleType" />
                   
                        </ColumnSettings>

                        <SortingClientEvents ColumnSorting="dgrRoles_Sorting" />
                    </ig:Sorting>

        function dgrRoles_Sorting(sender, eventArgs) {
            //My Code
            eventArgs.set_cancel(true);
        }

Is that the right approach? It seems like sorting does not shoot everytime I press on the RoleType buttons.