Checked dropdownlist

Soyez le premier à donner votre avis sur cette source.

Vue 12 924 fois - Téléchargée 2 554 fois

Télécharger le projet
Commenter

Description

Voici une liste deroulante de cases à cocher

webcontrol dérivant de composite control

le code javascript, les images et les css sont inclus dans la dll

Source / Exemple : 


namespace WebControlLibrary1
{
    using System;
    using System.Collections.Generic;
    using System.ComponentModel;
    using System.Text;
    using System.Web.UI;
    using System.Web.UI.WebControls;

    [ToolboxData("<{0}:CheckedDropDownList runat=server></{0}:CheckedDropDownList>")]
    public class CheckedDropDownList : CompositeControl
    {
        #region private Members

        private string _ImageUrl;

        protected System.Web.UI.HtmlControls.HtmlGenericControl _divCustomCheckBoxList;

        protected System.Web.UI.HtmlControls.HtmlInputText _txtSelectedMLValues;

        protected System.Web.UI.HtmlControls.HtmlImage _imgShowHide;

        protected System.Web.UI.HtmlControls.HtmlGenericControl _divCheckBoxList;

        protected System.Web.UI.HtmlControls.HtmlTable _table;

        protected CheckBoxList _lstMultipleValues = new CheckBoxList();

        protected int _width = -1;

        protected int _timeoutBeforeHide = 200;

        private string _css;
        #endregion private Members

        #region Public mermbers
        [Category("Appearance")]
        [Description("css du control")]
        [Browsable(true)]
        public string CssClass
        {
            get
            {
                return _css;
            }
            set
            {
                _css = value;
            }
        }

        [Category("Appearance")]
        [Description("path de l'image represantant la fleche de la ddl")]
        [Browsable(true)]
        public string ImageUrl
        {
            get
            {
                return _ImageUrl;
            }
            set
            {
                _ImageUrl = value;
            }
        }

        /// <summary>
        /// Collection d'items de la CheckedDropDownList
        /// </summary>
        /// <returns></returns>
        public ListItemCollection Items
        {
            get
            {
                return _lstMultipleValues.Items;
            }
        }
        
        /// <summary>
        /// Largeur du control
        /// </summary>
        [Category("Appearance")]
        [Description("Largeur du control")]
        [Browsable(true)]
        public int Width
        {
            get
            {
                return _width;
            }
            set
            {
                _width = value;
            }
        }

        
        [Category("Appearance")]
        [Description("Timeout avant de cacher la liste lorsque la souris n'est plus dessus")]
        [Browsable(true)]
        public int TimeoutBeforeHide
        {
            get
            {
                return _timeoutBeforeHide;
            }
            set
            {
                _timeoutBeforeHide = value;
            }
        }

        #endregion Public mermbers

