Issue with RadFormDecorator, templated checkboxes and Firefox v63

6 posts, 0 answers
  1. Mark
    Mark avatar
    3 posts
    Member since:
    Aug 2017

    Posted 25 Oct Link to this post

    This issue just started to happen yesterday.  It should be very easy to reproduce.  It only happens in firefox v63, which was just updated on my PC yesterday.  

     

    Please click to view video demonstration that displays the issue (YouTube).    I've posted this sample page online so it can be viewed here: https://demoqa.eadoptonline.com/checkboxtest.aspx

     

    If you use firefox < v63 it will display normally, if you have firefox v63 (current latest release as of this posting) each checkbox is duplicated.  

    Relevant code to reproduce the issue:

    <asp:Repeater runat="server" ID="Repeater1">
          <HeaderTemplate>
              <table>
          </HeaderTemplate>
          <ItemTemplate>
              <tr>
                  <td id="row" runat="server" class="bodycopy">
                      <asp:Checkbox ID="chkApproved" runat="server" /> how many times does the checkbox appear on each row?
                  </td>
              </tr>
          </ItemTemplate>
          <FooterTemplate>
              </table>
          </FooterTemplate>
      </asp:Repeater>

     

    Code behind is unimportant

    protected void Page_Load(object sender, EventArgs e)
        {
            List<string> datasource = new List<string>();
            datasource.Add("asdfda");
            datasource.Add("asdfdaadsf");
            datasource.Add("asdfdadsfa");
            datasource.Add("asdfdaadf");
            datasource.Add("asdfdaafad");
     
            Repeater1.DataSource = datasource;
            Repeater1.DataBind();
        }

     

    The form decorator in my master page is as follows.  The skin comes from web.config but it doesn't matter what i use the problem appears tied to the render mode, not the skin. 

    <telerik:RadFormDecorator ID="RadFormDecorator1" runat="server" RenderMode="Classic" />

     

    Thanks!

    -Mark

     

  2. Chanan Zass
    Chanan Zass avatar
    63 posts
    Member since:
    Aug 2012

    Posted 29 Oct in reply to Mark Link to this post

    Same here.

    Only way I could think of to fix that issue was to add ' ControlsToSkip="CheckBoxes"' to the RadFormDecorator tag.

    But this would mean a lot of work (editing more than 50 pages).

    <telerik:RadFormDecorator ID="RadFormDecorator1" Runat="server" EnableRoundedCorners="True" Font-Bold="true" Font-Size="Small" ControlsToSkip="CheckBoxes" />

     

  3. Mark
    Mark avatar
    3 posts
    Member since:
    Aug 2017

    Posted 29 Oct in reply to Chanan Zass Link to this post

    Yeah, there were a couple of ways that seem to fix this issue.  Some of these are more viable than others.

    1. Don't use RadFormDecorator with RenderMode="Classic".  This means either removing the RadFormDecorator or changing it's render mode.  Either of these can have ramifications on your site. I don't know what the default render mode is, when none is specified.

    2. Convert your checkboxes and radio buttons (yes i found examples where the same behavior occurs w/ radio buttons after i posted the original issue) to RadButtons.  This is pretty straightfoward

    <asp:checkbox id="chk1" runat="server" text="Checkbox 1" value="1" />
     
    becomes
     
    <telerik:radbutton id="chk1" runat="server" Text="Checkbox 1" value="1" ButtonType="ToggleButton", ToggleType="Checkbox" causesvalidation="false" autopostback="false" Skin="Default" />

     

    and to make a RadioButton you simply change

    ToggleType="CheckBox" to ToggleType="RadioButton"  GroupName="somevalue"

     

    the conversion is mostly straightforward.  it gets tricky if you have CheckBoxList or RadioButtonList controls as each needs to become it's own button with it's own unique ID, and sometimes if you have client-side events its a little tricky because the client libraries are a little different.  but otherwise you can treat the button just like class checkbox or radio button.

    This was the approach i went with to fix my site, converting all offenders to Radbuttons.  I specified the skin="Default" so that they looked as much as possible like classic versions of the controls they replaced.  

    Telerik we're really hoping for you to weigh in on this issue.  If you'd rather me post a support ticket i'm happy to do so.  

    -Mark

  4. Chanan Zass
    Chanan Zass avatar
    63 posts
    Member since:
    Aug 2012

    Posted 29 Oct in reply to Mark Link to this post

    Thanks for your input.

    I submitted a ticket a couple of hours ago and will publish the reply here.

    I still think the safest approach right now is to exclude CheckBox controls from RadFormDecorator (there's not much decorating you can do with checkboxes anyway -- at least not in my case).

  5. Chanan Zass
    Chanan Zass avatar
    63 posts
    Member since:
    Aug 2012

    Posted 29 Oct in reply to Mark Link to this post

    Thanks for your input.

    I did submit a ticket a couple of hours ago, and will publish the reply here.

    I still think the safest approach, at least in my case, would be to exclude checkboxes from RadFormDecorator (there's not much decorating you can do with checkboxes anyway, I think).

  6. Vessy
    Admin
    Vessy avatar
    1849 posts

    Posted 29 Oct Link to this post

    Hi guys,

    We are currently working on resolving the faced issue, meanwhile we have listed all solutions found so far in the public item of the bug. You can refer the possible workarounds and follow the progress of the item here:
    https://feedback.telerik.com/Project/108/Feedback/Details/258566

    Regards,
    Vessy
    Progress Telerik
    Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
Back to Top