Ajax for telerik radgrid

2 posts, 0 answers
  1. 2d
    2d avatar
    1 posts
    Member since:
    Oct 2013

    Posted 24 Oct 2013 Link to this post

    I have a telerik radgrid along with several gridbound columns. I want to reload the grid with the new data on a button click (which deletes one of the rows) without doing a posting back and refreshing the page.

    But I am not sure how to use the telerik ajax manager, I have it as follow:

    <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server" >
    <AjaxSettings>
        <telerik:AjaxSetting AjaxControlID="myGrid">
            <UpdatedControls>
                <telerik:AjaxUpdatedControl ControlID="myGrid" />
            </UpdatedControls>
        </telerik:AjaxSetting>
    </AjaxSettings>
</telerik:RadAjaxManager>

    then, I have a LinkButton when onclick it fires the btn_OnCommand on server side, which rebinds myGrid with the new retrieved data. But I won't see the changes on client unless I refresh the page. Could someone point me how to use the ajax manager?

    Thanks
  3. Princy
    Princy avatar
    17421 posts
    Member since:
    Mar 2007

    Posted 25 Oct 2013 Link to this post

    Hi 2d,

    I guess you want to reload the Grid with new data on the click event of external RadLinkButton. RadAjaxManager is used for refreshing the Grid without doing complete page postback. Please have a look into the code snippet I tried.

    ASPX:
    <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">
        <AjaxSettings>
            <telerik:AjaxSetting AjaxControlID="RadGrid1">
                <UpdatedControls>
                    <telerik:AjaxUpdatedControl ControlID="RadGrid1" />
                </UpdatedControls>
            </telerik:AjaxSetting>
        </AjaxSettings>
        <AjaxSettings>
            <telerik:AjaxSetting AjaxControlID="RadButton1">
                <UpdatedControls>
                    <telerik:AjaxUpdatedControl ControlID="RadGrid1" />
                </UpdatedControls>
            </telerik:AjaxSetting>
        </AjaxSettings>
    </telerik:RadAjaxManager>
    <telerik:RadGrid ID="RadGrid1" runat="server" AutoGenerateColumns="False" DataSourceID="SqlDataSource1">
        <MasterTableView DataSourceID="SqlDataSource1">
            <Columns>
                <telerik:GridBoundColumn DataField="OrderID" DataType="System.Int32" FilterControlAltText="Filter OrderID column"
                    HeaderText="OrderID" SortExpression="OrderID" UniqueName="OrderID">
                </telerik:GridBoundColumn>
                <telerik:GridBoundColumn DataField="CustomerID" FilterControlAltText="Filter CustomerID column"
                    HeaderText="CustomerID" SortExpression="CustomerID" UniqueName="CustomerID">
                </telerik:GridBoundColumn>
            </Columns>
        </MasterTableView>
    </telerik:RadGrid>
    <telerik:RadButton ID="RadButton1" runat="server" Text="Delete Row" ButtonType="LinkButton"
        OnClick="RadButton1_Click">
    </telerik:RadButton>
    <asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:NorthwindConnectionString %>"
        SelectCommand="SELECT top 10 [OrderID], [CustomerID] FROM [Orders]">
    </asp:SqlDataSource>

    C#:
    protected void RadButton1_Click(object sender, EventArgs e)
    {
        SqlDataSource1.SelectCommand = "SELECT top 9 [OrderID], [CustomerID] FROM [Orders]";
        RadGrid1.DataBind();
    }

    Thanks,
    Princy.
Back to Top