        protected override void OnInit(EventArgs e)
        {
            base.OnInit(e);
            
            _divCustomCheckBoxList = new System.Web.UI.HtmlControls.HtmlGenericControl();
            _txtSelectedMLValues = new System.Web.UI.HtmlControls.HtmlInputText();
            _imgShowHide = new System.Web.UI.HtmlControls.HtmlImage();
            _divCheckBoxList = new System.Web.UI.HtmlControls.HtmlGenericControl();
            _table = new System.Web.UI.HtmlControls.HtmlTable();
            // setting name for textbox. using t just to concat with this.ID for uniqueName
            _divCustomCheckBoxList.ID = this.ID + "d";
            _txtSelectedMLValues.ID = this.ID + "t";
            _imgShowHide.ID = this.ID + "i";
            _divCheckBoxList.ID = this.ID + "dd";
            _lstMultipleValues.ID = this.ID + "chk";

            // For Image
            // setting alternative name for image
            _imgShowHide.Alt = "imageURL";
            if (!string.IsNullOrEmpty(_ImageUrl))
                _imgShowHide.Src = _ImageUrl;
            else
            {
                _imgShowHide.Src = Page.ClientScript.GetWebResourceUrl(this.GetType(), "WebControlLibrary1.Images.drop.gif");
            }

            _divCheckBoxList.Controls.Add(_lstMultipleValues);
            System.Web.UI.HtmlControls.HtmlTableRow row = new System.Web.UI.HtmlControls.HtmlTableRow();
            System.Web.UI.HtmlControls.HtmlTableRow row2 = new System.Web.UI.HtmlControls.HtmlTableRow();
            System.Web.UI.HtmlControls.HtmlTableCell cel1 = new System.Web.UI.HtmlControls.HtmlTableCell();
            System.Web.UI.HtmlControls.HtmlTableCell cel2 = new System.Web.UI.HtmlControls.HtmlTableCell();
            System.Web.UI.HtmlControls.HtmlTableCell cel3 = new System.Web.UI.HtmlControls.HtmlTableCell();
            cel1.Attributes.Add("class", "DropDownLook");
            cel1.Controls.Add(_txtSelectedMLValues);
            cel2.Attributes.Add("class", "DropDownLook");
            cel2.Controls.Add(_imgShowHide);
            cel3.ColSpan = 2;
            cel2.Attributes.Add("class", "DropDownLook");
            cel3.Controls.Add(_divCheckBoxList);
            row.Controls.Add(cel1);
            row.Controls.Add(cel2);
            row2.Controls.Add(cel3);
            _table.Controls.Add(row);
            _table.Controls.Add(row2);
            _lstMultipleValues.Attributes.Add("class", "CheckBoxList");
            _lstMultipleValues.Width = _width == -1 ? 250 : _width;
            _txtSelectedMLValues.Style.Add("width", _width == -1 ? "230px" : (_width - 25).ToString() + "px");
            _lstMultipleValues.EnableViewState = true;
            _lstMultipleValues.Attributes.Add("class", "DivCheckBoxList");
            _divCustomCheckBoxList.Controls.Add(_table);
        }

        /// <summary>
        /// Registers client script for generating postback events prior to rendering on the client, if <see cref="P:System.Web.UI.WebControls.TextBox.AutoPostBack"/> is true.
        /// </summary>
        /// <param name="e">An <see cref="T:System.EventArgs"/> that contains the event data.</param>
        protected override void OnPreRender(EventArgs e)
        {
            string scriptName = "CheckedDropDownList";
            if (!Page.ClientScript.IsClientScriptBlockRegistered(scriptName))
            {
                string jsCheckedDropDownListFileName = "CheckedDropDownList.js";

                StringBuilder scriptBuilder = new StringBuilder();
                scriptBuilder.AppendFormat("var lstMultipleValuesId = '{0}_{1}';", this.ID, _lstMultipleValues.ID);
                Page.ClientScript.RegisterStartupScript(this.GetType(), "Columns", scriptBuilder.ToString(), true);

                 
                //double click on text box
                _divCustomCheckBoxList.Attributes.Add("onmouseover", "clearTimeout(timoutID);");//  
                _divCustomCheckBoxList.Attributes.Add("onmouseout", string.Format("timoutID = setTimeout('HideMList()', {0});", _timeoutBeforeHide));
                _txtSelectedMLValues.Attributes.Add("onclick", string.Format("ShowMList('{0}_{1}');", this.ID, _lstMultipleValues.ID));
                _imgShowHide.Attributes.Add("onclick", string.Format("ShowMList('{0}_{1}');", this.ID, _lstMultipleValues.ID));
                _lstMultipleValues.Attributes.Add("onclick", "FindSelectedItems(this," + _txtSelectedMLValues.ClientID + ");");
                //ajouter le javascript verifier qu'il est bien en mode incorpore dans les roprietes du fichier
                //et qu il soit present dans l'assembly info
                this.Page.ClientScript.RegisterClientScriptInclude(
                this.GetType(), "Tes1t",
                Page.ClientScript.GetWebResourceUrl(this.GetType(),
                string.Format("WebControlLibrary1.Javascripts.{0}", jsCheckedDropDownListFileName)));

                // create the style sheet control
                // and put it in the document header
                string csslink = "";

                if (string.IsNullOrEmpty(csslink))
                {
                    csslink = "<link href='" +
                       Page.ClientScript.GetWebResourceUrl(this.GetType(),
                        "WebControlLibrary1.Css.CheckedDropDownList.css")
                       + "' rel='stylesheet' type='text/css' />";
                }
                else
                {
                    csslink = "<link href='" + _css + "' rel='stylesheet' type='text/css' />";
                }
                LiteralControl include = new LiteralControl(csslink);
                this.Page.Header.Controls.Add(include);
            }

            base.OnPreRender(e);
        }

