Multiple selection using DropDownList in DataGrid

原创 2004年10月06日 14:02:00

Introduction:

In this article I will explain how to select multiple dropdownlist values when the dropdownlist is one of the columns of the datagrid. I am using Northwind Database in this example which is the default database in Sql Server.  

Adding DropDownList to DataGrid:

Okay adding DropDownList to datagrid is straight forward. Read the following steps:

1) Drag and Drop datagrid onto the webform

2) Right click on datagrid -> Select Property Builder

3) In Property Builder select Columns.

4) Add two bound columns and one template column ( Remember to add bound columns first and than the template column ). UnCheck create columns automatically.  

5) Now in the same window click on the Bound column appearing on the right window and set its header text to "Category ID" and DataField to "CategoryID". Click on the second bound column appearing in the right windows and set header text to "Category Name" and DataField to "CategoryName".

Remember that header text is just the pure plain text which can be anything. DataField on the other hand is the name of the Column in the database so it must be the exact same name as of the Column in database. 

Now its time to add the DropDownList. Simple right click on Datagrid and select the option edit template. In the item template just drag and Drop a DropDownList in item template.

Also in the last add one asp button control anywhere on the form.

Once you have done all these steps your datagrid should look something like this:

Sample screenshot

Populating DataGrid with Data:

Populating Datagrid is straight forward just make the datasource run a query and bind the source to the datagrid. 


In the code above I have used Ad-Hoc query, a query in string format. You should never execute your query like this and always use stored procedures for security purposes.

Populating DropDownList from database:

You can always populate your dropdownlist by using its collections property but to make things interesting I am going to populate the DropDownList with the data comming from the database column.

public

DataSet PopulateList()

{

SqlDataAdapter ad =

new SqlDataAdapter("SELECT Description FROM Categories",myConnection);

DataSet ds =

new DataSet();

ad.Fill(ds,"Categories");

return ds;

}

As you see in the above code that the method "PopulateList" is returning DataSet. This dataset is used by the DropDownList to populate itself. Let's see how DropDownList named "ddlList" use this dataset to populate itself.

In the aspx page HTML find the line where DropDownList is declared and add properties to it.

<asp:DropDownList id="ddlList" runat="server" DataSource="<%# PopulateList %>" DataTextField="Description" DataValueField="Description" >

After this your DropDownList will be populated with the data comming from "Description" Column of NorthWind Database.

Here is a picture of the complete webform:

Sample screenshot

Button Click Event Code:

Remember that we added an asp button control. In the onclick event of the button write this code:

private

void Button1_Click(object sender, System.EventArgs e)

{

string name = null;

foreach(DataGridItem dgi in myDataGrid.Items)

{

DropDownList dl = (DropDownList)(dgi.Cells[2].Controls[1]);

if(dl.SelectedValue != null)

{

name+= dl.SelectedValue;

name+="<BR>";

}

}

Label2.Text = name;

}

Okay and thats it after making your selection from all the DropDownList press Button and it will bind your selection with a Label control on the webform.

In this code we are using "DataGridItem" dgi whose purpose is to iterate through the DataGrid Items. Next we make a new DropDownList "dl" and place the value of the DropDownList which is in DataGrid Cell [2] (Cells starts with 0) in it. We check using "if" condition that it the selected value is not null if the selected value is not null we concatenate it in the string variable name and display name afterwards.

Thats it! happy coding :D

编辑DataGrid时动态绑定DropDownList

 前台代码:  asp:DataGrid DataKeyField="id" id="DataGrid1" runat="server"  AutoGenerateColumns="False">  ...
  • chenyuling
  • chenyuling
  • 2007年04月10日 16:00
  • 994

处理在DataGrid中的DropDownList的事件

DropDownList没有CommandName属性,所以不能用ItemCommand事件,不过你可以在DataGrid的模板列中加入的DropDownList控件(aspx):asp:Templa...
  • bill1315
  • bill1315
  • 2007年10月09日 15:31
  • 512

Using DropDownList control in DataGrid

  • zgqtxwd
  • zgqtxwd
  • 2008年05月01日 03:43
  • 129

Multiple Column Dropdownlist for the ASP.NET DataGrid

Image showing when a control is added to EditItemTemplate.IntroductionBased on my previous control "...
  • steven_chr
  • steven_chr
  • 2006年06月23日 16:00
  • 1411

DataGrid 多选属性allowMultipleSelection

                       在多选的时候按Ctrl+点击实现多行选取
  • faith_zerg
  • faith_zerg
  • 2007年11月03日 16:14
  • 4066

如何实现在DataGrid中实现DropDownList控件的联动

在C#中,DATAGRID控件的是数据绑定类控件的一个好东东,这其中的奥秘就在于它支持多种样式,而且还能和c#中其他控件实现联动,如下例子:前台代码:                         ...
  • stone0419
  • stone0419
  • 2007年10月04日 22:45
  • 1152

ASP.NET MVC DropdownList 使用

ASP.NET MVC 使用Html Helper的形式实现UI控件,里面有一个非常重要的下拉列表控件-DropdownList。这个控件使用还是比较灵活的,今天总结了一下。 1.View @us...
  • afandaafandaafanda
  • afandaafandaafanda
  • 2015年06月08日 16:32
  • 749

Datagrid Bind DropDownlist.....

 DataGrid 中绑定Dropdownlist Menu_Init.ascx.vb 前台页面@ Control Language="VB" AutoEventWireup="false" Code...
  • zwxrain
  • zwxrain
  • 2008年02月11日 15:13
  • 1052

Cannot have multiple items selected in a DropDownList

有时,当我们试图指定一个ASP.NET Dropdownlist选中的项目时遇到这样的报错”Cannot have multiple items selected in a DropDownList....
  • wwlearn
  • wwlearn
  • 2010年04月24日 12:36
  • 1524

如何在datagrid中用dropdownlist显示当前行的记录

如何在datagrid中用dropdownlist显示当前行的记录
  • gonnd334
  • gonnd334
  • 2004年09月07日 23:03
  • 771
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:Multiple selection using DropDownList in DataGrid
举报原因:
原因补充:

(最多只允许输入30个字)