Grouping pages rad grid

[Alex]

Hi 

Is there a way of putting grouping together on one page instead spreading over multiple pages in a rad grid ? 

Regards

Alex

[Attila Antal]

Hi Alex,

RadGrid looks for the items/rows whether its inside the group, and when they reach the number defined in the PageSize (default: 10) it will render the following 10 items on the next page.

To have all the groups on a single page, you will need to disable paging. You can also do that conditionally when there is actually Grouping done for the Grid. Thus the items will have paging in General, and when grouped, they will appear on one page.

Kind regards,
Attila Antal
Progress Telerik

[Alex]

Hi Attila 

Thanks for the answer to my last question 

I have got another one , is it possible to get the group/ungroup option in the header context menu , so that I can turn paging on/off?

Alex

[Attila Antal]

Hi Alex,

Once the Grouping and ContextMenu has been enabled for the Grid, you will be able to Group/Ungroup columns from the ContextMenu. Check out the Grid - Excel-like Filtering demo which has a context menu and you can use it to Group/Ungroup columns.

Kind regards,
Attila Antal
Progress Telerik

[Alex]

Hi Attilla

I have attached a onitemclick on the context menu and when you click the group by the event does not fire.

Is it done on client side? and what is the best way of doing it ?

Regards

Alex

[Attila Antal]

Hi Alex,

The menu embedded in RadGrid handles will skip attaching the ItemClick handler to items that have a specific purpose, such as Group/UnGroup. Items that have a sub menu and they do not need the Click handler would fire.

Nevertheless, if you want to attach a click event listener to the items, you can try using the following example:

<script type="text/javascript">
    function OnHeaderMenuShowing(sender, args) {
        var menu = args.get_menu();
        $(menu.get_element()).find('ul.rmLevel1 > li.rmItem:not(.rmSeparator)').on('click', ItemClickHandler);
    }

    function ItemClickHandler(e) {
        // do something
    }
</script>

 

You can also take advantage of the Command client-side event of the Grid which fires when a command is initiated by the user on client:

<telerik:RadGrid ID="RadGrid1" runat="server">
    <ClientSettings>
        <ClientEvents OnCommand="OnCommand" />
    </ClientSettings>
</telerik:RadGrid>

 

JavaScript

function OnCommand(sender, args) {
    // do something
}

 

Kind regards,
Attila Antal
Progress Telerik

[Alex]

Hi Attila 

Here is my javascript code but everytime I run it, the 'group by' option doesn't turn off the paging feature even though I have specifically stated for it to be set to false. Is there a way to remove the paging feature when the radgrid is grouped by a particular column so all of the rows load as one page instead of multiple.

  function OnCommand(sender, args) {
            var result = args.get_commandName();
            var tableView =sender.get_masterTableView();
            if (result == "GroupByColumn") {
                tableView.AllowPaging = false;
                tableView.PageSize = 400;
            }
            return false;
       
        }

[Attila Antal]

Hi Alex,

The AllowPaging property is for enabling-disabling paging on the server-side. 

To enable/disable the Paging from the client, you will need to fire a command that will do a Post Back, and during that time disable the Paging.

Fire a custom command using the fireCommand, then, on the server use the ItemCommand event handler to capture that custom command.

Example:

JavaScript:

function FirePageCommand() {
    var masterTable = $find("<%= RadGrid1.ClientID %>").get_masterTableView();
    masterTable.fireCommand("MyCustomCommand", "SomeArgumentsToPassToServer");
}

 

C# - Code behind:

protected void RadGrid1_ItemCommand(object sender, GridCommandEventArgs e)
{
    if(e.CommandName == "MyCustomCommand")
    {
        object arguments = e.CommandArgument; // output: "SomeArgumentsToPassToServer"
    }
}

 

Kind regards,
Attila Antal
Progress Telerik