Dynamically define Rad Grid using Code Behind in C#

10 posts, 0 answers
  1. Muhammad
    Muhammad avatar
    4 posts
    Member since:
    Dec 2013

    Posted 12 May 2014 Link to this post

    I want to add Rad Grid Dynamically using Code Behind.with Dynamic Columns 1 Columns should be Drop Down , 1 Column Should be Date picker, 1 Column Should be Text field.these Dynamic Columns should be Shown in Edit mode when Edit button is Clicked.while Showing Data just Data should be shown like data in label.
    how can it be possible.
  2. Princy
    Princy avatar
    17421 posts
    Member since:
    Mar 2007

    Posted 12 May 2014 in reply to Muhammad Link to this post

    Hi Muhammad,

    You can have a GridTemplateColumn to achieve your requirement. To create a template dynamically, you must define a custom class that implements the ITemplate interface. Then you can assign an instance of this class to the ItemTemplate or EditTemplate property of the GridTemplateColumn object. Below is a sample code that shows how to have a DropDown in edit and label in view mode, similarly you can create other columns.

    ASPX:
    <asp:ScriptManager ID="ScriptManager1" runat="server">
    </asp:ScriptManager>
    <asp:PlaceHolder ID="PlaceHolder1" runat="server"></asp:PlaceHolder>
    <asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:ConnectionString %>" SelectCommand="SELECT * FROM [Orders]"></asp:SqlDataSource>

    C#:
    RadGrid RadGrid1; 
    protected void Page_Init(object sender, EventArgs e)
    {
        RadGrid1 = new RadGrid();
        RadGrid1.DataSourceID = "SqlDataSource1";
        RadGrid1.MasterTableView.DataKeyNames = new string[] { "OrderID" };
        RadGrid1.AllowPaging = true;
        RadGrid1.AutoGenerateColumns = false
        RadGrid1.AutoGenerateEditColumn = true
        RadGrid1.ItemDataBound += new GridItemEventHandler(RadGrid1_ItemDataBound);
     
        GridBoundColumn boundColumn1;
        boundColumn1 = new GridBoundColumn();
        boundColumn1.DataField = "OrderID";
        boundColumn1.HeaderText = "OrderID";
        boundColumn1.UniqueName = "OrderID";
        RadGrid1.MasterTableView.Columns.Add(boundColumn1);
     
        GridBoundColumn boundColumn2;
        boundColumn2 = new GridBoundColumn();
        boundColumn2.DataField = "ShipCity";
        boundColumn2.HeaderText = "ShipCity";
        boundColumn2.UniqueName = "ShipCity";
        RadGrid1.MasterTableView.Columns.Add(boundColumn2);
     
        string templateColumnName = "employeeid";
        GridTemplateColumn templateColumn = new GridTemplateColumn();
        templateColumn.ItemTemplate = new MyTemplate(templateColumnName);
        templateColumn.EditItemTemplate = new MyEditTemplate();
        templateColumn.HeaderText = templateColumnName;
        templateColumn.DataField = "EmployeeID";
        RadGrid1.MasterTableView.Columns.Add(templateColumn);
        PlaceHolder1.Controls.Add(RadGrid1);
    }  
     
    public class MyTemplate : ITemplate
    {
        private string colname;
        protected Label lControl;
        public MyTemplate(string cName)
        {
            colname = cName;
        }
        public void InstantiateIn(System.Web.UI.Control container)
        {
            lControl = new Label();
            lControl.ID = "lControl";
            lControl.DataBinding += new EventHandler(lControl_DataBinding);
            container.Controls.Add(lControl);
        }
     
        public void lControl_DataBinding(object sender, EventArgs e)
        {
            Label l = (Label)sender;
            GridDataItem container = (GridDataItem)l.NamingContainer;
            l.Text = ((DataRowView)container.DataItem)[colname].ToString() + "<br />";
        }
    }
     
    public class MyEditTemplate : IBindableTemplate
    {
        public void InstantiateIn(Control container)
        {
            GridEditFormItem item = ((GridEditFormItem)(container.NamingContainer));
            DropDownList drop = new DropDownList();
            drop.ID = "dropdownlist1";
            container.Controls.Add(drop);
        }
        public System.Collections.Specialized.IOrderedDictionary ExtractValues(System.Web.UI.Control container)
        {
            OrderedDictionary od = new OrderedDictionary();
            od.Add("OrderID", ((DropDownList)(((GridEditFormItem)(container)).FindControl("dropdownlist1"))).DataValueField);
            return od;
        }
    }
     
    protected void RadGrid1_ItemDataBound(object sender, Telerik.Web.UI.GridItemEventArgs e)
    {
        if (e.Item is GridEditFormItem && e.Item.IsInEditMode)
        {
            GridEditFormItem editItem = (GridEditFormItem)e.Item;
            DropDownList ddl = (DropDownList)editItem.FindControl("dropdownlist1");
            ddl.DataSourceID = "SqlDataSource1";
            ddl.DataTextField = "Employeeid";
            ddl.DataValueField = "Employeeid";
            ddl.SelectedIndex = editItem.ItemIndex;
        }
    }

    Thanks,
    Princy
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Muhammad
    Muhammad avatar
    4 posts
    Member since:
    Dec 2013

    Posted 13 May 2014 Link to this post

    Thanks Princy for Reply its work fine i want to add one thing more into it
    when user click's on edit button Dropdown list Populate's,
    but Selected value is not defined as previous selected value lets suppose EmployeeID = 5 when user Click on Edit Button Dropdown List Show's but Selected Value of Dropdown is 1 i want to dropdown to Select previos value as previously defined.
  5. Muhammad
    Muhammad avatar
    4 posts
    Member since:
    Dec 2013

    Posted 13 May 2014 Link to this post

    and when i click add or edit button it does not fires any event how to make it possible
  6. Princy
    Princy avatar
    17421 posts
    Member since:
    Mar 2007

    Posted 13 May 2014 in reply to Muhammad Link to this post

    Hi Muhammad,

    In order to set the selected value of the DropDown you can take a look at the following code snippet.
    Then for the events to fire, make sure you have added them to your code and if your are handling it manually, do not set AllowAutomaticUpdates/AllowAutomaticInserts to true. Provide your code if this doesn't help.

    C#:
    RadGrid1.MasterTableView.CommandItemDisplay = GridCommandItemDisplay.Top;
    RadGrid1.AutoGenerateEditColumn = true;
    RadGrid1.ItemDataBound+=new GridItemEventHandler(RadGrid1_ItemDataBound);
    RadGrid1.InsertCommand += new GridCommandEventHandler(RadGrid1_InsertCommand);
    RadGrid1.UpdateCommand += new GridCommandEventHandler(RadGrid1_UpdateCommand);
    . . .
    protected void RadGrid1_ItemDataBound(object sender, Telerik.Web.UI.GridItemEventArgs e)
    {
        if (e.Item is GridEditFormItem && e.Item.IsInEditMode)
        {
         GridEditFormItem editItem = (GridEditFormItem)e.Item;
         DropDownList ddl = (DropDownList)editItem.FindControl("dropdownlist1");
         ddl.DataSourceID = "SqlDataSource1";
         ddl.DataTextField = "Employeeid";
         ddl.DataValueField = "Employeeid";
         ddl.SelectedValue = DataBinder.Eval(editItem.DataItem, "Employeeid").ToString();//set the selected value
        }
    }

    Thanks,
    Princy
  7. Muhammad
    Muhammad avatar
    4 posts
    Member since:
    Dec 2013

    Posted 14 May 2014 in reply to Princy Link to this post

    Thanks Princy its all work fine i want to add one more feature to be included. is it possible to define Template Field Dynamically i mean to say i want to attach this one Defined Template Field in More than one Columns of Rad Grid with Different Column Name, Drop Down List Data etc.??
    Thanks in Advance
  8. Princy
    Princy avatar
    17421 posts
    Member since:
    Mar 2007

    Posted 15 May 2014 in reply to Muhammad Link to this post

    Hi Muhammad,

    I'm not clear about your requirement, I guess you want to use the same ItemTemplate and EditItemTemplate class for different columns. Please take a look at the following, if this doesn't help, elaborate your requirement.

    C#:
    string templateColumnName = "EmployeeID";
    GridTemplateColumn EmployeeID = new GridTemplateColumn();
    EmployeeID.ItemTemplate = new MyTemplate(templateColumnName);
    EmployeeID.EditItemTemplate = new MyEditTemplate(templateColumnName);
    EmployeeID.HeaderText = templateColumnName;
    EmployeeID.DataField = "EmployeeID";
    RadGrid1.MasterTableView.Columns.Add(EmployeeID);
     
     
    templateColumnName = "ShipCity";
    GridTemplateColumn City = new GridTemplateColumn();
    City.ItemTemplate = new MyTemplate(templateColumnName);
    City.EditItemTemplate = new MyEditTemplate(templateColumnName);
    City.HeaderText = templateColumnName;
    City.DataField = "ShipCity";
    RadGrid1.MasterTableView.Columns.Add(City);
    . . . .
    public class MyTemplate : ITemplate
    {
        protected Label lControl;
        private string colname;
        
        public MyTemplate(string cName)
        {
            colname = cName;
        }
        public void InstantiateIn(System.Web.UI.Control container)
        {
            lControl = new Label();
            lControl.ID = "lControl"+colname;
            lControl.DataBinding += new EventHandler(lControl_DataBinding);
            container.Controls.Add(lControl);
        }
     
        public void lControl_DataBinding(object sender, EventArgs e)
        {
            Label l = (Label)sender;
            GridDataItem container = (GridDataItem)l.NamingContainer;
            l.Text = ((DataRowView)container.DataItem)[colname].ToString() + "<br />";
        }
    }
     
    public class MyEditTemplate : IBindableTemplate
    {
         private string colname;
         public MyEditTemplate(string cName)
        {
            colname = cName;
        }
        public void InstantiateIn(Control container)
        {
            GridEditFormItem item = ((GridEditFormItem)(container.NamingContainer));
            DropDownList drop = new DropDownList();
            drop.ID = "dropdownlist"+colname;
            container.Controls.Add(drop);
        }
        public System.Collections.Specialized.IOrderedDictionary ExtractValues(System.Web.UI.Control container)
        {
            OrderedDictionary od = new OrderedDictionary();
            od.Add("OrderID", ((DropDownList)(((GridEditFormItem)(container)).FindControl("dropdownlist"+colname))).DataValueField);
            return od;
        }
    }
     
    protected void RadGrid1_ItemDataBound(object sender, Telerik.Web.UI.GridItemEventArgs e)
    {
        if (e.Item is GridEditFormItem && e.Item.IsInEditMode)
        {
            GridEditFormItem editItem = (GridEditFormItem)e.Item;
            DropDownList ddlEmployeeid = (DropDownList)editItem.FindControl("dropdownlistEmployeeID");
            ddlEmployeeid.DataSourceID = "SqlDataSource1";
            ddlEmployeeid.DataTextField = "EmployeeID";
            ddlEmployeeid.DataValueField = "EmployeeID";
            ddlEmployeeid.SelectedValue = DataBinder.Eval(editItem.DataItem, "EmployeeID").ToString();
            DropDownList ddlShipCity = (DropDownList)editItem.FindControl("dropdownlistShipCity");
            ddlShipCity.DataSourceID = "SqlDataSource1";
            ddlShipCity.DataTextField = "ShipCity";
            ddlShipCity.DataValueField = "ShipCity";
            ddlShipCity.SelectedValue = DataBinder.Eval(editItem.DataItem, "ShipCity").ToString();
        }
    }

    Thanks,
    Princy
  9. Fahad
    Fahad avatar
    2 posts
    Member since:
    Apr 2016

    Posted 22 Apr Link to this post

    I want to add rows dynamically in radgrid from code behind from a button (on CLICK Event) outside Radgrid & bind columns to it dynamically . Take the number & type of columns from Database. can you suggest a solution for the same ?
  10. Fahad
    Fahad avatar
    2 posts
    Member since:
    Apr 2016

    Posted 22 Apr Link to this post

    When I click on "Add' button, the rows of Radgrid should be added & the columns (dropdowns) should be binded dynamically. I have the number of columns and their values stored in Database.
  11. Fahad
    Fahad avatar
    2 posts
    Member since:
    Apr 2016

    Posted 22 Apr Link to this post

    When I click on "Add' button, the rows of Radgrid should be added & the columns (dropdowns) should be binded dynamically. I have the number of columns and their values stored in Database.
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017