Click here to Skip to main content
13,140,591 members (48,843 online)
Click here to Skip to main content

Stats

218.2K views
6.2K downloads
168 bookmarked
Posted 25 Sep 2008

Multiselect Dropdown for Web Applications

, 17 Dec 2008
How to select multiple values from 'a dropdown look & feel' in a Web application
MultiSelectDropDownEx
App_Data
drop.gif
MultiSelectDropDownEx.suo
using System;
using System.Data;
using System.Configuration;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;

public partial class _Default : System.Web.UI.Page 
{
    protected void Page_Load(object sender, EventArgs e)
    {
        if (!IsPostBack)
        {
            lstMultipleValues.Attributes.Add("onclick", "FindSelectedItems(this," + txtSelectedMLValues.ClientID + ");");
            SetMultiValue();
            lblDescription.Text = "On click of dropdown, the multi select option will appear.<br /> Once you remove focus from the dropdown"
            + " area it will get auto collapsed. <br />In case needed, you can go ahead and close it with the close ('X') provided at the bottom.<br />";
        }
    }

    protected void SetMultiValue()
    {
        DataTable dt = new DataTable("Table1");
        
        DataColumn dc1 = new DataColumn("Text");
        DataColumn dc2 = new DataColumn("Value");
        dt.Columns.Add(dc1);
        dt.Columns.Add(dc2);

        //To get enough data for scroll
        dt.Rows.Add("Bangalore", 1);
        dt.Rows.Add("Kolkata", 2);
        dt.Rows.Add("Pune", 3);
        dt.Rows.Add("Mumbai", 4);
        dt.Rows.Add("Noida", 5);
        dt.Rows.Add("Gurgaon", 6);
        dt.Rows.Add("Hyderabad", 7);
        dt.Rows.Add("Chennai", 8);
        dt.Rows.Add("Jaipur", 8);
        dt.Rows.Add("Patna", 8);
        dt.Rows.Add("Ranchi", 8);

        lstMultipleValues.DataSource = dt;
        lstMultipleValues.DataTextField = "Text";
        lstMultipleValues.DataValueField = "Value";
        lstMultipleValues.DataBind();
    }

    protected void btnSubmit_Click(object sender, EventArgs e)
    {
        // Text showed that were selected
        lblTextSelected.Text = "Submitted Values: " + txtSelectedMLValues.Value;

        // One can loop through the checkboxlist control to get the Values too for the text selected if required.
    }
}

By viewing downloads associated with this article you agree to the Terms of Service and the article's licence.

If a file you wish to view isn't highlighted, and is a text file (not binary), please let us know and we'll add colourisation support for it.

License

This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

Share

About the Author

Sandeep Mewara
Software Developer (Senior)
India India
Current location: Bangalore, India.

You may also be interested in...

Pro
Pro
Permalink | Advertise | Privacy | Terms of Use | Mobile
Web04 | 2.8.170915.1 | Last Updated 17 Dec 2008
Article Copyright 2008 by Sandeep Mewara
Everything else Copyright © CodeProject, 1999-2017
Layout: fixed | fluid