[Solved] Grid Functionality

[Nate]

Hello,

First of all pardon me, I have done little work with Grids prior to this. But I have two questions. First, when I click edit, how do I make it so that one of the fields is a drop down to change the value for the update, rather than a text field. I have a dataset and I using dataset.fill and then binding it to the grid to get the grid displayed with the correct data. 

Second of all, when I click update on the webpage does it automatically post back and do the update with the code I provide in the update command event or do I need to do anything else? 

Thank you!

Nate

[Princy]

Hello Nate,

1) You could use a GridTemplateColumn with a label in its ItemTemplate and a DropDownList in its EditItemTemplate and bind it accordingly in the code behind. Check out the example below:
aspx:

<telerik:GridTemplateColumn UniqueName="TemplateColumn" HeaderText="Template">
   <ItemTemplate>
      <asp:Label ID="Label1" Text='<%# Bind("ContactTitle") %>' runat="server"></asp:Label>
   </ItemTemplate>
   <EditItemTemplate>
      <asp:DropDownList ID="DropDownList1" runat="server"></asp:DropDownList>
   </EditItemTemplate>
</telerik:GridTemplateColumn>

c#:

protected void RadGrid1_ItemDataBound(object sender, GridItemEventArgs e)
    {
        if ((e.Item is GridEditableItem) && (e.Item.IsInEditMode))
        {
            GridEditableItem item = (GridEditableItem)e.Item;
            DropDownList ddl = (DropDownList)item.FindControl("DropDownList1");
            ddl.DataSource = ds; // bind the dropdownlist to the dataset here
            ddl.DataTextField = "ContactTitle";

        }
    }

2) The UpdateCommand event get.s automatically triggered on clicking the auto generated Update button and thereby your custom Update code will be executed.

Thanks
Princy.

[Nate]

Princy,

Thanks for getting back to me. I tried the following:

 grid.ID = "RadGrid1";
            //grid.DataSourceID = "SqlDataSource1";
            string sqlConnection = "Data Source=DESQL2008;Initial Catalog=DrawOnTime;User Id=ontimeweb;Password=ontime1234;", query;
            query = "select IncidentId, IncidentNumber, Incidents.Name, Users.FirstName + ' ' + Users.LastName as 'IT Employee Assigned', StatusTypes.Name as 'Status' from incidents left join Users on Users.UserId=Incidents.AssignedToId left join StatusTypes on StatusTypes.StatusTypeId = Incidents.StatusTypeId where Incidents.ReportedByCustomerContactId = @PK and Incidents.StatusTypeId=8;";
            SqlConnection dbconn = new SqlConnection(sqlConnection);
            dbconn.Open();
            SqlCommand myCommand = new SqlCommand(query, dbconn);
            SqlDataAdapter myAdapter = new SqlDataAdapter(myCommand);
            DataSet ds = new DataSet();
            myCommand.Parameters.AddWithValue("PK", Default.PK);
            myAdapter.Fill(ds);
            string templateColumnName = "Confirm Closing";
            GridEditCommandColumn templateColumn = new GridEditCommandColumn();
            //templateColumn.ItemTemplate = new MyTemplate(templateColumnName);
            templateColumn.HeaderText = templateColumnName;
            //GridBoundColumn boundColumn1 = new GridBoundColumn();
            //boundColumn1.DataField = "ContactName";
            //boundColumn1.UniqueName = "ConactName";
            //boundColumn1.HeaderText = "Bound Column";
            //templateColumn.DataSourceID = "SqlDataSource1";
            //templateColumn.ReadOnly = false;
            GridDropDownColumn ddColumn = new GridDropDownColumn();
            ddColumn.DataSourceID = "SqlDataSource1";
            grid.MasterTableView.Columns.Add(ddColumn);
            grid.MasterTableView.Columns.Add(templateColumn);
            grid.DataSource = ds;
            grid.DataBind();

            grid.Skin = "Outlook";
            grid.Width = Unit.Percentage(100);
            grid.PageSize = 5;
            grid.AllowPaging = true;
            grid.PagerStyle.Mode = GridPagerMode.NextPrevAndNumeric;
            grid.AutoGenerateColumns = false;
            grid.AutoGenerateEditColumn = true;

            dbconn.Close();

