Getting two sets of controls while using the FormDecorator

8 posts, 0 answers
  1. Jeff Wardwell
    Jeff Wardwell avatar
    10 posts
    Member since:
    May 2007

    Posted 07 May 2008 Link to this post

    I've got a problem where the controls seem to be doubling up. 

    First, the control that is going to be decorated shows up in its default rendering look and then directly beneath it the skinned control appears.  The problem is that the page renders fine if I choose one of the embedded skins.

    The strange behavior only appears if I set the skin to one of my own and set EnableEmeddded="false".  To create my own skin (which is set as the site default in the web.config), I simply copied the Web20 skin and replaced all occurences of _Web20 with _MySkinName.  I have also added not only the FormDecorator.MySkinName.css file but also the FormDecorator.css file to the stylesheet inclues.

    The problem occurs on FF2 and IE6.  I am working in Windows XP on a site targeting .NET 3.5.

    Code below (pretty much just copied for the online demo):
    <h4 class="CS">Our Skin</h4> 
        <telerik:RadFormDecorator ID="fdOurs" runat="server" DecoratedControls="All" EnableEmbeddedSkins="false"
        </telerik:RadFormDecorator> 
        <h4 class="CS">Checkboxes</h4> 
        <asp:CheckBoxList ID="CheckBoxList1" runat="server" Width="700px" ForeColor="#FFF"
            <asp:ListItem Text="Unchecked checkbox" /> 
            <asp:ListItem Text="Checked checkbox" Selected="true" /> 
            <asp:ListItem Enabled="false" Text="Unchecked and disabled checkbox" /> 
            <asp:ListItem Enabled="false" Selected="true" Text="Checked and disabled checkbox" /> 
        </asp:CheckBoxList> 
        <h4 class="CS">Radiobuttons</h4> 
        <asp:RadioButtonList ID="RadioButtonList1" runat="server" Width="700px" TextAlign="Right"
            <asp:ListItem Text="unselected radiobutton" /> 
            <asp:ListItem Text="selected radiobutton" Selected="true" /> 
            <asp:ListItem Text="unselected and disabled radiobutton" Enabled="false" /> 
        </asp:RadioButtonList> 
        <h4 class="CS">Buttons</h4> 
        <button style="color: #FFF;" type="button"
            Enabled Button</button> 
        <input type="button" value="Disabled Button" disabled="disabled" /> 


  2. Martin
    Admin
    Martin avatar
    585 posts

    Posted 08 May 2008 Link to this post

    Hi Jeff Wardwell,

    The doubling an issue on our side, thank you for pointing it out. It will be fixed with the upcoming Service Pack during the next week. What you have to do is to add this property into FormDecorator.css (or in FormDecorator.MyCustomSkin.css):

    .radfd_MyCustomSkin

    .input
    {
    position: absolute; left: -99999px
    ;
    }



    Sincerely yours,
    Martin Ivanov
    the Telerik team

    Instantly find answers to your questions at the new Telerik Support Center
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Stuart Hemming
    Stuart Hemming avatar
    1622 posts
    Member since:
    Jul 2004

    Posted 23 May 2008 Link to this post

    Am I right in thinking that this fix didn't make it in to SP1?

    -- 

    Stuart

  5. Martin
    Admin
    Martin avatar
    585 posts

    Posted 26 May 2008 Link to this post

    Hi Stuart Hemming,

    I just checked the final versions of RadFormDecorator skins, and what I saw was that this issue was fixed.

    Kind regards,
    Martin Ivanov
    the Telerik team

    Instantly find answers to your questions at the new Telerik Support Center
  6. Stuart Hemming
    Stuart Hemming avatar
    1622 posts
    Member since:
    Jul 2004

    Posted 27 May 2008 Link to this post

    So why can't I find any occurrence of the string ".input" in the FormDecorator CSS file (at least in the couple of skins I've checked?

    --
    Stuart
  7. Martin
    Admin
    Martin avatar
    585 posts

    Posted 27 May 2008 Link to this post

    Hi Stuart,

    As the CSS settings of the .input class are similar for all skins, we just removed the skin-specific class from the FormDecorator.css file, i.e:

    Previous version in the FormDecorator.css file:

    .Default.input,
    .Default2006.input
    {
        /* settings */
    }


    Latest version:

    .input
    {
        /* settings */
    }


    The new CSS makes the .input class independent of the skin and thus applicable for custom skins.

    Greetings,
    Martin Ivanov
    the Telerik team

    Instantly find answers to your questions at the new Telerik Support Center
  8. Stuart Hemming
    Stuart Hemming avatar
    1622 posts
    Member since:
    Jul 2004

    Posted 27 May 2008 Link to this post

    Martin,

    Thanks for that; I'd not thought to look there.

    As I'm using a custom skin and I've not got a FormDecorator.css file, I assume that these setting will come straight from the assembly, yes?

    --
    Stuart
  9. Martin
    Admin
    Martin avatar
    585 posts

    Posted 27 May 2008 Link to this post

    Hi Stuart Hemming,

    Yes, if you are using a custom skin, the necessary settings (the ones that are not skin-specific) will come straight from the assembly, and your code will look like this:

    <input class="MyCustomSkin input" />

    The composite class will apply settings both from your custom css and from FormDecorator.css in the assembly.

    All the best,
    Martin Ivanov
    the Telerik team

    Instantly find answers to your questions at the new Telerik Support Center
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017