How to save all changes to a page (including RadGrids)?

2 posts, 0 answers
  1. Francesco
    Francesco avatar
    1 posts
    Member since:
    Oct 2016

    Posted 25 Oct Link to this post

    Hi, I have a situation like this (see the attach image), and I have some dilemma.

    I have in my page several radgrids, populated with the Advanced Databinding. I use OnNeedDataSource correctly for taking data from my database.

    In my scenario the user can press on the "Add row" button and, through a EditForm, create a new row for the grid. The user can see this row, but this row is not saved immediatly on the database. I want to save this new row (and other changes and informations in the page) only after pressing the Save button.

    But I have encountered many problems to do this. For example I have some difficulties with managing rebinds and postback... So, I'm here to ask you if exist some "Best practice" to do this kind of stuff.

    Thank you for your attention.

     

     

     

  2. Konstantin Dikov
    Admin
    Konstantin Dikov avatar
    1803 posts

    Posted 28 Oct Link to this post

    Hello Francesco,

    Although that there is no built-in option for achieving such requirement, you can refer to the following example:
    <telerik:RadCodeBlock ID="RadCodeBlock1" runat="server">
        <script type="text/javascript">
            function saveAll() {
                var grid1 = $find("<%=RadGrid1.ClientID%>");
                var grid2 = $find("<%=RadGrid2.ClientID%>");
                var batchManager1 = grid1.get_batchEditingManager();
                var batchManager2 = grid2.get_batchEditingManager();
                var hasChanges = batchManager1.hasChanges(grid1.get_masterTableView()) || batchManager2.hasChanges(grid2.get_masterTableView());
                console.log(hasChanges);
                if (hasChanges) {
                    batchManager1.saveTableChanges([grid1.get_masterTableView(), grid2.get_masterTableView()]);
                } else {
                    var ajaxPanel = $find("<%=RadAjaxPanel1.ClientID%>");
                    ajaxPanel.ajaxRequest();
                }
            }
        </script>
    </telerik:RadCodeBlock>
     
    <telerik:RadAjaxPanel runat="server" ID="RadAjaxPanel1" OnAjaxRequest="RadAjaxPanel1_AjaxRequest">
        <telerik:RadButton runat="server" ID="RadButton1" AutoPostBack="false" Text="Save all" OnClientClicked="saveAll"></telerik:RadButton>
        <telerik:RadTextBox runat="server" ID="RadTextBox1"></telerik:RadTextBox>
     
        <telerik:RadGrid runat="server" ID="RadGrid1" Width="200px" OnNeedDataSource="RadGrid1_NeedDataSource" OnBatchEditCommand="RadGrid1_BatchEditCommand">
            <MasterTableView EditMode="Batch">
            </MasterTableView>
        </telerik:RadGrid>
     
        <telerik:RadGrid runat="server" ID="RadGrid2" Width="200px" OnNeedDataSource="RadGrid1_NeedDataSource" OnBatchEditCommand="RadGrid2_BatchEditCommand">
            <MasterTableView EditMode="Batch">
            </MasterTableView>
        </telerik:RadGrid>
    </telerik:RadAjaxPanel>

    And the code-behind:
    protected void Page_Load(object sender, EventArgs e)
    {
    }
    protected void RadGrid1_NeedDataSource(object sender, Telerik.Web.UI.GridNeedDataSourceEventArgs e)
    {
        DataTable table = new DataTable();
        table.Columns.Add("ID", typeof(int));
        for (int i = 0; i < 3; i++)
        {
            table.Rows.Add(i);
        }
     
        (sender as RadGrid).DataSource = table;
    }
     
    protected void RadAjaxPanel1_AjaxRequest(object sender, AjaxRequestEventArgs e)
    {
        //save the other controls data
    }
     
    protected void RadGrid1_BatchEditCommand(object sender, GridBatchEditingEventArgs e)
    {
    }
    protected void RadGrid2_BatchEditCommand(object sender, GridBatchEditingEventArgs e)
    {
    }

    Hope this helps.


    Regards,
    Konstantin Dikov
    Telerik by Progress
    Check out the new UI for ASP.NET Core, the most complete UI suite for ASP.NET Core development on the market, with 60+ tried-and-tested widgets, based on Kendo UI.
  3. UI for ASP.NET Ajax is Ready for VS 2017
Back to Top