I was looking in your pdf on how to use the telerik controls and it outlines griddropwdowncolumn as one such definition for a column. I placed the grid on the page, and I build it in the code behind because I need to use a parameter for my query and do not know how to that in configure data source wizard for vs2008. In the code behind do I need to define both the column how it is when it is loaded AND how it is in edit mode? Because this column is showing up, A) It does not have a dropdown in it and B) when I go to edit mode it disappears. 

[Princy]

Hello Nate,

The GridDropDownColumn renders a LiteralControl when the grid is in normal mode and a DropDownList when the grid is in edit mode. Inorder to populate the column in normal/edit mode, you have to set the DataField, ListTextField, ListValueField properties of the column to the required datafields of the database. For eg:
c#:

GridDropDownColumn ddColumn = new GridDropDownColumn();
ddColumn.DataSourceID = "SqlDataSource1";
ddColumn.DataField = "ContactTitle";
ddColumn.ListTextField = "ContactTitle";
ddColumn.ListValueField = "ContactName";
grid.MasterTableView.Columns.Add(ddColumn);

Thanks
Princy.

[Nate]

I receiving the following yellowscreen when I click edit on the grid:

Server Error in '/' Application.

---

Multiple controls with the same ID 'VLLC_Name' were found. FindControl requires that controls have unique IDs.

Description: An unhandled exception occurred during the execution of the current web request. Please review the stack trace for more information about the error and where it originated in the code. 

Exception Details: System.Web.HttpException: Multiple controls with the same ID 'VLLC_Name' were found. FindControl requires that controls have unique IDs.

Source Error: 

An unhandled exception was generated during the execution of the current web request. Information regarding the origin and location of the exception can be identified using the exception stack trace below.

Stack Trace: 

[HttpException (0x80004005): Multiple controls with the same ID 'VLLC_Name' were found. FindControl requires that controls have unique IDs.] System.Web.UI.Control.FillNamedControlsTable(Control namingContainer, ControlCollection controls) +273 System.Web.UI.Control.FillNamedControlsTable(Control namingContainer, ControlCollection controls) +320 System.Web.UI.Control.EnsureNamedControlsTable() +61 System.Web.UI.Control.FindControl(String id, Int32 pathOffset) +222 System.Web.UI.Control.FindControl(String id) +12 Telerik.Web.UI.GridDropDownColumn.OnDataBindColumn(Object sender, GridCellDataBoundEventArgs args) +3735 Telerik.Web.UI.GridCellDataBoundEvent.Invoke(Object sender, GridCellDataBoundEventArgs args) +0 Telerik.Web.UI.GridItem.OnCellDataBound(GridColumn column, TableCell cell) +99 Telerik.Web.UI.GridItem.CellsDataBound(GridColumn[] columns) +149 Telerik.Web.UI.GridItem.SetupItem(Boolean dataBind, Object dataItem, GridColumn[] columns, ControlCollection rows) +1066 Telerik.Web.UI.GridItemBuilder.InitializeItem(Int32 dataSourceIndex, String& nextItemHierarchicalIndex, Boolean& itemIsInEditMode) +252 Telerik.Web.UI.GridItemBuilder.CreateItems(GridGroupingContext group) +565 Telerik.Web.UI.GridTableView.CreateItems(IEnumerator enumerator, GridColumn[] columns, ControlCollection controls) +187 Telerik.Web.UI.GridTableView.CreateControlHierarchy(Boolean useDataSource) +1077 Telerik.Web.UI.GridTableView.CreateChildControls(IEnumerable dataSource, Boolean useDataSource) +786 System.Web.UI.WebControls.CompositeDataBoundControl.PerformDataBinding(IEnumerable data) +57 System.Web.UI.WebControls.DataBoundControl.OnDataSourceViewSelectCallback(IEnumerable data) +114 System.Web.UI.DataSourceView.Select(DataSourceSelectArguments arguments, DataSourceViewSelectCallback callback) +31 System.Web.UI.WebControls.DataBoundControl.PerformSelect() +142 Telerik.Web.UI.GridTableView.PerformSelect() +28 System.Web.UI.WebControls.BaseDataBoundControl.DataBind() +73 Telerik.Web.UI.GridTableView.DataBind() +368 Telerik.Web.UI.GridTableView.Rebind() +98 Telerik.Web.UI.GridCommandEventArgs.ExecuteCommand(Object source) +395 Telerik.Web.UI.RadGrid.OnBubbleEvent(Object source, EventArgs e) +191 System.Web.UI.Control.RaiseBubbleEvent(Object source, EventArgs args) +37 Telerik.Web.UI.GridItem.OnBubbleEvent(Object source, EventArgs e) +165 System.Web.UI.Control.RaiseBubbleEvent(Object source, EventArgs args) +37 System.Web.UI.WebControls.LinkButton.OnCommand(CommandEventArgs e) +118 System.Web.UI.WebControls.LinkButton.RaisePostBackEvent(String eventArgument) +135 System.Web.UI.WebControls.LinkButton.System.Web.UI.IPostBackEventHandler.RaisePostBackEvent(String eventArgument) +10 System.Web.UI.Page.RaisePostBackEvent(IPostBackEventHandler sourceControl, String eventArgument) +13 System.Web.UI.Page.RaisePostBackEvent(NameValueCollection postData) +175 System.Web.UI.Page.ProcessRequestMain(Boolean includeStagesBeforeAsyncPoint, Boolean includeStagesAfterAsyncPoint) +1565

