Image Showing When a Control IS Added to EditItemPlate.
Introduction
Based on my previous control "Multiple Column DropDownList for ASP.NET", I received many emails asking for the same control to be used in the DataGrid for web applications. Here we go .. This control can be used as the regular MS DropDownList in the DataGrid and also as a regular dropdownlist. It has all the properties, like DataTextField, DataValueField, DataSource, SelectedIndex etc. The download file contains the samples both in VB.NET and C #. in this sample, I have used the Northwind database of SQL Server.
Building the control
The Following Web Server Controls Were Used to Build this Control:
TextBox Label Panel
Adding The Control to DataGrid
.
.. Drop a DataGrid onto your webform Right click the DataGrid and select Property Builder and select Columns A bound column may or may not be required, I have shown samples of both Add two bound columns, set the header and the text field:. SupplierID and CompanyName. Add one Template Column and set the header text to Products. Uncheck the checkbox "Create columns automatically at run time". Click OK. now right click the DataGrid and select Edit Template, now either you could add this in ItemTemplate or EditItemTemplate Set The Properties of The Control, Like Cssclass, GridrowColor, DataTextField etc. Close The Template Box.
Points to Note:
The DataValueField property is readonly, which means you can not set the value, so make sure that in your query, the row value field is always the first column, which will not be displayed in the dropdown. The DataTextField returns an integer value, so while setting this property, type the column position from your "SELECT" statement, which needs to get displayed in the textbox. (For eg, to display the second column "LastName" in the textbox, set DataValueField = 2.) If your DataGrid is inside the "Table / Div / Span", then make sure the "Position" attribute in the "Style" property is set to absolute, and if not used in any of these tags, then set the DataGrid's Style property.Make sure that the Horizontalalign and Vertyln Properties of The ItemStyle of Your DataGrid IS SET AS SHOWN, ELSE The Control May Not Be posationed Properly Inside The DataGrid. EG:
See the code below. E.G., To Populate The Dropdown with firstname and lastname:
Select Employeei, Firstname, Lastname
From Employees
Now if added in the edititemtemplate (BASEDOMN MAY OR MY NOT BE Required), in My Sample I buy Two
Font-size = "8pt" headerstyle-forecolor = "tan" AutogenerateColumns = "false" Headerstyle-BackColor = "Maroon" Headerstyle-font-bold = "true" font-name = "verdana" showfooter = "false" Bordercolor = "Tan" DatakeyField = "SupplierID" OnupdateCommand = "mydatagrid_update" oncancelcommand = "mydatagrid_cancel" OneDitCommand = "MyDataGrid_edit" cellspacing = "0" cellpadding = "3" Width = "800" style = "Position: absolute; top: 0px; left: 0px"> Updatetext = "update" canceltext = "ca Zan" edittext = "edit"> asp: editcommandcolumn> Readonly = "True" Headertext = "Supplier ID"> ask: BOUNDCOLUMN> Readonly = "true" Headertext = "Company Name"> ask: BOUNDCOLUMN> <% # Databinder.eval (container.dataitem, "productname")%> Itemtemplate>