Permalink
Browse files

added search capabilities and more ...

  • Loading branch information...
1 parent f3f3364 commit bb31dbbb2cd93bddefceac466571dbd9e8369c05 Michael Aufreiter committed May 5, 2009
View
@@ -1,9 +1,4 @@
-Copyright (c) 2008 Paul Bakaus, http://ui.jquery.com/
-
-This software consists of voluntary contributions made by many
-individuals (AUTHORS.txt, http://ui.jquery.com/about) For exact
-contribution history, see the revision history and logs, available
-at http://jquery-ui.googlecode.com/svn/
+Copyright (c) 2009 Michael Aufreiter, http://www.quasipartikel.at
Permission is hereby granted, free of charge, to any person obtaining
a copy of this software and associated documentation files (the
Deleted file not rendered
Deleted file not rendered
Deleted file not rendered
Deleted file not rendered
Deleted file not rendered
Deleted file not rendered
Deleted file not rendered
Deleted file not rendered
Deleted file not rendered
Deleted file not rendered
Deleted file not rendered
Deleted file not rendered
Deleted file not rendered

Large diffs are not rendered by default.

Oops, something went wrong.
View
@@ -0,0 +1,29 @@
+/* Multiselect
+----------------------------------*/
+
+.ui-multiselect { margin:2px 0 30px 10px; border: solid 1px; font-size: 0.8em; }
+.ui-multiselect ul { -moz-user-select: none; }
+.ui-multiselect ul li { cursor: default; line-height: 20px; height: 20px; font-size: 11px; }
+.ui-multiselect ul li a { color: #999; text-decoration: none; padding: 0; display: block; float: left; cursor: pointer;}
+.ui-multiselect div.selected { padding: 0; margin: 0; border: 0; float:left; position: relative; }
+
+.ui-multiselect ul.selected { padding: 0; overflow: auto; background: #fff; margin: 0; list-style: none; border: 0; position: relative; width: 100%; }
+.ui-multiselect ul.selected li { }
+.ui-multiselect div.available { padding: 0; margin: 0; border: 0; float:left; position: relative; border-left: 1px solid; }
+.ui-multiselect ul.available { padding: 0; overflow: auto; background: #fff; margin: 0; list-style: none; border: 0; position: relative; width: 100%; }
+.ui-multiselect ul.available li { padding-left: 10px; }
+
+.ui-multiselect .ui-state-default { border: none; margin-bottom: 1px; position: relative; padding-left: 20px;}
+.ui-multiselect .ui-state-hover { border: none; }
+.ui-multiselect .ui-widget-header {border: none; font-size: 11px; margin-bottom: 1px;}
+
+.ui-multiselect .add-all { float: right; padding: 7px;}
+.ui-multiselect .remove-all { float: right; padding: 7px;}
+.ui-multiselect .search-form { float: left; padding: 4px;}
+.ui-multiselect .count { float: left; padding: 7px;}
+
+.ui-multiselect ul li span.ui-icon-arrowthick-2-n-s { position: absolute; left: 2px; }
+.ui-multiselect ul li a.action { position: absolute; right: 2px; top: 2px; }
+
+.ui-multiselect input.search { height: 14px; padding: 1px; opacity: 0.5; margin: 0; width: 100px; }
+.ui-multiselect input.waiting { color: #aaa; font-style: italic; }
View
@@ -3,17 +3,20 @@
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>jQuery UI Multiselect</title>
- <link type="text/css" href="css/smoothness/jquery-ui-1.7.1.custom.css" rel="stylesheet" />
+ <link type="text/css" rel="stylesheet" href="http://jqueryui.com/themes/base/ui.all.css" />
+ <link type="text/css" href="css/ui.multiselect.css" rel="stylesheet" />
+
<link type="text/css" href="css/page.css" rel="stylesheet" />
<script type="text/javascript" src="js/jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="js/jquery-ui-1.7.1.custom.min.js"></script>
<script type="text/javascript" src="js/ui.multiselect.js"></script>
<script type="text/javascript">
- $(function(){
- // Multiselect
- $(".multiselect").multiselect({sortable: true});
- });
+ $(function(){
+ $(".multiselect").multiselect({sortable: true});
+ $('#switcher').themeswitcher();
+ });
</script>
+
</head>
<body>
<h1>jQuery UI Multiselect</h1>
@@ -27,19 +30,119 @@
<h1>Demo</h1>
- <h2>Choose your weapons</h2>
- <select id="weapons" class="multiselect" multiple="multiple" name="weapons[]">
- <option value="boomerang">Boomerang</option>
- <option value="medieval_knive">Medieval Knive</option>
- <option selected="selected" value="ninja_star">Ninja Star</option>
- <option value="dragon_blades">Dragon Blades</option>
- <option selected="selected" value="warrior_sword">Warrior Sword</option>
- <option value="machine_gun">Machine Gun</option>
- <option selected="selected" value="tomato">Tomato</option>
- <option value="axe">Axe</option>
- <option value="jedi_sword">Jedi Sword</option>
- </select>
+ <script type="text/javascript"
+ src="http://jqueryui.com/themeroller/themeswitchertool/">
+ </script>
+ <div id="switcher"></div>
+
+ <h2>Choose countries</h2>
+ <form action="index.html">
+ <select id="countries" class="multiselect" multiple="multiple" name="countries[]">
+ <option value="AFG">Afghanistan</option>
+ <option value="ALB">Albania</option>
+ <option value="DZA">Algeria</option>
+ <option value="AND">Andorra</option>
+ <option value="ARG">Argentina</option>
+ <option value="ARM">Armenia</option>
+ <option value="ABW">Aruba</option>
+ <option value="AUS">Australia</option>
+ <option value="AUT" selected="selected">Austria</option>
+
+ <option value="AZE">Azerbaijan</option>
+ <option value="BGD">Bangladesh</option>
+ <option value="BLR">Belarus</option>
+ <option value="BEL">Belgium</option>
+ <option value="BIH">Bosnia and Herzegovina</option>
+ <option value="BRA">Brazil</option>
+ <option value="BRN">Brunei</option>
+ <option value="BGR">Bulgaria</option>
+ <option value="CAN">Canada</option>
+
+ <option value="CHN">China</option>
+ <option value="COL">Colombia</option>
+ <option value="HRV">Croatia</option>
+ <option value="CYP">Cyprus</option>
+ <option value="CZE">Czech Republic</option>
+ <option value="DNK">Denmark</option>
+ <option value="EGY">Egypt</option>
+ <option value="EST">Estonia</option>
+ <option value="FIN">Finland</option>
+
+ <option value="FRA">France</option>
+ <option value="GEO">Georgia</option>
+ <option value="DEU" selected="selected">Germany</option>
+ <option value="GRC">Greece</option>
+ <option value="HKG">Hong Kong</option>
+ <option value="HUN">Hungary</option>
+ <option value="ISL">Iceland</option>
+ <option value="IND">India</option>
+ <option value="IDN">Indonesia</option>
+
+ <option value="IRN">Iran</option>
+ <option value="IRL">Ireland</option>
+ <option value="ISR">Israel</option>
+ <option value="ITA">Italy</option>
+ <option value="JPN">Japan</option>
+ <option value="JOR">Jordan</option>
+ <option value="KAZ">Kazakhstan</option>
+ <option value="KWT">Kuwait</option>
+ <option value="KGZ">Kyrgyzstan</option>
+
+ <option value="LVA">Latvia</option>
+ <option value="LBN">Lebanon</option>
+ <option value="LIE">Liechtenstein</option>
+ <option value="LTU">Lithuania</option>
+ <option value="LUX">Luxembourg</option>
+ <option value="MAC">Macau</option>
+ <option value="MKD">Macedonia</option>
+ <option value="MYS">Malaysia</option>
+ <option value="MLT">Malta</option>
+
+ <option value="MEX">Mexico</option>
+ <option value="MDA">Moldova</option>
+ <option value="MNG">Mongolia</option>
+ <option value="NLD" selected="selected">Netherlands</option>
+ <option value="NZL">New Zealand</option>
+ <option value="NGA">Nigeria</option>
+ <option value="NOR">Norway</option>
+ <option value="PER">Peru</option>
+ <option value="PHL">Philippines</option>
+
+ <option value="POL">Poland</option>
+ <option value="PRT">Portugal</option>
+ <option value="QAT">Qatar</option>
+ <option value="ROU">Romania</option>
+ <option value="RUS">Russia</option>
+ <option value="SMR">San Marino</option>
+ <option value="SAU">Saudi Arabia</option>
+ <option value="CSG">Serbia and Montenegro</option>
+ <option value="SGP">Singapore</option>
+
+ <option value="SVK">Slovakia</option>
+ <option value="SVN">Slovenia</option>
+ <option value="ZAF">South Africa</option>
+ <option value="KOR">South Korea</option>
+ <option value="ESP">Spain</option>
+ <option value="LKA">Sri Lanka</option>
+ <option value="SWE">Sweden</option>
+ <option value="CHE">Switzerland</option>
+ <option value="SYR">Syria</option>
+
+ <option value="TWN">Taiwan</option>
+ <option value="TJK">Tajikistan</option>
+ <option value="THA">Thailand</option>
+ <option value="TUR">Turkey</option>
+ <option value="TKM">Turkmenistan</option>
+ <option value="UKR">Ukraine</option>
+ <option value="ARE">United Arab Emirates</option>
+ <option value="GBR">United Kingdom</option>
+ <option value="USA" selected="selected">United States</option>
+ <option value="UZB">Uzbekistan</option>
+ <option value="VAT">Vatican City</option>
+ <option value="VNM">Vietnam</option>
+ </select>
+ </form>
<h1>Installation</h1>
<div id="installation">
Oops, something went wrong.

0 comments on commit bb31dbb

Please sign in to comment.