---

Version Information: Microsoft .NET Framework Version:2.0.50727.3082; ASP.NET Version:2.0.50727.3082

[Nate]

I am getting a new error with the code seen below. Well it is the same type of error, but different object being referenced: 

Multiple controls with the same ID 'AutoGeneratedEditButton' were found. FindControl requires that controls have unique IDs.

Description: An unhandled exception occurred during the execution of the current web request. Please review the stack trace for more information about the error and where it originated in the code. 

Exception Details: System.Web.HttpException: Multiple controls with the same ID 'AutoGeneratedEditButton' were found. FindControl requires that controls have unique IDs.

Source Error: 

An unhandled exception was generated during the execution of the current web request. Information regarding the origin and location of the exception can be identified using the exception stack trace below.

Stack Trace: 

[HttpException (0x80004005): Multiple controls with the same ID 'AutoGeneratedEditButton' were found. FindControl requires that controls have unique IDs.] System.Web.UI.Control.FillNamedControlsTable(Control namingContainer, ControlCollection controls) +273 System.Web.UI.Control.FillNamedControlsTable(Control namingContainer, ControlCollection controls) +320 System.Web.UI.Control.EnsureNamedControlsTable() +61 System.Web.UI.Control.FindControl(String id, Int32 pathOffset) +222 System.Web.UI.Control.FindControl(String id) +12 Telerik.Web.UI.GridDropDownColumn.OnDataBindColumn(Object sender, GridCellDataBoundEventArgs args) +3732 Telerik.Web.UI.GridCellDataBoundEvent.Invoke(Object sender, GridCellDataBoundEventArgs args) +0 Telerik.Web.UI.GridItem.OnCellDataBound(GridColumn column, TableCell cell) +99 Telerik.Web.UI.GridItem.CellsDataBound(GridColumn[] columns) +149 Telerik.Web.UI.GridItem.SetupItem(Boolean dataBind, Object dataItem, GridColumn[] columns, ControlCollection rows) +1066 Telerik.Web.UI.GridItemBuilder.InitializeItem(Int32 dataSourceIndex, String& nextItemHierarchicalIndex, Boolean& itemIsInEditMode) +252 Telerik.Web.UI.GridItemBuilder.CreateItems(GridGroupingContext group) +565 Telerik.Web.UI.GridTableView.CreateItems(IEnumerator enumerator, GridColumn[] columns, ControlCollection controls) +187 Telerik.Web.UI.GridTableView.CreateControlHierarchy(Boolean useDataSource) +1077 Telerik.Web.UI.GridTableView.CreateChildControls(IEnumerable dataSource, Boolean useDataSource) +786 System.Web.UI.WebControls.CompositeDataBoundControl.PerformDataBinding(IEnumerable data) +57 System.Web.UI.WebControls.DataBoundControl.OnDataSourceViewSelectCallback(IEnumerable data) +114 System.Web.UI.DataSourceView.Select(DataSourceSelectArguments arguments, DataSourceViewSelectCallback callback) +31 System.Web.UI.WebControls.DataBoundControl.PerformSelect() +142 Telerik.Web.UI.GridTableView.PerformSelect() +28 System.Web.UI.WebControls.BaseDataBoundControl.DataBind() +73 Telerik.Web.UI.GridTableView.DataBind() +368 Telerik.Web.UI.GridTableView.Rebind() +98 Telerik.Web.UI.GridCommandEventArgs.ExecuteCommand(Object source) +395 Telerik.Web.UI.RadGrid.OnBubbleEvent(Object source, EventArgs e) +191 System.Web.UI.Control.RaiseBubbleEvent(Object source, EventArgs args) +37 Telerik.Web.UI.GridItem.OnBubbleEvent(Object source, EventArgs e) +165 System.Web.UI.Control.RaiseBubbleEvent(Object source, EventArgs args) +37 System.Web.UI.WebControls.LinkButton.OnCommand(CommandEventArgs e) +118 System.Web.UI.WebControls.LinkButton.RaisePostBackEvent(String eventArgument) +135 System.Web.UI.WebControls.LinkButton.System.Web.UI.IPostBackEventHandler.RaisePostBackEvent(String eventArgument) +10 System.Web.UI.Page.RaisePostBackEvent(IPostBackEventHandler sourceControl, String eventArgument) +13 System.Web.UI.Page.RaisePostBackEvent(NameValueCollection postData) +175 System.Web.UI.Page.ProcessRequestMain(Boolean includeStagesBeforeAsyncPoint, Boolean includeSt

 private void DefineGridStructure()
        {
            grid.AutoGenerateEditColumn = true;
            grid.ID = "RadGrid1";
            //grid.DataSourceID = "SqlDataSource1";
            string sqlConnection = "Data Source=DESQL2008;Initial Catalog=DrawOnTime;User Id=ontimeweb;Password=ontime1234;", query;
            query = "select IncidentId, IncidentNumber, Incidents.Name, Users.FirstName + ' ' + Users.LastName as 'IT Employee Assigned', StatusTypes.Name as 'Status' from incidents left join Users on Users.UserId=Incidents.AssignedToId left join StatusTypes on StatusTypes.StatusTypeId = Incidents.StatusTypeId where Incidents.ReportedByCustomerContactId = @PK and Incidents.StatusTypeId=8;";
            SqlConnection dbconn = new SqlConnection(sqlConnection);
            dbconn.Open();
            SqlCommand myCommand = new SqlCommand(query, dbconn);
            SqlDataAdapter myAdapter = new SqlDataAdapter(myCommand);
            DataSet ds = new DataSet();
            myCommand.Parameters.AddWithValue("PK", Default.PK);
            myAdapter.Fill(ds);
            grid.DataSource = ds;
            grid.DataBind();
            //string templateColumnName = "Confirm Closing";
            //GridEditCommandColumn templateColumn = new GridEditCommandColumn();
            //templateColumn.ItemTemplate = new MyTemplate(templateColumnName);
            //templateColumn.HeaderText = templateColumnName;
            //GridBoundColumn boundColumn1 = new GridBoundColumn();
            //boundColumn1.DataField = "ContactName";
            //boundColumn1.UniqueName = "ConactName";
            //boundColumn1.HeaderText = "Bound Column";
            //templateColumn.DataSourceID = "SqlDataSource1";
            //templateColumn.ReadOnly = false;
            GridDropDownColumn ddColumn = new GridDropDownColumn();
            ddColumn.HeaderText = "Status";
            ddColumn.DataSourceID = "SqlDataSource1";
            ddColumn.DataField = "Name";
            ddColumn.ListTextField = "Name";
            ddColumn.ListValueField = "StatusTypeId";
            grid.MasterTableView.Columns.Add(ddColumn);
            //grid.MasterTableView.Columns.Add(templateColumn);


            grid.Skin = "Outlook";
            grid.Width = Unit.Percentage(100);
            grid.PageSize = 5;
            grid.AllowPaging = true;
            grid.PagerStyle.Mode = GridPagerMode.NextPrevAndNumeric;
            grid.AutoGenerateColumns = false;


            dbconn.Close();
        }

[Sebastian]

Hello Nate ,

I suppose you are adding more than one edit columns to your grid. If so, you can get this error since the id of the auto-generated edit button will be duplicated for those edit columns.

If you would like to have more edit columns as part of the grid consider using single GridEditCommandColumn or AutoGeneratedEditColumn and use GridButtonColumn with CommandName="Edit" and Text="Edit" for the rest.

Also verify that you build the grid programmatically in par with the concepts explained here and bind it using advanced binding with NeedDataSource handling.

Best regards,
Sebastian
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.