donejs-typeahead

0.6.0 • Public • Published

Bootstrap typeahead for donejs

Build Status

Usage (donejs)

Install / Configure

  1. npm install donejs-typeahead --save

  2. import it within your stache file, for instance index.stache <can-import from="donejs-typeahead/" />

  3. insert it using the options you need

    <donejs-typeahead
      debug=true 
      remote-path="/developers" 
      suggestion-template='<div class="donejs-typeahead-suggestion donejs-typeahead-selectable"><span class="test-1">[[name]]</span> / [[github]]</div>' 
      display-value="name" 
      search-value="github" 
      remote-host="donejs-typeahead-backend-zqqnzgjjre.now.sh" 
      remote-protocol="https://"  
      remote-port="443"
      {(selected-element-value)}="global-variable"/>
    
1. You'll need an API server (@todo: provide a step by step guide for this, probably using feathersjs)
1. You can use `debug=true` to make things easier (actually setting debug to any value will do it)
1. Set the correct name for `your-variable` in order to create a two way binding with your viewmodel. If you want to set the binding using an object use `{(selected-element-object)}="your-variable"`

Remember to start the server using `donejs develop`

### Try it

[http://localhost:8080/src/donejs-typeahead.html](http://localhost:8080/src/donejs-typeahead.html)


### Test it
1. You can either run the tests: [http://localhost:8080/test/test.html](http://localhost:8080/test/test.html)
1. or run the automated tests (no need to start the server)

## Typeahead

- Typeahead project: [http://twitter.github.io/typeahead.js](http://twitter.github.io/typeahead.js)
- Typeahead project samples: [http://twitter.github.io/typeahead.js/examples/](http://twitter.github.io/typeahead.js/examples/)




## Usage (dist)

### ES6 use

With StealJS, you can import this module directly in a template that is autorendered:

```js
import plugin from 'donejs-typeahead';

CommonJS use

Use require to load donejs-typeahead and everything else needed to create a template that uses donejs-typeahead:

var plugin = require("donejs-typeahead");

AMD use

Configure the can and jquery paths and the donejs-typeahead package:

<script src="require.js"></script>
<script>
    require.config({
        paths: {
            "jquery": "node_modules/jquery/dist/jquery",
            "can": "node_modules/canjs/dist/amd/can"
        },
        packages: [{
             name: 'donejs-typeahead',
             location: 'node_modules/donejs-typeahead/dist/amd',
             main: 'lib/donejs-typeahead'
        }]
    });
    require(["main-amd"], function(){});
</script> 

Standalone use

Load the global version of the plugin:

<script src='./node_modules/donejs-typeahead/dist/global/donejs-typeahead.js'></script>

Contributing

Making a Build

To make a build of the distributables into dist/ in the cloned repository run

npm install
node build

Running the tests

Tests can run in the browser by opening a webserver and visiting the test.html page. Automated tests that run the tests from the command line in Firefox can be run with

npm test

Dependents (0)

Package Sidebar

Install

npm i donejs-typeahead

Weekly Downloads

11

Version

0.6.0

License

none

Last publish

Collaborators

  • nicoriesco