Press "Enter" to skip to content

A Javascript Autocomplete Library For Bootstrap | autocompleteBS

autocompleteBS is a simple and configurable JavaScript library for auto-complete built specifically for the latest Bootstrap 5 framework.

The goal of this library is to make it easy to add autocomplete functions to bootstrap projects. So far, not much effort has been put into making the library cross-browser compatible but it uses Vanilla JS to remove any dependencies on any other JavaScript libraries.

jquery autocomplete dropdown, easy autocomplete theme, jquery autocomplete example, autocomplete autofill jquery, jquery autocomplete ajax

How to make use of it:

1. Load the autocompleteBS.css and autocompleteBS.js in your Bootstrap 5 undertaking.

<!-- Bootstrap 5 Framework -->
<link rel="stylesheet" href="/path/to/cdn/bootstrap.min.css" />
<script src="/path/to/cdn/bootstrap.bundle.min.js"></script>
<!-- autocompleteBS fikes -->
<link rel="stylesheet" href="/path/to/css/autocompleteBS.css" />
<script src="/path/to/js/autocompleteBS.js"></script>

2. Enable the autocomplete performance on an input discipline.

<input type="text" class="form-control" id="inputText" />
autocompleteBS({
  name: 'Select A Country by Name',
  inputSource: document.getElementById('inputText'),
  fetchURL: 'https://restcountries.eu/rest/v2/capital/{term}',
  fetchMap: {
    id: "alpha2Code",
    name: "name"
  }
});

3. Output the result in one other input discipline.

autocompleteBS({
  inputSource: document.getElementById('inputText'),
  targetID: document.getElementById('anotherInput'),
});

4. Set the minimal variety of characters to set off the autocomplete.

autocompleteBS({
  minLength: 2
});

5. Set the utmost variety of results displayed within the suggestion listing.

autocompleteBS({
  maxResults: 10
});

Easy Autocomplete Library For Bootstrap 5, autocomplete BS Plugin/Github, bootstrap autocomplete, easy autocomplete, jquery autocomplete with json data source


See Demo And Download

Official Website(kanine): Click Here

This superior jQuery/javascript plugin is developed by kanine. For extra Advanced Usages, please go to the official website.

Be First to Comment

    Leave a Reply

    Your email address will not be published.