[CLOSED] [1.0] FieldSet and RadEdito issue

**x1000** · Nov 05, 2010, 9:17 AM

Hi,

FieldSet has compatibility issue with Telerik Radeditor. The following code is working in IE but not in Chrome and Firefox.

<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<!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></title>
</head>
<body>
    <form id="form1" runat="server">
    <ext:ResourceManager ID="ResourceManager1" runat="server">
    </ext:ResourceManager>
    <asp:ScriptManager ID="ScriptManager1" runat="server">
    </asp:ScriptManager>
    <ext:FieldSet runat="server" Title="My Editor">
        <Content>
            <telerik:RadEditor runat="server"></telerik:RadEditor>
        </Content>
    </ext:FieldSet>
    </form>
</body>
</html>

Regards,
Kheam

**Vladimir** · Nov 05, 2010, 11:47 AM

Hi,

Please provide more details about the issue. Any screenshots? Is it FieldSet or RadEditor issue?

**x1000** · Nov 08, 2010, 12:25 AM

Originally Posted by Vladimir

Hi,

Please provide more details about the issue. Any screenshots? Is it FieldSet or RadEditor issue?

It is FieldSet issue. It works in IE but not in Chrome and Firefox.
The screen shots doesn't see much as it looks the same and nothing wrong.
The issue is that Chrome and Firefox cannot click or focus on RadEditor when RadEditor is in FieldSet.
Please refer to the code on previous post.

Regards,
Kheam

**Vladimir** · Nov 08, 2010, 11:16 AM

Hi,

Why is it FieldSet issue? It is RadEditor is none focusable. If you use HtmlEditor then is the same issue reproducible?
FieldSet just simple html fieldset. If you place RadEditor inside the following markup then do you have the same issue? If yes then I think it is RadEditor issue

<FIELDSET class="x-fieldset">
    <LEGEND style="MozUserSelect: none; KhtmlUserSelect: none" class="x-fieldset-header x-unselectable" unselectable="on">
        <SPAN class="x-fieldset-header-text">
            FieldSet
        </SPAN>
    </LEGEND>
    <DIV class="x-fieldset-bwrap">
        <DIV class="x-fieldset-body">
             // place RadEditor here
        
    
</FIELDSET>

Please provide full test sample for us with telerik assemblies (you can send it to the support email)

**Vladimir** · Nov 09, 2010, 10:34 PM

Hi,

I don't think that it is Ext.Net issue because I was able to reproduce it without Ext.Net

<%@ Page Language="C#" %>
<%@ 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">
    <title></title>
    
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script> 

    <script type="text/javascript">
    
        $(document).ready(function() {
            setTimeout(showEditor, 10);
        });
        
        function showEditor(){
            var el = document.createElement("div"),
                ed = document.getElementById('editorArea');
            
            document.getElementById('form1').appendChild(el);
            el.appendChild(ed);
            ed.style.display = "block";
        }
    </script>
</head>
<body>
    <form id="form1" runat="server">
        <asp:ScriptManager runat="server" />
    
        <div id="editorArea" style="display:none;">
           <telerik:RadEditor ID="RadEditor2" runat="server">
           </telerik:RadEditor>
        </div>
    </form>
</body>
</html>

Therefore I can recommend to address this issue to Telerik support

**x1000** · Nov 10, 2010, 8:16 AM

Hi,

I have posted sample code to Telerik and provided the following solution.

<%@ 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 id="Head1" runat="server">
    <title></title>
       
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
    <telerik:RadCodeBlock ID="CB" runat="server">
    <script type="text/javascript">
 
        $(document).ready(function () {
            setTimeout(showEditor, 10);
        });
 
        function showEditor() {
            var el = document.createElement("div"),
                ed = document.getElementById('editorArea');
 
            document.getElementById('form1').appendChild(el);
            el.appendChild(ed);
            ed.style.display = "block";
            $find("<%=RadEditor2.ClientID%>").onParentNodeChanged();
        }
    </script>
    </telerik:RadCodeBlock>
</head>
<body>
    <form id="form1" runat="server">
        <asp:ScriptManager ID="ScriptManager1" runat="server" />
       
        <div id="editorArea" style="display:none;">
           <telerik:RadEditor ID="RadEditor2" runat="server">
           </telerik:RadEditor>
        </div>
    </form>
</body>
</html>

Yes, it solved the problem above. But, it doesn't resolve the on focus problem radeditor in the ext:fieldset.
What is your suggestion?

**Vladimir** · Nov 10, 2010, 9:51 AM

Hi,

Try to add the following sample

<%@ Page Language="C#" %>

<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<%@ 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">
    <title></title>
    
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
    
    <telerik:RadCodeBlock ID="CB" runat="server">
        <script type="text/javascript">
            function updateEditor() {
                $find("<%=RadEditor1.ClientID%>").onParentNodeChanged();
            }
        </script>
    </telerik:RadCodeBlock>
</head>
<body>
    <form id="form1" runat="server">
    <ext:ResourceManager ID="ResourceManager1" runat="server">
    </ext:ResourceManager>
    <asp:ScriptManager ID="ScriptManager1" runat="server">
    </asp:ScriptManager>
    <ext:FieldSet runat="server" Title="My Editor">
        <Content>
            <telerik:RadEditor ID="RadEditor1" runat="server">
            </telerik:RadEditor>
        </Content>
        <Listeners>
            <AfterRender Fn="updateEditor" Delay="500" />
        </Listeners>
    </ext:FieldSet>
    </form>
</body>
</html>

**x1000** · Nov 11, 2010, 3:48 AM

Originally Posted by Vladimir

Hi,

Try to add the following sample

<%@ Page Language="C#" %>

<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<%@ 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">
    <title></title>
    
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
    
    <telerik:RadCodeBlock ID="CB" runat="server">
        <script type="text/javascript">
            function updateEditor() {
                $find("<%=RadEditor1.ClientID%>").onParentNodeChanged();
            }
        </script>
    </telerik:RadCodeBlock>
</head>
<body>
    <form id="form1" runat="server">
    <ext:ResourceManager ID="ResourceManager1" runat="server">
    </ext:ResourceManager>
    <asp:ScriptManager ID="ScriptManager1" runat="server">
    </asp:ScriptManager>
    <ext:FieldSet runat="server" Title="My Editor">
        <Content>
            <telerik:RadEditor ID="RadEditor1" runat="server">
            </telerik:RadEditor>
        </Content>
        <Listeners>
            <AfterRender Fn="updateEditor" Delay="500" />
        </Listeners>
    </ext:FieldSet>
    </form>
</body>
</html>

It works now. Thank you.

Thread: [CLOSED] [1.0] FieldSet and RadEdito issue

Thread Tools

Search Thread

Display

[CLOSED] [1.0] FieldSet and RadEdito issue

Similar Threads

[CLOSED] [1.3] Fieldset layout

[CLOSED] Fieldset: label issue

[CLOSED] fieldset setCollapse

[CLOSED] [1.0] FieldSet issue

[CLOSED] TabPanel and FieldSet issue

Posting Permissions

Sitemap

Downloads

Resources

Thread: [CLOSED] [1.0] FieldSet and RadEdito issue

[CLOSED] [1.0] FieldSet and RadEdito issue

Similar Threads

Posting Permissions

Sitemap

Downloads

Resources

Stay connected with us