Reordering Telerik Column after Grouping

I am using a Telerik Grid to display data to the client. I have to show priority values first and then display non priority values. When the user group base on priority, the priority values should group first follow by the non priority group. I have a default descending grouping. When the user first access the page, it works fine. However, if the user remove the default grouping and try to group that column again, the non priority values are shown in the first group following by the priority which is the opposite of what I want.

In addition, I tried to do it on the client side using jquery, but the grid variable is always return null.

 $(function () {
      var grid = $('#Shipping').data('tGrid);
      alert(grid) // always return null.
    });

Here is the client side code that I am using for that column.

@(Html.Telerik().Grid(Model)
        .Name("Shipping")
        .DataKeys(Keys =>
        {
            Keys.Add(c => c.ShippingID);
        })
        .DataBinding(databinding => databinding.Server())
       .Columns(columns =>
        {
                columns.Bound(p => p.Priority)
                .Title("Priority")
                .HtmlAttributes(new { style = "text-align:left" })
                .Width(50)
                .Filterable(false)
                .Sortable(true)
                .Groupable(true) // I can't tell it group and sort it descending.
                .GroupHeaderTemplate(@<text>

       .Groupable(grouping => grouping.Groups(gr =>
        {
//Here I can tell it that I want to sort it descending 
             gr.Add("Priority", typeof(Boolean), System.ComponentModel.ListSortDirection.Descending); 
        }))

Please help me or give me a hint on how to fix this issue?

Adding a client side event fixed the issue, it was the reason why the grid was always showing null value in the JQuery function. The Grouping is still an issue; however, the client agree that they could click on the sort button, and it will sort them properly.