RadGrid Inside WebUser Control

[Hari]

Hi,

We are using telerik radgrid inside a user control.Inside radajaxmanager_ajaxrequest we are binding the values for the Telerik grid.
But the issue is,we are not able to see the grid inside radajaxmanager_ajaxrequest but we are getting inside page load.But the ajaxloadingpanel is loaded properly.

is that anything specific for user control when comes to AJAX?

Appreciate the quick response to this.

[Eyup]

Hello Hari,

I suppose you are using the DataBind() method to bind your grid. Please note that performing complex grid operations such as Inserting, Deleting, Updating, Hierarchy relations, Grouping, Paging, Sorting, Filtering, etc. require accommodating appropriate database operations. To use them with Simple Databinding you will need to declare custom event handling for every operation which requires binding to your DataSource. Therefore, we strongly recommend the use of more advanced databinding methods, which automatically handle the aforementioned functions:
Declarative DataSource
Advanced Data Binding

Additionally, you could check out the following topic for ajaxifying user controls:
http://www.telerik.com/help/aspnet-ajax/ajax-user-controls.html

I hope this will prove helpful. If you have different requirements or further questions, please elaborate some more on the issue.

Regards,
Eyup
the Telerik team

[Hari]

We have a application usercontrol which inherits from a common user control in our solution.we are dynamically assigning a widget to a page and each widget is associated to each application user control.We are having a radgrid inside our user control and we are binding that radgrid using RadAjaxManager_AjaxRequest function with initial load as an argument.i am passing the argument via radcode block javascript.we are using datasource as webservice.
I have used below link as an sample for the above mentioned thing 
http://www.telerik.com/help/aspnet-ajax/ajax-show-loadingpanel-on-initial-pageload.html

But the thing is,we are getting the desired radgrid at page load but not at RadAjaxManager_AjaxRequest.

[Hari]

i just solved the above problem.Thanks for your response.

But i am facing another issue in d same code.The issue is i am having label which is present inside a table.
I am not able to assign text to that label inside Radajaxmanager_Ajaxrequest but i am able to do that thing inside page load.The code looks like this.

<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>

<%@ Register Assembly="Microsoft.Aerogel.Web" Namespace="Microsoft.Aerogel.Web.UI"

    TagPrefix="Aerogel" %>

   <telerik:RadCodeBlock ID="SelfServiceCodeBlock" runat="server">

    <script type="text/javascript">

        function pageLoad(sender, eventArgs) {

            if (!eventArgs.get_isPartialLoad()) {

                $find("<%= RadAjaxManager1.ClientID %>").ajaxRequest("InitialPageLoad");

            }

        }     

    </script>

</telerik:RadCodeBlock>

        <telerik:RadAjaxLoadingPanel ID="" Height="75px" Width="75px" Transparency="25" runat="server">

        <img alt="Loading..." src='<%= RadAjaxLoadingPanel.GetWebResourceUrl(Page, "Telerik.Web.UI.Skins.Default.Ajax.loading.gif") %>' style="border: 0;" />

        </telerik:RadAjaxLoadingPanel>

<telerik:RadTabStrip ID="" runat="server" EnableEmbeddedSkins="false" EnableTheming="false" Skin="Comcast" BackColor="Black" MultiPageID="">

    <Tabs >

        <telerik:RadTab Text="" Selected="true" TabIndex="0">

        </telerik:RadTab>

        <telerik:RadTab Text="" TabIndex="1"/>

    </Tabs>

</telerik:RadTabStrip>

<telerik:RadMultiPage ID="" runat="server" SelectedIndex="0"  Visible="true" Width="100%" Height="100%">

        <telerik:RadPageView ID="" runat="server" CssClass="Tab" >      

            <telerik:RadGrid ID="" ShowHeader="false" ShowFooter="false" runat="server" ItemStyle-BackColor="White" AlternatingItemStyle-BackColor="White" GridLines="None" OnItemDataBound="">

                <MasterTableView AutoGenerateColumns="False" NoMasterRecordsText="">

                    <Columns>

                     <telerik:GridTemplateColumn>

                     <ItemTemplate>

                         //Our Code here

                   </ItemTemplate>

                 

                     </telerik:GridTemplateColumn>                      

                    </Columns>

                </MasterTableView>

                 <PagerStyle Mode="NextPrevAndNumeric" AlwaysVisible="true" NextPageText="Next" PrevPageText="prev">

                </PagerStyle>

            </telerik:RadGrid>  

      </telerik:RadPageView>

       <telerik:RadPageView ID="" runat="server" CssClass="Tab">

            <telerik:RadGrid ID="" ShowHeader="false" ShowFooter="false" runat="server" ItemStyle-BackColor="White" AlternatingItemStyle-BackColor="White" OnItemDataBound="" GridLines="None">

                <MasterTableView AutoGenerateColumns="False" NoMasterRecordsText="">

                <Columns>

                    <telerik:GridTemplateColumn>

                        <ItemTemplate>

                           

//Our Code here

                        </ItemTemplate>

                    </telerik:GridTemplateColumn>

                </Columns>

                </MasterTableView>

                <PagerStyle Mode="NextPrevAndNumeric" AlwaysVisible="true" NextPageText="Next" PrevPageText="prev">

                </PagerStyle>

            </telerik:RadGrid>

      </telerik:RadPageView>

</telerik:RadMultiPage>

