View Full Version : [CLOSED] How to create Multicombo with textbox inside

Jan 16, 2014, 8:23 AM
Hi ,

We have requirement in our application for a control which should be multicombo with textbox inside multicombo.
Please see below image
We want to type value in a textbox and save against selected value from multicombo.
To meet above requirement, I have implemented following.

MultiComboView :

ViewBag.Title = "MutiCombo with TextBox inside for each value";

@model System.Collections.IEnumerable

.search-item {
font : normal 11px tahoma, arial, helvetica, sans-serif;
padding : 3px 10px 3px 10px;
border : 1px solid #fff;
border-bottom : 1px solid #eeeeee;
white-space : normal;
color : #555;

.search-item h3 {
display : block;
font : inherit;
font-weight : bold;
color : #222;
margin :0px;

.search-item h3 span {
float : right;
font-weight : normal;
margin : 0 0 5px 5px;
width : 100px;
display : block;
clear : none;

p { width: 650px; }

.ext-ie .x-form-text { position : static !important; }

<h1>ComboBox with Templates and AJAX</h1>

<p>This is a more advanced example demonstrating how to combine Store Paging and a Template to create "live search" functionality.</p>

<div style="width:600px;">
<div class="x-box-tl"><div class="x-box-tr"><div class="x-box-tc"></div></div></div>
<div class="x-box-ml"><div class="x-box-mr"><div class="x-box-mc">
<h3 style="margin-bottom:5px;">Search the plants</h3>
.Html(@<text><div><span>{Name}</span></div></text>+"<tpl for='.'><li></li></tpl><input type='number' value='' id='textbox_{ID}'></input>")
.ActionMethods(am => am.Read = HttpMethod.POST)
<div style="padding-top:4px;">

<div class="x-box-bl"><div class="x-box-br"><div class="x-box-bc"></div></div></div>

Controller :

#region multicombo with Text box inside example
public ActionResult MutiComboTextBox()
return View();
public ActionResult GetPlants()
List<CommonDTO> Plants = new List<CommonDTO>()
new CommonDTO {Name = "Botonical" ,ID= 1},
new CommonDTO {Name = "Common" ,ID= 2},
new CommonDTO {Name = "Small plants" ,ID= 3},
new CommonDTO {Name = "Bigger" ,ID= 4}
return this.Store(Plants);

CommonDTO (Model) :

public class CommonDTO
public int ID { get; set; }

public string Name { get; set; }

Please provide us a solution for such type of control.
Any guidance will be appreciated.


Jan 16, 2014, 12:53 PM
Hi @alscg,

Not a simple task...

Please provide us a solution for such type of control.

We don't have such a control and functionality.

Any guidance will be appreciated.

We would be happy to help. But could you, please, formulate a concrete question? Well, your sample looks good. What are you going to do next?