Skip to content

Latest commit

 

History

History
127 lines (81 loc) · 4.25 KB

README.md

File metadata and controls

127 lines (81 loc) · 4.25 KB
Raw

jQuery Autocomplete Light Build Status Bower Version

Usage

  1. Include jQuery:

    <script src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>

  2. Include plugin's code:

    <script src="dist/jquery.autocomplete-light.min.js"></script>

  3. Call the plugin:

    $('#navigation_autocomplete').yourlabsAutocomplete({
    url: '/autocomplete/',
    choiceSelector: 'a',
}).input.bind('selectChoice', function(e, choice, autocomplete) {
    document.location.href = choice.attr('href');
});

Structure

The basic structure of the project is given in the following way:

├── demo/
│   └── index.html
├── dist/
│   ├── jquery.autocomplete-light.js
│   └── jquery.autocomplete-light.min.js
├── src/
│   ├── jquery.autocomplete-light.coffee
│   └── jquery.autocomplete-light.js
├── .editorconfig
├── .gitignore
├── .jshintrc
├── .travis.yml
├── autocomplete-light.jquery.json
├── Gruntfile.js
└── package.json

demo/

Contains a simple HTML file to demonstrate your plugin.

dist/

This is where the generated files are stored once Grunt runs.

src/

Contains the files responsible for your plugin, you can choose between JavaScript or CoffeeScript.

.editorconfig

This file is for unifying the coding style for different editors and IDEs.

Check editorconfig.org if you haven't heard about this project yet.

.gitignore

List of files that we don't want Git to track.

Check this Git Ignoring Files Guide for more details.

.jshintrc

List of rules used by JSHint to detect errors and potential problems in JavaScript.

Check jshint.com if you haven't heard about this project yet.

.travis.yml

Definitions for continous integration using Travis.

Check travis-ci.org if you haven't heard about this project yet.

autocomplete-light.jquery.json

Package manifest file used to publish plugins in jQuery Plugin Registry.

Check this Package Manifest Guide for more details.

Gruntfile.js

Contains all automated tasks using Grunt.

Check gruntjs.com if you haven't heard about this project yet.

package.json

Specify all dependencies loaded via Node.JS.

Check NPM for more details.

Guides

How did we get here?

I wanted a really simple autocomplete plugin, here's why this script is simpler than the others:

  • server-side rendering, use your favorite server-side framework, tell autocomplete what elements are choices by passing a choiceSelector on instanciation,
  • autocomplete and widget are loosely coupled, allowing to use only the autocomplete script for anything and implement your own logic by binding selectChoice,

I love this script because it never really gets in my way thanks to its simplicity which is an initial requirement.

Contributing

Check CONTRIBUTING.md for more information.

License

MIT