jquery-picklist/examples/advanced.html

<!DOCTYPE html>
<html>

<head>
        <meta http-equiv="content-type" content="text/html; charset=utf-8" />
        <title>jQuery PickList - Advanced Example</title>

        <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.1/jquery.min.js"></script>

        <!-- REMOVE THIS if you're using jQuery UI. -->
        <script type="text/javascript" src="../jquery.ui.widget.js"></script>

        <script type="text/javascript" src="../jquery-picklist.js"></script>
        <script type="text/javascript">
                $(function()
                {
                        $("#advanced").pickList(
                        {
                                sourceListLabel:        "Unadded",
                                targetListLabel:        "Added",
                                addAllLabel:            "Add All",
                                addLabel:                       "Add",
                                removeAllLabel:         "Remove All",
                                removeLabel:            "Remove",
                                sortAttribute:          "value",
                                items:
                                [
                                        {
                                                value: 6,
                                                label: "Afterwards #1",
                                                selected: false
                                        }
                                ]
                        });

                        // Example of adding a regular item after picklist creation.
                        // Note there is no "element" property as that's for rich content only.
                        $("#advanced").pickList("insert",
                        {
                                value: 7,
                                label: "Afterwards #2",
                                selected: true
                        });
                });
        </script>

        <link type="text/css" href="../jquery-picklist.css" rel="stylesheet" />
        <!--[if IE 7]><link href="../jquery-picklist-ie7.css" rel="stylesheet" type="text/css" /><![endif]-->
</head>

<body>

        <div>
                <select id="advanced" name="advanced" multiple="multiple">
                        <option value="1">Zebra</option>
                        <option value="2">Rabbit</option>
                        <option value="3">Snake</option>
                        <option value="4">Bear</option>
                        <option value="5">Starfish</option>
                </select>
        </div>

</body></html>
1	torben	2125	<!DOCTYPE html>
2			<html>
3
4			<head>
5			<meta http-equiv="content-type" content="text/html; charset=utf-8" />
6			<title>jQuery PickList - Advanced Example</title>
7
8			<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.1/jquery.min.js"></script>
9
10			<!-- REMOVE THIS if you're using jQuery UI. -->
11			<script type="text/javascript" src="../jquery.ui.widget.js"></script>
12
13			<script type="text/javascript" src="../jquery-picklist.js"></script>
14			<script type="text/javascript">
15			$(function()
16			{
17			$("#advanced").pickList(
18			{
19			sourceListLabel: "Unadded",
20			targetListLabel: "Added",
21			addAllLabel: "Add All",
22			addLabel: "Add",
23			removeAllLabel: "Remove All",
24			removeLabel: "Remove",
25			sortAttribute: "value",
26			items:
27			[
28			{
29			value: 6,
30			label: "Afterwards #1",
31			selected: false
32			}
33			]
34			});
35
36			// Example of adding a regular item after picklist creation.
37			// Note there is no "element" property as that's for rich content only.
38			$("#advanced").pickList("insert",
39			{
40			value: 7,
41			label: "Afterwards #2",
42			selected: true
43			});
44			});
45			</script>
46
47			<link type="text/css" href="../jquery-picklist.css" rel="stylesheet" />
48			<!--[if IE 7]><link href="../jquery-picklist-ie7.css" rel="stylesheet" type="text/css" /><![endif]-->
49			</head>
50
51			<body>
52
53			<div>
54			<select id="advanced" name="advanced" multiple="multiple">
55			<option value="1">Zebra</option>
56			<option value="2">Rabbit</option>
57			<option value="3">Snake</option>
58			<option value="4">Bear</option>
59			<option value="5">Starfish</option>
60			</select>
61			</div>
62
63			</body></html>