Steve Fenton

Jquery Two Sided Multi Selector

Quick Links

Visit the jQuery Two-Sided Multi-Selector project hub, which has a demonstration and download for this plugin on JS Plugins JavaScript Plugin Library.

Two-Sided Multi-Selector Demonstration.

Description

The jQuery Two-Sided Multi-Selector project is a plugin for the jQuery JavaScript Framework, which converts a multi-select select-list into a two-sided list, where the selected options can be moved from the left list into the right list and back again.

If you find my open source projects and jQuery plugins useful,
please consider making a donation!

Requirements

• jquery.js
• jquery.twosidedmultiselector.js

CSS

/* Recommended styles */
		.tsmsselect {
			width: 40%;
			float: left;
		}
		
		.tsmsselect select {
			width: 100%;
		}
		
		.tsmsoptions {
			width: 20%;
			float: left;
		}
		
		.tsmsoptions p {
			margin: 2px;
			text-align: center;
			font-size: larger;
			cursor: pointer;
		}
		
		.tsmsoptions p:hover {
			color: White;
			background-color: Silver;
		}

JavaScript

$(".multiselect").twosidedmultiselect();

You Are Here: Home » JavaScript » Two Sided Multi Selector