<%@ Page Language="vb" AutoEventWireup="true" %>
<%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>
<!DOCTYPE html>
<html xmlns='http://www.w3.org/1999/xhtml'>
<head runat="server">
<title>Telerik ASP.NET Example</title>
<link href="styles.css" rel="stylesheet" type="text/css" />
</head>
<body>
<form id="form1" runat="server">
<telerik:RadScriptManager runat="server" ID="RadScriptManager1" />
<telerik:RadSkinManager ID="RadSkinManager1" runat="server" ShowChooser="true" />
<div class="demo-container">
<div dir="rtl">
<table cellpadding="0" cellspacing="0" width="100%" class="imgBtnTable">
<tr>
<td class="center">
<telerik:RadButton RenderMode="Lightweight" ID="btnVolume" runat="server" ButtonType="StandardButton" Width="100px"
AutoPostBack="false" Text="תקן כפתור">
<Icon SecondaryIconCssClass="rbUpload" SecondaryIconRight="10" SecondaryIconTop="3"></Icon>
</telerik:RadButton>
</td>
<td>."This is a standard button with a right positioned built-in icon SecondaryIconCssClass="rbSave
<br />
Use the <strong>SecondaryIconCssClass</strong> property to show the icon of RadButton
on the right side
</td>
</tr>
<tr>
<td>
<telerik:RadButton RenderMode="Lightweight" ID="RadButton1" runat="server" ButtonType="LinkButton" AutoPostBack="false"
Text="ذخیره">
<Icon SecondaryIconCssClass="rbSave"></Icon>
</telerik:RadButton>
</td>
<td>".This is a link button with a right positioned built-in icon SecondaryIconCssClass="rbSave
</td>
</tr>
<tr>
<td class="center">
<telerik:RadButton RenderMode="Lightweight" ID="RadioButton1" runat="server" ButtonType="ToggleButton" ToggleType="Radio"
AutoPostBack="false" GroupName="Radio" Text="Radio Button 1">
</telerik:RadButton>
<br />
<telerik:RadButton RenderMode="Lightweight" ID="RadioButton2" runat="server" ButtonType="ToggleButton" ToggleType="Radio"
AutoPostBack="false" GroupName="Radio" Text="Radio Button 2" Checked="true">
</telerik:RadButton>
<br />
<telerik:RadButton RenderMode="Lightweight" ID="RadioButton3" runat="server" ButtonType="ToggleButton" ToggleType="Radio"
AutoPostBack="false" GroupName="Radio" Text="Radio Button 3">
</telerik:RadButton>
</td>
<td>.Radio buttons in Right-to-Left parent
<br />
The RadButton control automatically moves the icons to the right
</td>
</tr>
<tr>
<td class="center">
<telerik:RadButton RenderMode="Lightweight" ID="RadButton2" runat="server" ButtonType="ToggleButton" ToggleType="CheckBox"
AutoPostBack="false" Text="CheckBox 1">
</telerik:RadButton>
<br />
<telerik:RadButton RenderMode="Lightweight" ID="RadButton3" runat="server" ButtonType="ToggleButton" ToggleType="CheckBox"
AutoPostBack="false" Text="CheckBox 2" Checked="true">
</telerik:RadButton>
<br />
<telerik:RadButton RenderMode="Lightweight" ID="RadButton4" runat="server" ButtonType="ToggleButton" ToggleType="CheckBox"
AutoPostBack="false" Text="CheckBox 3">
</telerik:RadButton>
</td>
<td>.CheckBoxes in Right-to-Left parent
<br />
Similarly as the Radio buttons, the CheckBox icons are automatically moved to the
right
</td>
</tr>
<tr>
<td class="center">
<telerik:RadButton RenderMode="Lightweight" ID="CheckBox1" runat="server" ButtonType="StandardButton" ToggleType="CheckBox"
Checked="true" AutoPostBack="false" BorderWidth="0" BackColor="transparent" Text="CheckBox 1">
<ToggleStates>
<telerik:RadButtonToggleState Text="Checked" SecondaryIconCssClass="rbToggleCheckboxChecked"></telerik:RadButtonToggleState>
<telerik:RadButtonToggleState Text="UnChecked" SecondaryIconCssClass="rbToggleCheckbox"></telerik:RadButtonToggleState>
</ToggleStates>
</telerik:RadButton>
<div style="padding-bottom: 5px;">
</div>
<telerik:RadButton RenderMode="Lightweight" ID="CheckBox" runat="server" ButtonType="StandardButton" ToggleType="CheckBox"
AutoPostBack="false" BorderWidth="0" BackColor="transparent" Text="CheckBox 2">
<ToggleStates>
<telerik:RadButtonToggleState Text="Checked" SecondaryIconCssClass="rbToggleCheckboxChecked"></telerik:RadButtonToggleState>
<telerik:RadButtonToggleState Text="UnChecked" SecondaryIconCssClass="rbToggleCheckbox"></telerik:RadButtonToggleState>
</ToggleStates>
</telerik:RadButton>
<div style="padding-bottom: 5px;">
</div>
<telerik:RadButton RenderMode="Lightweight" ID="CheckBox3" runat="server" ButtonType="StandardButton" ToggleType="CheckBox"
Checked="true" AutoPostBack="false" BorderWidth="0" BackColor="transparent" Text="CheckBox 3">
<ToggleStates>
<telerik:RadButtonToggleState Text="Checked" SecondaryIconCssClass="rbToggleCheckboxChecked"></telerik:RadButtonToggleState>
<telerik:RadButtonToggleState Text="UnChecked" SecondaryIconCssClass="rbToggleCheckbox"></telerik:RadButtonToggleState>
</ToggleStates>
</telerik:RadButton>
</td>
<td>The user can easily customize her/his Radios or CheckBoxes using the Icon functionality
of the RadButton control. These RadButton controls have their SecondaryIconCssClass
properties, set to the CSS classes for the CheckBox icon
</td>
</tr>
<tr>
<td class="center">
<telerik:RadButton RenderMode="Lightweight" ID="BuiltinIconsButton2" runat="server" ButtonType="StandardButton"
ToggleType="CustomToggle" AutoPostBack="false">
<ToggleStates>
<telerik:RadButtonToggleState SecondaryIconCssClass="rbOk" Text="موافق"></telerik:RadButtonToggleState>
<telerik:RadButtonToggleState SecondaryIconCssClass="rbCancel" Text="إلغاء"></telerik:RadButtonToggleState>
</ToggleStates>
</telerik:RadButton>
</td>
<td>.This demo shows how to render a CustomToggle button with embedded icons placed
on the right side of the control
</td>
</tr>
</table>
</div>
</div>
</form>
</body>
</html>