checkbox and RTL support

6 posts, 0 answers
  1. Itai
    Itai avatar
    16 posts
    Member since:
    Oct 2007

    Posted 19 Jul 2011 Link to this post

    Hi, 

    I am using the FormDecorator in the master page.
    In one of my pages, I have 2 checkboxes.
    One of them need to be dir=rtl. 
    The problem is that when the page loads, I can see that the checkbox is ok (rtl) but after the FormDecorator occurs, it change the checkbox back.

    The code for the checkbox is:
    m_CheckBox.Attributes.Add("dir", "rtl")
    or
    m_CheckBox.Style.Add("dir", "rtl")

    How can avoid the changing back issue?

    10x

  2. Bozhidar
    Admin
    Bozhidar avatar
    677 posts

    Posted 20 Jul 2011 Link to this post

    Hello Itai,

    RadFormDecorator supports one direction at a time - right to left or left to right. To have both direction to a single page you should use two form decorators with decorated zones. The following code gives a simple example how to do that:

    <%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <head runat="server">
        <title></title>
        <style type="text/css">
             
        </style>
    </head>
    <body>
        <form id="form1" runat="server">
        <asp:ScriptManager ID="ScriptManager1" runat="server">
        </asp:ScriptManager>
        <telerik:RadFormDecorator ID="rfd1" runat="server" DecoratedControls="All" DecorationZoneID="orientationLtr"
            Skin="Hay" />
        <telerik:RadFormDecorator ID="RadFormDecorator1" runat="server" DecoratedControls="All"
            DecorationZoneID="orientationRtl" Skin="Forest" />
        <div id="orientationLtr">
            <asp:CheckBox Text="Left to Right" ID="chb1" runat="server" />
        </div>
        <div id="orientationRtl" style="direction: rtl;">
            <asp:CheckBox Text="Right to Left" ID="CheckBox1" runat="server" />
        </div>
        </form>
    </body>
    </html>

    I have set two different skin to the formdecorators in order to make the difference more obvious.

    All the best,
    Bojo
    the Telerik team
    Explore the entire set of ASP.NET AJAX controls we offer here and browse the myriad online demos to learn more about the components and the features they incorporate.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Itai
    Itai avatar
    16 posts
    Member since:
    Oct 2007

    Posted 20 Jul 2011 Link to this post

    Thanks for the answer, but it is not helping.
    The page is dynamic, so I cannot know what controls will I have at the end.
    Is there any other solution to solve this issue?
  5. Pero
    Admin
    Pero avatar
    1156 posts

    Posted 21 Jul 2011 Link to this post

    Hi Itai,

    Could you please explain in more detail your specific scenario, because we are not sure what exactly are you trying to achieve? The FormDecorator cannot decorate RTL and LTR controls at the same time, and that's why you should use separate instance for each set of elements. Note that the DecorationZone can be set in the code-behind. You could also dynamically decorate controls using the decorate(parentHtmlElement) client-side method.

    Another option is using RadButtons instead of decorated checkboxes. Here are two checkboxes, one in RTL and the other in LTR direction:
    <telerik:RadButton ID="RadButton1" runat="server" Text="LTR Checkbox" ButtonType="ToggleButton"
        ToggleType="CheckBox">
    </telerik:RadButton>
    <telerik:RadButton ID="RadButton2" runat="server" Text="RTL Checkbox" ButtonType="ToggleButton"
        ToggleType="CheckBox" Style="direction: rtl">
    </telerik:RadButton>


    Greetings,
    Pero
    the Telerik team
    Explore the entire set of ASP.NET AJAX controls we offer here and browse the myriad online demos to learn more about the components and the features they incorporate.
  6. Itai
    Itai avatar
    16 posts
    Member since:
    Oct 2007

    Posted 24 Jul 2011 Link to this post

    hi,

    our pages are generated from XML.
    it looks something like:
    <Controls>
        <ControlID='txtFirstName' text='..' ...../>
        <ControlID='txtLastName' text='..' ...../>
        <ControlID='chkLeft' text='..' ...../>
        <ControlID='chkRight' text='..' dir='rtl'...../>
    .
    .
    .
    </Controls>

    so when rendering the page, I cannot know if there are any checkboxes or radio buttons, and if there are, what direction text they use.
    in all the other controls I can add something like that:

     

    DirectCast(x, WebControl).Style.Add("direction", "rtl")

     


    and it works fine.
    The only problem is in checkbox and radio button.

    And I cannot use buttons as checkbox/radio button

    10x in advanced
  7. Niko
    Admin
    Niko avatar
    387 posts

    Posted 26 Jul 2011 Link to this post

    Hi Itai,

    Please, note that the FormDecorator itself is a control and it can also be created dynamically. Therefore what you can do is, when your rendering encounters a control that should be decorated and should have direction: rtl, then wrap the control in a container, assign it an id and create a FormDecorater with DecorationZoneID equal to the id of the container.
    Following the above described paradigm I have prepared for you a sample page that demonstrated this approach.

    Hope this helps. 

    Greetings,
    Niko
    the Telerik team
    Explore the entire set of ASP.NET AJAX controls we offer here and browse the myriad online demos to learn more about the components and the features they incorporate.
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017