<com:THead/>
<com:TForm>
<style>
	.more td
	{
		border: 1px solid #eee;
		width: 40px;
		height: 40px;
	}
	.more td.rating
	{
		background-position: 10px 10px;
	}
	.more td.rating_selected
	{
		background-position: 10px -90px;
	}
	.more td.rating_hover
	{
		background-position: 10px -290px;
	}
</style>

<com:TLabel ID="label1" Text="Rate It:" />
<com:TActiveRatingList ID="list1"
	Rating="3.7"
	CaptionID="label1" OnCallback="list1_oncallback">
	<com:TListItem Text="1 Star" />
	<com:TListItem Text="2 Stars" />
	<com:TListItem Text="3 Stars" />
	<com:TListItem Text="4 Stars" />
	<com:TListItem Text="5 Stars" />
	<prop:ClientSide
		OnLoading="Element.show('status')"
		OnComplete="Element.hide('status')" />
</com:TActiveRatingList>

<hr />

<com:TActiveButton ID="button1" Text="Enable" OnClick="button1_clicked" />
<com:TActiveButton ID="button2" Text="Disable" OnClick="button2_clicked" />
<com:TActiveButton ID="button5" Text="Index=3" OnClick="button5_clicked" />


<hr />

<com:TLabel ID="label2" Text="Rate It:" />
<com:TActiveRatingList ID="list2" CaptionID="label2" RatingStyle="blocks" OnCallback="list2_oncallback">
	<com:TListItem Text="1 Block" />
	<com:TListItem Text="2 Blocks" />
	<com:TListItem Text="3 Blocks" />
	<com:TListItem Text="4 Blocks" Selected="true" />
	<com:TListItem Text="5 Blocks" />
	<prop:ClientSide
		OnLoading="Element.show('status')"
		OnComplete="Element.hide('status')" />
</com:TActiveRatingList>

<br />

<com:TActiveRatingList ID="list3" Rating="3.5"
	Attributes.title="3.5 Blocks"  RatingStyle="blocks" ReadOnly="true">
	<com:TListItem Text="1 Block" />
	<com:TListItem Text="2 Blocks" />
	<com:TListItem Text="3 Blocks" />
	<com:TListItem Text="4 Blocks" />
	<com:TListItem Text="5 Blocks" />
</com:TActiveRatingList>

<br />

<com:TActiveRatingList CssClass="more" RepeatColumns="2" RepeatDirection="Vertical">
	<com:TListItem Text="1 Star" />
	<com:TListItem Text="2 Stars" />
	<com:TListItem Text="3 Stars" />
	<com:TListItem Text="4 Stars" />
	<com:TListItem Text="5 Stars" />
	<com:TListItem Text="6 Stars" />
	<com:TListItem Text="7 Stars" />
	<com:TListItem Text="8 Stars" />
	<com:TListItem Text="9 Stars" />
	<com:TListItem Text="10 Stars" />
	<prop:ClientSide
		OnLoading="Element.show('status')"
		OnComplete="Element.hide('status')" />
</com:TActiveRatingList>
<br />

<com:TActiveRatingList ID="list4" Rating="3.5" Attributes.title="3.5 Stars" ReadOnly="true">
	<com:TListItem Text="1 Star" />
	<com:TListItem Text="2 Stars" />
	<com:TListItem Text="3 Stars" />
	<com:TListItem Text="4 Stars" />
	<com:TListItem Text="5 Stars" />
</com:TActiveRatingList>

<br />

	<div id="status" style="margin:1em; padding:0.5em;
		text-align:center;
		background-color:#900;
		color:white; display: none;
		position: absolute; right: 0; top: 0">
		Loading...
	</div>

<com:TJavascriptLogger />

</com:TForm>