Silk skin

MultiSelect - Right-to-Left Support

Select Continents

Isolate this demo as a stand-alone application
  • About this demo
  • C#
  • VB

RadMultiSelect provides support for right-to-left presentation.

RadMultiSelect considers the direction attribute set to the control itself or any parent HTML element. If you set the direction of the body tag (or any other parent element that contains the control) to rtl, RadMultiSelect reverses the position of the button and aligns the text to the right side of the container.

<telerik:RadMultiSelect ID="RadMultiSelect1" runat="server" dir="rtl" ... />
  • DefaultCS.aspx
<%@ Page Language="c#" AutoEventWireup="true"  %>

<%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns='http://www.w3.org/1999/xhtml'>
<head runat="server">
    <title>Telerik ASP.NET Example</title>
</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 size-narrow"  dir="rtl" runat="server">
        <h4>Select Continents</h4>
        <telerik:RadMultiSelect runat="server"
            Placeholder="Select continents..."
            AutoClose="false"
            TagMode="Single"
            DataTextField="text"
            DataValueField="value"
            Width="400px"
            ID="RadMultiSelect1">
            <Items>
                <telerik:MultiSelectItem Text="Africa" Value="1"></telerik:MultiSelectItem>
                <telerik:MultiSelectItem Text="Europe" Value="2"></telerik:MultiSelectItem>
                <telerik:MultiSelectItem Text="Asia" Value="3"></telerik:MultiSelectItem>
                <telerik:MultiSelectItem Text="North America" Value="4"></telerik:MultiSelectItem>
                <telerik:MultiSelectItem Text="South America" Value="5"></telerik:MultiSelectItem>
                <telerik:MultiSelectItem Text="Antarctica" Value="6"></telerik:MultiSelectItem>
                <telerik:MultiSelectItem Text="Australia" Value="7"></telerik:MultiSelectItem>
            </Items>
        </telerik:RadMultiSelect>

    </div>
    </form>
</body>
</html>

Support & Learning Resources

Find Assistance

Help Us Improve

Was this example helpful?