<telerik:RadAjaxManager ID="RadAjaxManager1" runat="server" OnAjaxRequest="RadAjaxManager_AjaxRequest">

    <AjaxSettings>

        <telerik:AjaxSetting AjaxControlID="RadAjaxManager1">

            <UpdatedControls>

                <telerik:AjaxUpdatedControl ControlID=""/>  

                 <telerik:AjaxUpdatedControl ControlID="" LoadingPanelID="" />                

            </UpdatedControls>

        </telerik:AjaxSetting>      

    </AjaxSettings>

</telerik:RadAjaxManager>

<table id="tblPaging" runat="server" style="empty-cells: show; width: 100%; table-layout: fixed;">

                            <tr>

                                <td>

                                    <table>

                                        <tr>

                                            <td>

                                                <asp:LinkButton ID="lnkBk" runat="server" CssClass="ListPageUp" OnClick="lnkBk_Click" />

                                            </td>

                                            <td nowrap>

                                                <asp:Label ID="lblPaging" runat="server" Text="Change Page:" Style="text-decoration: none;

                                                    font-weight: bold;" />

                                            </td>

                                            <td>

                                                <asp:LinkButton ID="lnkFr" runat="server" CssClass="ListPageDown" OnClick="lnkFr_Click" />

                                            </td>

                                        </tr>

                                    </table>

                                </td>

                                <td align="right">

                                    <asp:LinkButton ID="lnkViewAll" runat="server" Text="view all" OnClick="lnkViewAll_Click"

                                        CssClass="button60Blue button60" />

                                </td>

                            </tr>

                            <tr style="height: 5px;">

                                <td>

                                </td>

                            </tr>

                        </table>

                        



In my .cs file i am assigning values to lblPaging inside Radajaxmanager_Ajaxrequest.i am not able to get it in UI.But when i debug the code,the value is assigned to the label.

Please help me in this ASAP.

[Eyup]

Hello Hari,

Please try adding the Label as an updated control for the AjaxManager initiator:

<AjaxSettings>
    <telerik:AjaxSetting AjaxControlID="RadAjaxManager1">
        <UpdatedControls>
            <telerik:AjaxUpdatedControl ControlID="Label1" />
        </UpdatedControls>
    </telerik:AjaxSetting>
</AjaxSettings>

That should do the trick. Please give it a try and let me know about the result.

Regards,
Eyup
the Telerik team

[Hari]

Thanks for your quick response.I have one query in the below code.

<telerik:RadMultiPage ID="mltPage1" runat="server" SelectedIndex="0" Visible="true"
    Width="100%" Height="100%">
    <telerik:RadPageView ID="" runat="server" CssClass="Tab">
        <telerik:RadGrid ID="RadGrid1" runat="server" GridLines="None" ItemStyle-BackColor="White"
            AlternatingItemStyle-BackColor="White" OnItemDataBound="RadGrid1_ItemDataBound"
            PageSize="6"  CellPadding="0" CellSpacing="0" >
            <MasterTableView NoMasterRecordsText="." AutoGenerateColumns="false" CellPadding="0" CellSpacing="0">
                <Columns>
                    <telerik:GridTemplateColumn>
                        <ItemTemplate>
                       
                            <div id="div1" runat="server" visible="false">
                            <asp:Label ID="Label1" Text="" runat="server" />
                            </div>
                            
                        </ItemTemplate>
                    </telerik:GridTemplateColumn>
                </Columns>
            </MasterTableView>
        </telerik:RadGrid>
    </telerik:RadPageView>
</telerik:RadMultiPage>


I am not able to access div with id "div1" inside RadAjaxManager_AjaxRequest event function triggered at initial page load 
as below.

RadCodeBlock:

<telerik:RadCodeBlock ID="RadCodeBlock1" runat="server">
    <script type="text/javascript">
        function pageLoad(sender, eventArgs) {
            if (!eventArgs.get_isPartialLoad()) {

                $find("<%= RadAjaxManager1.ClientID %>").ajaxRequest("InitialPageLoad");
            }
        }

</telerik:RadCodeBlock>

RadAjaxManager:

<telerik:RadAjaxManager ID="RadAjaxManager1" runat="server" OnAjaxRequest="RadAjaxManager1_AjaxRequest">
    <AjaxSettings>
        <telerik:AjaxSetting AjaxControlID="RadAjaxManager1">
            <UpdatedControls>
                <telerik:AjaxUpdatedControl ControlID="" LoadingPanelID="RadAjaxLoadingPanel1" />
            </UpdatedControls>
        </telerik:AjaxSetting>
    </AjaxSettings>
</telerik:RadAjaxManager>

Server side event for radajaxmanager:

protected void RadAjaxManager1_AjaxRequest(object sender, Telerik.Web.UI.AjaxRequestEventArgs e)
    {

        if (e.Argument == "InitialPageLoad")
        {

            try
            {
                
                
                HtmlGenericControl div1= (HtmlGenericControl)RadGrid1.FindControl("div1");
                div1.Visible = true;
                
            }
            catch (Exception s)
            {

                throw s;
            }
            finally
            {

            }


        }
    }



in the above code when i try to access the div(id=div1),its showing object reference error.

Could you please help me in accesssing that div control inside RadAjaxManager1_AjaxRequest event?

Thanks,

Hari

[Eyup]

Hello Hari,

Add the multipage as an updated control by the ajax manager and try using the following code snippet:

protected void RadAjaxManager1_AjaxRequest(object sender, AjaxRequestEventArgs e)
{
    foreach (GridDataItem dataItem in RadGrid1.MasterTableView.Items)
    {
        HtmlGenericControl labelDiv = dataItem["ColumnUniqueName"].FindControl("div1") as HtmlGenericControl;
        labelDiv.Visible = true;
    }
}

I hope this helps. Please give it a try and let me know about the result.

Kind regards,
Eyup
the Telerik team