Create Editable DropDownList in ASP.NET MVC

Last Reply one year ago By dharmendr

Posted one year ago

Hello everyone, I currently have a dropdownlist pulling values from a SQL Server table. I want the user to be able to pull the values and/or to be able to add or edit the values they selected. I was hoping to have an editable dropdownlist as I feel this would be the best option to do so. I created a dropdownlist control but its currently just the same as my normal dropdownlist. I been searching online but sofar I haven’t found one. I was thinking maybe a Razor HTML Helper control? What does every1 feel would be the best to do this? (As a last resort I could use Ajax) but I would really like an editable dropdown if I could get this to work.

@Html.DropDownListFor(x => x.Description, (IEnumerable<SelectListItem>) ViewBag.DescriptionDDL,"", new { @class = "form-control" })
@Html.ValidationMessageFor(x => x.Description, "",new { @class = "text-danger" })

// Here is my dropdown control I built that is just a normal dropdown so far /* Custom Editable DropDownList Control */
        public static MvcHtmlString CustomDropDown<TModel, TValue>(this HtmlHelper<TModel> html, Expression<Func<TModel, TValue>> expression, 
            List<string> names, object htmlAttributes)
            var fieldName = ExpressionHelper.GetExpressionText(expression);
            var fullbindingName = html.ViewContext.ViewData.TemplateInfo.GetFullHtmlFieldName(fieldName);
            var fieldId = TagBuilder.CreateSanitizedId(fullbindingName);
            var metaData = ModelMetadata.FromLambdaExpression(expression, html.ViewData);
            var value = metaData.Model;

            TagBuilder tagBuilder = new TagBuilder("select");
            tagBuilder.Attributes.Add("name", fullbindingName);
            tagBuilder.Attributes.Add("id", fieldId);

            StringBuilder options = new StringBuilder();
            options.AppendLine("<option value='0' > Select </option>");
            for(int i=0; i<names.Count; i++)
                string singleOption = "<option value = '" + names[i].ToString() + "'>" + names[i].ToString() + "</options>";
            tagBuilder.InnerHtml = options.ToString();

            foreach(PropertyDescriptor prop in TypeDescriptor.GetProperties(htmlAttributes))
                tagBuilder.MergeAttribute(prop.Name.Replace('_', '-'), prop.GetValue(htmlAttributes).ToString(), true);
            return new MvcHtmlString(tagBuilder.ToString());


You are viewing reply posted by: dharmendr one year ago.
Posted one year ago

Hi bigbear,

You have to use jQuery AutoComplete plugin.

Refer below article.

Implement jQuery AutoComplete DropDown (ComboBox) in ASP.Net MVC