RadButton SingleClickText aligns dots left instead of right

4 posts, 1 answers
  1. Felix
    Felix avatar
    3 posts
    Member since:
    Nov 2016

    Posted 10 Jan Link to this post

    Hi!

    I encountered a weird phenomenon when using the SingleClick feature of the RadButton

    <div class="footer" dir="rtl">
        <telerik:RadButton RenderMode="Lightweight" runat="server" ID="buttonSave"  Text="Speichern" SingleClick="true" SingleClickText="Speichere .." CausesValidation="False" OnClick="buttonSaveClicked" />
        <telerik:RadButton RenderMode="Lightweight" runat="server" ID="buttonCancel" Text="Abbrechen" SingleClick="true" SingleClickText="Abbrechen .." CausesValidation="False" OnClick="buttonCancelClicked" />
    </div>

     

    When I click one of the buttons the displayed text is changing for the time of the PostBack, but the text shown is: ".. Speichere" and ".. Abbrechen" instead of the dots being after the string. When I set the SingleClickText to have letters after the dots it's shown correctly. The amount of dots don't change anything, neither do spaces between the dots and the normal text or after the dots.

    In addition to that JS-Console says "no element found" when the button is clicked.

    Is that a bug or am I missing something important?

    Thanks already

    Greetings Felix

  2. Answer
    Patrick
    Admin
    Patrick avatar
    203 posts

    Posted 10 Jan Link to this post

    Hi Felix,

    First, thank you for providing your code.  This helps!

    What you are experiencing is due to the dir attribute set to rtl.   You can experience the same behavior in w3School's example if you press the button "Try it Yourself  >>".  Note the position of the exclamation mark.

    To fix the issue, add a span around the button and set dir to "ltr".  

    I've attached a project which demonstrates rtl and the span.

    I hope this helps!

    Regards,
    Patrick
    Telerik by Progress
    Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
  3. Felix
    Felix avatar
    3 posts
    Member since:
    Nov 2016

    Posted 10 Jan Link to this post

    Hey Patrick,

    thanks for the quick reply!

    Now that you said that it seems so obvious. Works like a charm with the span around the buttons.

    Greetings Felix

  4. Patrick
    Admin
    Patrick avatar
    203 posts

    Posted 10 Jan Link to this post

    Hello Felix,

    Glad everything is working and happy to help!

    Regards,
    Patrick
    Telerik by Progress
    Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
Back to Top