Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
A jquery plugin that turns multiselect fields into a field of checkboxes.
JavaScript
branch: gh-pages

This branch is even with gh-pages

Fetching latest commit…

Cannot retrieve the latest commit at this time

Failed to load latest commit information.
css
img
js
src
README.md
index.html

README.md

Checkbox-field

This is a simple javascript thing for turning awkward multiselects into something users can understand and you can work with.

It depends on Backbone, Handlebars and jQuery.

You can see it in action over here: http://swizec.github.com/checkbox-field/

Installation

  • Get the source
  • Add Backbone -> http://backbonejs.org/
  • Add Handlebars -> http://handlebarsjs.com/
  • Add a template for checkboxes

    <div id="checkbox-template" style="display:none">
      <div style="display:inline-block">
        <input type="checkbox" id="checkbox_{{id}}" />
        <label for="checkbox_{{id}}">{{label}}</label>
      </div>
    </div>
    
  • You're done!

Usage

$("#my_selector").checkboxField();

// there are also some options
$("#my_selector").checkboxField({
    // a handlebars template for the checkboxes (default: #checkbox-template)
    template: "#checkbox-template",

    // placeholder for checkboxes (default: one is created)
    checkboxes: null,

    // hide the original multiselect or not (default: yup)
    hide: true

    // display "select all" (default: true)
    show_select_all: true

    // labels for select_all control
    select_all: "Select all",
    deselect_all: "Deselect all"
});
Something went wrong with that request. Please try again.