2 files changed, 70 insertions, 0 deletions
diff --git a/demos/quickstart/protected/pages/JuiControls/Samples/TJuiSelectable/Home.page b/demos/quickstart/protected/pages/JuiControls/Samples/TJuiSelectable/Home.page
new file mode 100644
index 00000000..4af5d637
--- /dev/null
+++ b/demos/quickstart/protected/pages/JuiControls/Samples/TJuiSelectable/Home.page
@@ -0,0 +1,38 @@
+<com:TContent ID="body">
+<h1>TJuiSelectable Samples</h1>
+
+<com:TStyleSheet>
+	.ui-selectable {
+		list-style: none;
+		cursor: pointer;
+	}
+	.ui-selectable li {
+		border: 1px solid transparent;
+		padding: 3px;
+		border-radius:3px;
+	}
+
+	.ui-selectable li:hover {
+		background: #FECA40;
+		border: 1px solid black;
+	}
+
+	.ui-selecting {
+		background: #FECA40;
+	}
+	.ui-selected {
+		background: #F39814; color: white;
+	}
+</com:TStyleSheet>
+<table class="sampletable">
+
+<tr><td class="samplenote">
+Default options with a little css applied:
+</td><td class="sampleaction">
+	<com:TJuiSelectable ID="repeater1"  onSelectedIndexChanged="repeater1_onSelectedIndexChanged"/>
+	<com:TActiveLabel ID="label1" />
+</td></tr>
+
+</table>
+
+</com:TContent>
diff --git a/demos/quickstart/protected/pages/JuiControls/Samples/TJuiSelectable/Home.php b/demos/quickstart/protected/pages/JuiControls/Samples/TJuiSelectable/Home.php
new file mode 100644
index 00000000..cf8d40f1
--- /dev/null
+++ b/demos/quickstart/protected/pages/JuiControls/Samples/TJuiSelectable/Home.php
@@ -0,0 +1,32 @@
+<?php
+
+class Home extends TPage
+{
+	protected $data = array(
+		'PRADO',
+		'quickstart',
+		'tutorial',
+		'sample',
+		'for the',
+		'TJuiSortable',
+		'control',
+		);
+
+	public function onLoad($param)
+	{
+		if(!$this->IsPostback)
+		{
+			$this->repeater1->DataSource=$this->data;
+			$this->repeater1->dataBind();
+		}
+	}
+
+	public function repeater1_onSelectedIndexChanged($sender, $param)
+	{
+		$this->label1->Text="Selected items:";
+		$items = $param->getSelectedIndexes();
+
+		foreach($items as $index)
+			$this->label1->Text.=' '.$this->data[$index];
+	}
+}