In each row of a grid with EditType = "Row", I'm trying to show/hide the column editor controls based on data in that row. When some rows are in edit mode (after being clicked on), they will display a text box, checkbox, etc. approporiate for that particular row. Other rows will hide that option in the same column.
For the entire column, edit controls can be shown/hidden based on the column's ReadOnly field. Can this be turned on/off for individual rows?
Would prefer to handle this server-side. Trying to avoid managing dynamically added controls based on data conditions and instead simply turn on/off editing in specific cells of each row.
In the example below, when a row is in edit mode, I want the edit text box in the MilkType column to only display if the Product for that row is Milk. Otherwise the cell should be read-only when the row is in edit mode.
Thanks!
-Matt
(posting code separately - having problems submitting new thread with code blocks)
5 Answers, 1 is accepted
<asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" runat="server"> <telerik:RadGrid ID="TestGrid" runat="server" AllowMultiRowSelection="True" OnNeedDataSource="TestGrid_OnNeedDataSource" > <MasterTableView EditMode="Batch" BatchEditingSettings-EditType="Row" AutoGenerateColumns="False"> <Columns> <telerik:GridBoundColumn ReadOnly="True" DataField="Product" HeaderText="Product" UniqueName="Product" DataType="System.String"></telerik:GridBoundColumn> <telerik:GridNumericColumn ColumnEditorID="ShortEditbox" ReadOnly="False" UniqueName="Quantity" DataField="Quantity" NumericType="Number" HeaderText="Quantity" DataType="System.Int32" /> <telerik:GridBoundColumn ColumnEditorID="TextEditbox" ReadOnly="False" UniqueName="MilkType" DataField="MilkType" HeaderText="MilkType" DataType="System.String" /> </Columns> </MasterTableView> </telerik:RadGrid> <telerik:GridNumericColumnEditor ID="ShortEditbox" runat="server"> <NumericTextBox Width="50px" BackColor="#edffc3" NumberFormat-DecimalDigits="0" ShowSpinButtons="True" MinValue="0" /> </telerik:GridNumericColumnEditor> <telerik:GridTextBoxColumnEditor ID="TextEditbox" runat="server"> <TextBoxStyle BackColor="#edffc3" ></TextBoxStyle> </telerik:GridTextBoxColumnEditor> </asp:Content> 01.using System; 02.using System.Collections.Generic; 03.using System.Data; 04.using System.Linq; 05.using System.Web; 06.using System.Web.UI; 07.using System.Web.UI.WebControls; 08.using Telerik.Web.UI; 09. 10.namespace Foo 11.{ 12. public partial class Sandbox1 : App_Code.BasePage2 13. { 14. protected void Page_Load(object sender, EventArgs e) 15. { 16. 17. } 18. 19. protected void TestGrid_OnNeedDataSource(object sender, GridNeedDataSourceEventArgs e) 20. { 21. TestGrid.DataSource = CurrentData; 22. } 23. 24. protected List<ShoppingListItem> CurrentData 25. { 26. get27. { 28. List<ShoppingListItem> data = new List<ShoppingListItem>(); 29. ShoppingListItem item = new ShoppingListItem(); 30. item.Product = GroceryItemTypes.Bread; 31. item.Quantity = 1; 32. item.MilkType = null; 33. data.Add(item); 34. 35. item = new ShoppingListItem(); 36. item.Product = GroceryItemTypes.Milk; 37. item.Quantity = 1; 38. item.MilkType = MilkTypes.TwoPercent; 39. data.Add(item); 40. 41. item = new ShoppingListItem(); 42. item.Product = GroceryItemTypes.Eggs; 43. item.Quantity = 6; 44. item.MilkType = null; 45. data.Add(item); 46. 47. return data; 48. } 49. } 50. } 51. 52. public class ShoppingListItem 53. { 54. public GroceryItemTypes Product { get; set; } 55. public int Quantity { get; set; } 56. public MilkTypes? MilkType { get; set; } 57. } 58. 59. public enum GroceryItemTypes { Eggs, Milk, Bread } 60. public enum MilkTypes { Whole, TwoPercent, Skim } 61.} Please try the following code snippet I tried to hide the TextBox when bread row is clicked.
ASPX:
<telerik:RadGrid ID="TestGrid" runat="server" AllowMultiRowSelection="True" OnNeedDataSource="TestGrid_OnNeedDataSource"> <MasterTableView EditMode="Batch" BatchEditingSettings-EditType="Row" AutoGenerateColumns="False"> .... </MasterTableView> <ClientSettings> <ClientEvents OnBatchEditOpened="OnBatchEditOpened" /> </ClientSettings></telerik:RadGrid>Javascript:
<script type="text/javascript"> function OnBatchEditOpened(sender, args) { var cardStatusCell = sender.get_masterTableView()._getCellByColumnUniqueNameFromTableRowElement(args.get_row(), "Product"); if (cardStatusCell.innerHTML == "Bread") { sender.get_masterTableView()._getCellByColumnUniqueNameFromTableRowElement(args.get_row(), "MilkType").getElementsByTagName("input")[0].style.display = "none"; } }</script>Thanks,
Shinu.