DailyJS

jQuery Roundup: jquery-expander, Marco Polo, Manifest, CacheProvider

Alex R. Young

Subscribe

@dailyjs

Facebook

Google+

jquery ui plugins localStorage

jQuery Roundup: jquery-expander, Marco Polo, Manifest, CacheProvider

Posted by Alex R. Young on .
Featured

jquery ui plugins localStorage

jQuery Roundup: jquery-expander, Marco Polo, Manifest, CacheProvider

Posted by Alex R. Young on .
Note: You can send your plugins and articles in for review through our [contact form](/contact.html) or [@dailyjs](http://twitter.com/dailyjs).

jquery-expander

The Expander Plugin (License: MIT and GPL) by Karl Swedberg can collapse part of an element's content and add 'read more' links. Truncation is based on
characters, and this can be changed along with many other things when
invoking the plugin:

$(selector).expander({
  slicePoint: 100
, preserveWords: true
, expandText: 'read more'
, expandPrefix: '… '
});

Marco Polo

Marco Polo (License: MIT, demo) by Justin Stayton is an autocomplete plugin with some interesting features:

  • Prevents unnecessary requests using a cache
  • Automatic selection, in a similar fashion to select inputs
  • Require selections
  • Supports large text through overlabel support
  • Easy styling
  • Event-based, with public access

These features are documented in the Marco Polo
wiki
. This simple
example demonstrates how results can be obtained and formatted:

$('#userSearch').marcoPolo({
  url: '/users/search',
  formatItem: function(data, $item) {
    return data.first_name + ' ' + data.last_name;
  },
  onSelect: function(data, $item) {
    window.location = data.profile_url;
  }
});

Manifest

Manifest (License: MIT, examples) also by Justin Stayton enhances text inputs so multiple items can be selected and
edited. The API is very consistent with Marco Polo, and Manifest can
take a marcoPolo object if autocomplete functionality is
required.

$('#recipients').manifest({
  marcoPolo: {
    url: '/contacts/search',
    formatItem: function(data) {
      return '"' + data.name + '" (' + data.email + ')';
    }
  }
});

The author also points out how these plugins differ from the popular
Chosen plugin:

If you want to make a select element with a lot of options more user-friendly, use Chosen. If you can't reasonably list out every possible option (like all users in a system), or you need to allow arbitrary values (like new tags), use Manifest.

CacheProvider

Felipe Abreu sent us a client-side caching library called
CacheProvider (License: MIT). He hasn't yet written a README, but the most of the methods in the CacheProvider
source

are nicely commented so it's easy to follow how it works.

It's a continuation of the JavaScript Cache
Provider
class by
Dustin Diaz. Like Diaz's class, CacheProvider will use
localStorage if available.