Bootstrap BoxAutocomplete Selector plugin By Oleksiy

BoxAutocomplete Selector is a jQuery/Bootstrap plugin which allow you to build some awesome data selectors and link it to your inputs.


Options

Possible options :

            $('index#selector').boxautocomplete({
              data: [],
              dataUrl: false, // If set to an URL, the data is ignored and the plugin is getting the data form the given URL with AJAX
              valueFormat: 'text', // text|json
              delemiter: ";", // In case the format is text
              hideInput: true, // Hides the input of the selector
              search: false, // Display the search bar
              searchPlaceholder: "Search for an element...",
              searchButtonText: "Clear",
              searchMin: 1, // The min amount of leters before the search is launched
            });
          

Get started

Include the CSS files:

            https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css
            https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css
            bootstrap-boxautocomplete.css
          
Include the JS files:
            https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js
            https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js
            boxautocomplete.jquery.js
          

Exemple 1 Basic

Exemple 2 With search input and JSON value format

Exemple 3 With ajax data