aboutsummaryrefslogtreecommitdiff
path: root/static/development-bundle/demos/sortable/connect-lists.html
diff options
context:
space:
mode:
Diffstat (limited to 'static/development-bundle/demos/sortable/connect-lists.html')
-rw-r--r--static/development-bundle/demos/sortable/connect-lists.html55
1 files changed, 0 insertions, 55 deletions
diff --git a/static/development-bundle/demos/sortable/connect-lists.html b/static/development-bundle/demos/sortable/connect-lists.html
deleted file mode 100644
index 639f0e9..0000000
--- a/static/development-bundle/demos/sortable/connect-lists.html
+++ /dev/null
@@ -1,55 +0,0 @@
1<!doctype html>
2<html lang="en">
3<head>
4 <title>jQuery UI Sortable - Connect lists</title>
5 <link type="text/css" href="../../themes/base/ui.all.css" rel="stylesheet" />
6 <script type="text/javascript" src="../../jquery-1.3.2.js"></script>
7 <script type="text/javascript" src="../../ui/ui.core.js"></script>
8 <script type="text/javascript" src="../../ui/ui.sortable.js"></script>
9 <link type="text/css" href="../demos.css" rel="stylesheet" />
10 <style type="text/css">
11 #sortable1, #sortable2 { list-style-type: none; margin: 0; padding: 0; float: left; margin-right: 10px; }
12 #sortable1 li, #sortable2 li { margin: 0 5px 5px 5px; padding: 5px; font-size: 1.2em; width: 120px; }
13 </style>
14 <script type="text/javascript">
15 $(function() {
16 $("#sortable1, #sortable2").sortable({
17 connectWith: '.connectedSortable'
18 }).disableSelection();
19 });
20 </script>
21</head>
22<body>
23<div class="demo">
24
25<ul id="sortable1" class="connectedSortable">
26 <li class="ui-state-default">Item 1</li>
27 <li class="ui-state-default">Item 2</li>
28 <li class="ui-state-default">Item 3</li>
29 <li class="ui-state-default">Item 4</li>
30 <li class="ui-state-default">Item 5</li>
31</ul>
32
33<ul id="sortable2" class="connectedSortable">
34 <li class="ui-state-highlight">Item 1</li>
35 <li class="ui-state-highlight">Item 2</li>
36 <li class="ui-state-highlight">Item 3</li>
37 <li class="ui-state-highlight">Item 4</li>
38 <li class="ui-state-highlight">Item 5</li>
39</ul>
40
41</div><!-- End demo -->
42
43<div class="demo-description">
44
45<p>
46 Sort items from one list into another and vice versa, by passing a selector into
47 the <code>connectWith</code> option. The simplest way to do this is to
48 group all related lists with a CSS class, and then pass that class into the
49 sortable function (i.e., <code>connectWith: '.myclass'</code>).
50</p>
51
52</div><!-- End demo-description -->
53
54</body>
55</html>
© 2015 Mike Crute