Editable dropdown box in ASP.NetMVC

May 19, 2023

I have asp.net MVC .Net core 6 project. I need editable dropdown box in one of the view. I tried datalist & javascript autocomplete functionality but both of them not working. My code in view is :

  <input type="text" name="medCompany" id="medCompany" list="ddlmedCompany" class="form-control form-control-lg" />
 <datalist id="ddlmedCompany" class="form-control form-control-lg" >
        @foreach (var item in Model.lstmedCompany)
         {
           <option>@item.Text</option>
          }
   </datalist>

But this gives look as below :

and dropdwon box is :

What I need is only dropdown box and not test box which is displayed below dropdown box. How can I achieve this.

>Solution :

Try to remove class="form-control form-control-lg" from datalist

  <input type="text" name="medCompany" id="medCompany" list="ddlmedCompany"  class="form-control form-control-lg" />
 <datalist id="ddlmedCompany"  >
        @foreach (var item in Model.lstmedCompany)
         {
           <option>@item.Text</option>
          }
   </datalist>