Ajaxify only parts of Grid

[Simon]

Hi

I am building a RadGrid dynamically, thus:

protected void Page_Init(object source, System.EventArgs e)
        {
            this.phRadGrid1.Controls.Add(DefineGridStructure());
            RadAjaxManager manager = new RadAjaxManager();
            manager.ID = "RadAjaxManager1";
            manager.DefaultLoadingPanelID = "RadAjaxLoadingPanel1";
            this.Page.Form.Controls.Add(manager);
        }

and then in the Page_Load event I am setting the Ajax to the Grid

// ajaxify Grid
            RadGrid1 = (RadGrid)phRadGrid1.FindControl("RadGrid1");
            RadAjaxManager manager = RadAjaxManager.GetCurrent(Page);
            manager.AjaxSettings.AddAjaxSetting(RadGrid1, RadGrid1);

This works 100%.

The grid is made up of Parent and Child Rows - I want to DISABLE the Ajax when I am working in the Child Rows.
I think I need to be more specific in defining the AjaxSettings above ie in this line:

manager.AjaxSettings.AddAjaxSetting(RadGrid1, RadGrid1);

I am not sure how to begin to do this. My first thought is to catch the Ajax Begin and End Response events in the Javascript and only pass them on when active in the parent rows of the grid, but I am not sure if this will work?

Some pointers would be much appreciated.

Regards
Simon

[Pavlina]

Hello Simon,

Please refer to the help topic below for more information about how to force controls in ajaxified container to perform PostBack:
http://www.telerik.com/help/aspnet-ajax/ajax-force-controls-to-postback.html

Best wishes,
Pavlina
the Telerik team

[Iana Tsolova]

Hello Simon,

Can you elaborate on what do you want to happen when you click on a child row?
However, you can implementing partial ajaxification for the grid, as in this demo.

Greetings,
Iana
the Telerik team

[Simon]

Hi Iana,

I actually wanted to not show the RadAjaxLoadingPanel on the Expand childrows and on the click of a Command Button on the child row CommandTemplate.

Does that make sense?
Simon

[Iana Tsolova]

Hello Simon,

If you want to conditionally display the loading panel, then you can leave the LoadingPanelID property empty in the ajax settings. Then handle the OnCommand event of the grid and show the loading panel there based on the command fired. Hide the loading panel in the OnResponseEnd event of RadAjax. For more information on the RadAjaxLoadingPanel explicit show/hide, check this demo.

Kind regards,
Iana
the Telerik team

[Simon]

Hi Iana

Thanks for that, I have approached it from the Client API and have a solution as follows:

In the Page_Init I add the OnRequestStart and OnResponseEnd eventhandlers

protected void Page_Init(object source, System.EventArgs e)
        {
            this.phRadGrid1.Controls.Add(DefineGridStructure());
            RadAjaxManager manager = new RadAjaxManager();
            manager.ID = "RadAjaxManager1";
            manager.ClientEvents.OnRequestStart = "RequestStart";
            manager.ClientEvents.OnResponseEnd = "ResponseEnd";
            this.Page.Form.Controls.Add(manager);
        }

then handle on client side:

<script type="text/javascript">

           function RequestStart(sender, eventArgs) {
            currentLoadingPanel = $find("<%= RadAjaxLoadingPanel1.ClientID %>");
            // Show the loading panel if not the Add to Cart Button
            // or not a child row with RowClick which will contain a semicolon(:) in the argument where
            // child row is involved
            // typically Rowclick;7:0_0
            var eventArgument = eventArgs.get_eventArgument();
            var eventTarget = eventArgs.get_eventTarget();
            if (eventTarget.indexOf("btnAddSelectedToCart") == -1 & eventArgument.indexOf(":") == -1) {
                currentUpdatedControl = "<%=RadGrid1.ClientID %>";
                currentLoadingPanel.show(currentUpdatedControl);
            }
        }
        function ResponseEnd() {
            //hide the loading panel and clean up the global variables
            if (currentLoadingPanel != null)
                currentLoadingPanel.hide(currentUpdatedControl);
            currentUpdatedControl = null;
            currentLoadingPanel = null;
        }

        var currentLoadingPanel = null;
        var currentUpdatedControl = null;
   </script>

my method of determining whether the event is a click within the child row is crude, I accept - but it works!

alternative approaches would be useful.

I will also try the suggestion given in using the OnCommand event in the code behind.

Many thanks
Simon