Searchbar in dropdwn RSS

• • Reply
  umang_gupta

  None

  0 Points

  1 Post

  Searchbar in dropdwn

  May 28, 2020 07:24 AM|umang_gupta|LINK

  I am giving option of searchoption in dropdown using select2 but this disturb the allignment of page.Can you please help me to achieve searchbar in dropdown without disturbing allignment of page using this method  or any alternate method?

  <link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.4/css/select2.min.css" rel="stylesheet" />
  <script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.4/js/select2.min.js"></script> 

  <script>
  $(document).ready(function () {
  $("#<%=ddlLocationAsset.ClientID %>").select2();
  });
  </script>

  <div class="panel-body">
  <div class="row">
  <div class="col-md-4">

  <asp:DropDownList ID="ddlLocationAsset" runat="server" CssClass="input-sm form-control" AppendDataBoundItems="True" EnableFilterSearch="true" FilterType="StartsWith">
  <asp:ListItem Value="-1">--Select--</asp:ListItem>
  </asp:DropDownList>

  </div>

  </div>

  </div>

• • Reply
  samwu

  Contributor

  3370 Points

  1409 Posts

  Re: Searchbar in dropdwn

  May 28, 2020 10:12 AM|samwu|LINK

  Hi umang_gupta,

  umang_gupta

  I am giving option of searchoption in dropdown using select2 but this disturb the allignment of page.Can you please help me to achieve searchbar in dropdown without disturbing allignment of page using this method  or any alternate method?

  Can you tell me what style you want to set your Dropdownlist to? 

  You can change it style by css.

  

  Best regards,

  Sam

  IIS.NET forums are moving to a new home on Microsoft Q&A, we encourage you to go to Microsoft Q&A for .NET for posting new questions and get involved today. Learn more >
• • Reply
  yogyogi

  Participant

  1253 Points

  943 Posts

  Re: Searchbar in dropdwn

  Jun 01, 2020 05:56 AM|yogyogi|LINK

  When you use the jQuery Select2 plugin then you give some css for it's width to preserve the alignment like given below:

  <asp:DropDownList ID="ddlLocationAsset" runat="server" CssClass="input-sm form-control" AppendDataBoundItems="True" EnableFilterSearch="true" FilterType="StartsWith">
  <asp:ListItem Value="-1">--Select--</asp:ListItem>
  </asp:DropDownList>
  
  #input-sm form-control {
      width: 300px;
  }

  Helping you always. Don't forget to click "Mark as Answer" on the post that helped you.
  ♠ ASP.NET Core Tutorials → Start from the Beginning and become an Expert in 30 days time ♠