        /// <summary>
        /// adding child controls to composite control
        /// </summary>
        protected override void CreateChildControls()
        {

            this.Controls.Add(_divCustomCheckBoxList);
            base.CreateChildControls();

            //necessaire pour conserver les items au post back
            if (_lstMultipleValues.Items.Count > 0)
            {
                SerializableListItemCollection coll = new SerializableListItemCollection(_lstMultipleValues.Items);
                ViewState[this.ID + "Items"] = coll;
            }
            else
            {
                if (ViewState[this.ID + "Items"] != null)
                {
                    SerializableListItemCollection lst = (SerializableListItemCollection)ViewState[this.ID + "Items"];

                    foreach (string key in lst.Items.Keys)
                        _lstMultipleValues.Items.Add(new ListItem(key, lst.Items[key]));
                }
            }
        }

        /// <summary>
        /// Get the id of the control rendered on client side
        /// Very essential for Javascript Calendar scripts to locate the textbox
        /// </summary>
        /// <returns></returns>
        public string getClientID()
        {
            return base.ClientID;
        }

        /// <summary>
        /// Add datasource to checked list
        /// </summary>
        /// <param name="o"></param>
        public void SetMultiValue(object o)
        {
            _lstMultipleValues.DataSource = o;
            _lstMultipleValues.DataTextField = "Label";
            _lstMultipleValues.DataValueField = "Value";

            _lstMultipleValues.DataBind();
        }
    }

    [Serializable]
    public class SerializableListItemCollection
    {
        public Dictionary<string, string> Items;
        public SerializableListItemCollection(ListItemCollection coll)
        {
            Items = new Dictionary<string, string>();
            foreach (ListItem item in coll)
                Items.Add(item.Text, item.Value);
        }
    }
}

javascript :

var timoutID = 200;
function ShowMList(id) {
    var divRef = document.getElementById(id);
    if (divRef != null)
        divRef.style.display = "block";
}

function HideMList(id) {
    var divRef = document.getElementById(id);
    if(divRef != null)
        divRef.style.display = "none";
}

function HideMList() {
var ctrl = document.getElementById(lstMultipleValuesId)
if (ctrl != null)
        ctrl.style.display = "none";
    
}

function FindSelectedItems(sender, textBoxID) {
    var cblstTable = document.getElementById(sender.id);
    var checkBoxPrefix = sender.id + "_";
    var noOfOptions = cblstTable.rows.length;
    var selectedText = "";
    for (i = 0; i < noOfOptions; ++i) {
        if (document.getElementById(checkBoxPrefix + i).checked) {
            if (selectedText == "")
                selectedText = document.getElementById(checkBoxPrefix + i).parentNode.innerText;
            else
                selectedText = selectedText + "," + document.getElementById(checkBoxPrefix + i).parentNode.innerText;
        }
    }
    document.getElementById(textBoxID.id).value = selectedText;
}
Télécharger le projet

Codes Sources

A voir également

S'inscrire maintenant

Vous n'êtes pas encore membre ?

inscrivez-vous, c'est gratuit et ça prend moins d'une minute !

Les membres obtiennent plus de réponses que les utilisateurs anonymes.

Le fait d'être membre vous permet d'avoir un suivi détaillé de vos demandes et codes sources.

Le fait d'être membre vous permet d'avoir des options supplémentaires.

Du même auteur (cs_fredzool)