This is a migrated thread and some comments may be shown as answers.

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

1 Answer 263 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Francesco
Top achievements
Rank 1
Francesco asked on 25 Oct 2016, 08:03 PM

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.

 

 

 

1 Answer, 1 is accepted

Sort by
0
Konstantin Dikov
Telerik team
answered on 28 Oct 2016, 02:33 PM
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.
Tags
Grid
Asked by
Francesco
Top achievements
Rank 1
Answers by
Konstantin Dikov
Telerik team
Share this question
or