FormDecorator does not render valid XHTML

9 posts, 0 answers
  1. jlevine
    jlevine avatar
    7 posts
    Member since:
    Aug 2008

    Posted 06 Nov 2008 Link to this post

    I am using version 2008.3.1105.20.  When I place a FormDecorator on my page, the resulting HTML is not valid XHTML 1.0 Transitional, according to validator.w3.org.  Here is a simple ASPX page:

    <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Test.aspx.cs" Inherits="Test" %> 
     
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
    <html xmlns="http://www.w3.org/1999/xhtml"
    <head runat="server"
        <title>Untitled Page</title> 
    </head> 
    <body> 
        <form id="form1" runat="server"
            <asp:ScriptManager ID="ScriptManager" runat="server" EnablePartialRendering="true" /> 
            <telerik:RadFormDecorator ID="formDecorator" runat="server" DecoratedControls="All" /> 
            <p> 
                <asp:RadioButtonList ID="rbList" runat="server" RepeatDirection="Vertical" RepeatLayout="Flow"
                    <asp:ListItem Text="Option #1" /> 
                    <asp:ListItem Text="Option #2" /> 
                    <asp:ListItem Text="Option #3" /> 
                </asp:RadioButtonList> 
            </p> 
            <p> 
                <asp:Button ID="btnNext" runat="server" Text="Submit" /> 
            </p> 
        </form> 
    </body> 
    </html> 
     

    The generated HTML is invalid because a STYLE tag can not be placed within the BODY - it must be inside the HEAD.  Any thoughts?  I would much prefer that my site be 100% valid XHTML 1.0 Transitional.







  2. PureCode
    PureCode avatar
    97 posts
    Member since:
    Jul 2006

    Posted 06 Nov 2008 Link to this post

    Oh, it gets 'worse', try pulling the Telerik DLL(s) through FXCop, just for a laugh.

    Regards,

    Mike
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Georgi Tunev
    Admin
    Georgi Tunev avatar
    7207 posts

    Posted 07 Nov 2008 Link to this post

    Hello jlevine ,

    We are familiar with this issue. Currently there is no workaround for that but we are working on and it will be fixed soon. Here is some additional information:
    In general, RadFormDecorator decorates the controls on the client. This leads to undesired effect similar to flickering when the page is initially loaded - the users were able to see the un-decorated controls first. To fix this problem, we added an additional style on the page that was placed in the head section. This fixed the problem, but raised another one when RadStyleSheetManager (that combines all the styles) was used.
    Currently we are researching different options to fix that problem and once we have a solution, we will provide a hotfix right away. If however, at this point it is mandatory for you to have 100% valid XHTML output, our suggestion is not to use RadFormDecorator for now.



    All the best,
    Georgi Tunev
    the Telerik team

    Check out Telerik Trainer, the state of the art learning tool for Telerik products.
  5. DGDev
    DGDev avatar
    42 posts
    Member since:
    Jul 2012

    Posted 13 Nov 2008 Link to this post

    In response to Mike,
    I've just ran a scan on FXCop, and although it seems there are loads of problems, most are insignificant and can be easily fixed by refactoring the code. I'm curious if Telerik's developers use a tool such as Resharper whilst coding? Is the code written for C# 3.0 or 2.0?

    I would estimate at least 70% of those "errors" would be eliminated via refactoring, not to mention the code would be more efficient.
  6. Martin
    Admin
    Martin avatar
    585 posts

    Posted 17 Nov 2008 Link to this post

    Hello DGDev,

    There is a workaround that will make the generated code by RadFormDecorator valid. You may use the EnableEmbeddedSkins and EnableEmbeddedBaseStylesheet properties set to false in the server declaration. Then you have to copy the FormDecorator.css and FormDecorator.SkinName.css along with its images in a directory on your server and finally register these files in the head section of your web page manually using the link tag.

    Setting EnableEmbeddedSkins and EnableEmbeddedBaseStylesheet to false will prevent loading the css files from the assembly and their improper placement in the body instead of the head of the page. You may find the skin you are about to use in the installation directory of RadControls for ASP.Net AJAX under the Skins folder.

    We are sorry for this issue. It will be fixed soon.

    Regards,
    Martin Ivanov
    the Telerik team

    Check out Telerik Trainer, the state of the art learning tool for Telerik products.
  7. Duane Faithen
    Duane Faithen avatar
    14 posts
    Member since:
    Jun 2005

    Posted 29 Jan 2009 Link to this post

    Has any progress been made on this? The remaining validation errors seem like they should be a no brainer to remedy.

    Here is a simple demo. I have added my notes below on how I believe both issues can be remedied.

    <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default2.aspx.cs" Inherits="Default2" %> 
    <%@ Register assembly="Telerik.Web.UI" namespace="Telerik.Web.UI" tagprefix="telerik" %> 
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
     
    <html xmlns="http://www.w3.org/1999/xhtml">  
    <head runat="server">  
        <meta http-equiv="Content-Type" content="text/html;charset=utf-8" /> 
        <title></title>  
    </head> 
    <body> 
        <form id="form1" runat="server">  
        <asp:ScriptManager LoadScriptsBeforeUI="true" ScriptMode="Release" ID="ScriptManager1" runat="server" /> 
        <div> 
        <telerik:RadFormDecorator   
            ID="dec1"   
            runat="server"   
            Skin="Office2007"   
            DecoratedControls="CheckBoxes,TextBox,Buttons" /> 
            <asp:Button ID="test" Text="test" runat="server" /> 
        </div> 
        </form> 
    </body> 
    </html> 

    1. The below  style element is added in the body instead of the head

    <style id="dec1_hiddenInputsStyle" type="text/css">  
    input, textarea, button, /*select*/  
    {  
        visibility: hidden !important;  
    }  
    </style> 

    the script below could only needs to be hidden from validaor by adding it to a cdata block as is done in most other instances of client side script in your controls. This:

    <script type="text/javascript">  
    if (typeof(Telerik) != 'undefined')  
    {  
        if (Telerik.Web.UI.RadFormDecorator && Telerik.Web.UI.RadFormDecorator.addBodyClassname)  
        {  
            Telerik.Web.UI.RadFormDecorator.addBodyClassname('Office2007');  
        }  
    }  
    </script> 
     
    I believe should be this:

    <script type="text/javascript">  
    //<![CDATA[
    if (typeof(Telerik) != 'undefined')   
    {   
        if (Telerik.Web.UI.RadFormDecorator && Telerik.Web.UI.RadFormDecorator.addBodyClassname)   
        {   
            Telerik.Web.UI.RadFormDecorator.addBodyClassname('Office2007');   
        }   
    }
    //]]> 
    </script>    
     

    I apologize in advance if this has been patched somewhere that I am not finding. FYI i am using 2008.3.1314.35 in asp.net 3.5

    Thanks,
    Duane
  8. Georgi Tunev
    Admin
    Georgi Tunev avatar
    7207 posts

    Posted 30 Jan 2009 Link to this post

    Hi Duane Faithen,

    Yes, we know that the style should not be in the body, but currently this is the only way to avoid the initial flickering of the decorated controls when the page is initially loaded. We are currently working on finding another solution and hopefully we will be ready with it for the Q1 2009 release.

    As for the CDATA approach - thank you for the feedback. Your points were updated.


    Regards,
    Georgi Tunev
    the Telerik team

    Check out Telerik Trainer, the state of the art learning tool for Telerik products.
  9. Mark
    Mark avatar
    7 posts
    Member since:
    Oct 2008

    Posted 28 Mar 2009 Link to this post

    It isn't only that the <style> tags should not be within the <body>. There are two other issues:

    1) The style tags have no type. type should be of text/css. Like so:

    <style type="text/css">
    /* blah blah */
    </style>

    2) The <style> tags are being placed within <span> tags by the control. So the browser attempts to repair that bug by closing the <span> tags. but that just creates additional problems as it then has to open more <span> tags later when it finds the </span> tags that telerik have added.

    All-in-all a very unsatisfactory solution. I am removing this control from my pages.

    PS: The developer who added this telerik control doesn't understand html or xhtml (everything else he writes it wrong too.) Some asp.net developers should read a book or two on css and html before they wreck anymore havok on the world.

    Surely everything the RadFormDecorator does could be done properly with css anyway?  I'm going to find out by removing it.

    PS: Why didn't telerik give the developers the option of placing the styles in the head ?  Does telerik really think that by depriving developers of the freedom to control their webpages that they will gain any customers?

  10. DGDev
    DGDev avatar
    42 posts
    Member since:
    Jul 2012

    Posted 29 Mar 2009 Link to this post

    Mark, this has been fixed in the newest copy of RadControls '09. Also, Telerik has stated that the styles were applied within the body, as it was a temporary solution to fix a bug which caused flickering on page load ... if I'm not mistaken. Hope this helps.

    There are quite a few posts about this:
    http://www.telerik.com/community/forums/aspnet-ajax/form-decorator/reported-q1-sp2-build-2008-1-619-problems-and-their-solutions.aspx
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017