I've created an automatically updating grid like the Ajax/Ajaxify Timer demo. When I edit a row, I'd like to exclude some columns from updating when the row is in edit mode (namely the ones being edited) and still have other columns update. However, when I click edit, all the columns are updated even the ones I'm editing. Is there a way to make these columns not update while I'm editing?
Here is a simple example to demonstrate what is happening.
The Default.aspx
... and the Default.aspx.cs
Thank you.
Here is a simple example to demonstrate what is happening.
The Default.aspx
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="Default" %><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head runat="server"> <title></title> <telerik:RadStyleSheetManager id="RadStyleSheetManager1" runat="server" /></head><body> <form id="form1" runat="server"> <telerik:RadScriptManager ID="RadScriptManager1" runat="server"> <Scripts> <%--Needed for JavaScript IntelliSense in VS2010--%> <%--For VS2008 replace RadScriptManager with ScriptManager--%> <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.Core.js" /> <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQuery.js" /> <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQueryInclude.js" /> </Scripts> </telerik:RadScriptManager> <script type="text/javascript"> //Put your JavaScript code here. </script> <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server" EnableAJAX="true"> <AjaxSettings> <telerik:AjaxSetting AjaxControlID="RadGrid1"> <UpdatedControls> <telerik:AjaxUpdatedControl ControlID="RadGrid1" /> </UpdatedControls> </telerik:AjaxSetting> <telerik:AjaxSetting AjaxControlID="Timer1"> <UpdatedControls> <telerik:AjaxUpdatedControl ControlID="RadGrid1" /> </UpdatedControls> </telerik:AjaxSetting> </AjaxSettings> </telerik:RadAjaxManager> <div> <telerik:RadGrid ID="RadGrid1" runat="server" GridLines="None" OnNeedDataSource="RadGrid1_NeedDataSource" OnUpdateCommand="RadGrid1_UpdateCommand"> <MasterTableView Name="RadGrid1TableView" AutoGenerateColumns="false" ShowHeader="true" CommandItemDisplay="None" EditMode="InPlace" AllowPaging="true" > <PagerStyle AlwaysVisible="true" Mode="NextPrevNumericAndAdvanced" Wrap="false" /> <Columns> <telerik:GridEditCommandColumn ButtonType="ImageButton" EditText="Edit" UniqueName="EditButton" /> <telerik:GridBoundColumn DataField="Value1" HeaderText="Value1" SortExpression="Value1" AllowFiltering="false" AllowSorting="false" UniqueName="Value1"> </telerik:GridBoundColumn> <telerik:GridBoundColumn DataField="Value2" HeaderText="Value2" SortExpression="Value2" AllowFiltering="false" AllowSorting="false" UniqueName="Value2" ReadOnly="true"> </telerik:GridBoundColumn> <telerik:GridBoundColumn DataField="Value3" HeaderText="Value3" SortExpression="Value3" AllowFiltering="false" AllowSorting="false" UniqueName="Value3" ReadOnly="true"> </telerik:GridBoundColumn> <telerik:GridBoundColumn DataField="Value4" HeaderText="Value4" SortExpression="Value4" AllowFiltering="false" AllowSorting="false" UniqueName="Value4" ReadOnly="true"> </telerik:GridBoundColumn> </Columns> </MasterTableView> </telerik:RadGrid> <asp:Timer ID="Timer1" runat="server" OnTick="Timer1_Tick" Interval="3000" /> </div> </form></body></html>... and the Default.aspx.cs
using System;using System.Data;using System.Web.UI;using Telerik.Web.UI;public partial class Default : Page { protected void Page_Load(object sender, EventArgs e) { } protected void Timer1_Tick(object sender, EventArgs e) { RadGrid1.Rebind(); } protected void RadGrid1_NeedDataSource(object source, GridNeedDataSourceEventArgs e) { RadGrid1.DataSource = GetRandomData(); } private static DataTable GetRandomData() { DataTable dt = new DataTable(); Random rand = new Random(); dt.Columns.Add(new DataColumn("Value1", typeof(double))); dt.Columns.Add(new DataColumn("Value2", typeof(double))); dt.Columns.Add(new DataColumn("Value3", typeof(double))); dt.Columns.Add(new DataColumn("Value4", typeof(double))); for (int x = 0; x < 10; x++) { DataRow row = dt.NewRow(); row["Value1"] = rand.Next(); row["Value2"] = rand.Next(); row["Value3"] = rand.Next(); row["Value4"] = rand.Next(); dt.Rows.Add(row); } return dt; } protected void RadGrid1_UpdateCommand(object source, GridCommandEventArgs e) { // Do the update }}Thank you.
6 Answers, 1 is accepted
0
Princy
Top achievements
Rank 2
Rank 2
answered on 20 Jan 2011, 01:34 PM
Hello Jimmy,
If you want to exclude some columns in edit form, one suggestion would be make that control ReadOnly/hide from code behind like below.
C#:
Thanks,
Princy.
If you want to exclude some columns in edit form, one suggestion would be make that control ReadOnly/hide from code behind like below.
C#:
protected void RadGrid1_ItemDataBound(object sender, GridItemEventArgs e) { if (e.Item is GridEditableItem && e.Item.IsInEditMode) { GridEditableItem editItem = (GridEditableItem)e.Item; TextBox txtbox = (TextBox)editItem["Value1"].Controls[0]; txtbox.ReadOnly = true; //or txtbox.Visible = false; } }Thanks,
Princy.
0
Jimmy
Top achievements
Rank 1
Rank 1
answered on 20 Jan 2011, 03:37 PM
Thank you for the reply.
However, I'm not trying to exclude columns from being edited. I'm trying to exclude them from being updated by the rebind. It's hard to type in a text box that keeps overwriting what you've typed and losing focus. The same problem is in the pager when trying to change the page size or the the current page.
Thank you.
However, I'm not trying to exclude columns from being edited. I'm trying to exclude them from being updated by the rebind. It's hard to type in a text box that keeps overwriting what you've typed and losing focus. The same problem is in the pager when trying to change the page size or the the current page.
Thank you.
0
Hello Jimmy,
The described behavior is expected because when the grid is rebound, it and all the controls contained in it are recreated.
However, you can overcome the loss of data by traversing all textboxes and saving their values in the database or in the viewstate. If you store them in the viewstate, you can retrieve them on PreRender of the grid.
An alternative approach is to update the datasource manually and not call rebind if there are items in edit mode.
I hope this helps.
Greetings,
Mira
the Telerik team
The described behavior is expected because when the grid is rebound, it and all the controls contained in it are recreated.
However, you can overcome the loss of data by traversing all textboxes and saving their values in the database or in the viewstate. If you store them in the viewstate, you can retrieve them on PreRender of the grid.
An alternative approach is to update the datasource manually and not call rebind if there are items in edit mode.
I hope this helps.
Greetings,
Mira
the Telerik team
Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.
0
Jimmy
Top achievements
Rank 1
Rank 1
answered on 19 May 2011, 03:14 PM
The last couple of suggestions said I should store the values somewhere and then load them back up on a prerender or manually alter the data. However, my goal is not to save the values and the alter the data prior to rendering to use the same values. My goal is to exclude certain columns from being updated by the rebind that is occurring on a timer when the row is in edit mode.
I've changed my approach on this to use client-side data binding. After I get the data via AJAX, I call a function like this:
I'm also handling the OnDataBinding client-side event with a function like this:
What this does is cancel the databind for the row if it is in edit mode, so all the other rows are still databound except for the ones in edit mode. I think I'm getting close on this, I just need a push in the right direction.
Is there a way to exclude certain controls such as RadTextBoxes or RadDropDowns in TemplateColumns (or columns or cells or items in the dataitem) from being included in the databinding when the row is in edit mode leaving the rest of the columns to be updated by the databind?
Thank you.
I've changed my approach on this to use client-side data binding. After I get the data via AJAX, I call a function like this:
function populateData(data) {var grid = $find("<%= RadGrid1.ClientID %>");if (grid != null) {var gridTableView = grid.get_masterTableView();if (gridTableView != null) {gridTableView.set_dataSource(data);gridTableView.dataBind();}}}I'm also handling the OnDataBinding client-side event with a function like this:
function radGrid1_DataBinding(sender, eventArgs) { var tableView = sender.get_masterTableView(); var dataItems = tableView.get_dataItems();
for (var dataItem in dataItems) { if (dataItem.get_isInEditMode()) {
eventArgs.set_cancel(true);
} }}What this does is cancel the databind for the row if it is in edit mode, so all the other rows are still databound except for the ones in edit mode. I think I'm getting close on this, I just need a push in the right direction.
Is there a way to exclude certain controls such as RadTextBoxes or RadDropDowns in TemplateColumns (or columns or cells or items in the dataitem) from being included in the databinding when the row is in edit mode leaving the rest of the columns to be updated by the databind?
Thank you.
0
Hello Jimmy,
One of the limitations of the client data-binding is the lack of grid editors. Since the control is bound on the client, and no subsequent trips are made to the server, the default editors cannot be rendered and shown, which is the standard behavior, when the grid is bound on the server. The most straightforward option to work-around this is to use an external edit form which is demonstrated in the following example.
Using this approach you can show only the desired fields in the edit form.
Here you can read more about the client-side binding specifics.
I hope this helps.
Greetings,
Mira
the Telerik team
One of the limitations of the client data-binding is the lack of grid editors. Since the control is bound on the client, and no subsequent trips are made to the server, the default editors cannot be rendered and shown, which is the standard behavior, when the grid is bound on the server. The most straightforward option to work-around this is to use an external edit form which is demonstrated in the following example.
Using this approach you can show only the desired fields in the edit form.
Here you can read more about the client-side binding specifics.
I hope this helps.
Greetings,
Mira
the Telerik team
Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.
0
Jimmy
Top achievements
Rank 1
Rank 1
answered on 01 Jun 2011, 08:08 PM
I was able to get the desired results.
The trick is to use GridTemplateColumns instead of GridBoundColumns. With GridBoundColumns the control is updated regardless. With GridTemplateColumns and client-side data binding, if the ID of the control matches the DataField of the column then the control will be bound. If it is different it will not.
The solution is to set the ID of the TextBox in the EditItemTemplate of the GridTemplateColumn equal to the DataField of the GridTemplateColumn for the columns you want to be bound and set it to something different if you don't want it to bind.
The client-side OnDataBinding and the server-side OnItemDataBound event handlers are not necessary.
Thank you.
The trick is to use GridTemplateColumns instead of GridBoundColumns. With GridBoundColumns the control is updated regardless. With GridTemplateColumns and client-side data binding, if the ID of the control matches the DataField of the column then the control will be bound. If it is different it will not.
The solution is to set the ID of the TextBox in the EditItemTemplate of the GridTemplateColumn equal to the DataField of the GridTemplateColumn for the columns you want to be bound and set it to something different if you don't want it to bind.
The client-side OnDataBinding and the server-side OnItemDataBound event handlers are not necessary.
Thank you.