Support forums » Products » Cute Editor for .NET » Re: CuteEditor_OnInitialized(editor) doesn't work when ajax call back in the tab panel

CuteEditor_OnInitialized(editor) doesn't work when ajax call back in the tab panel

Last post 03-29-2010, 10:49 PM by wolf11th. 8 replies.
Sort Posts: Previous Next

  •  03-24-2010, 11:34 PM 59636

    CuteEditor_OnInitialized(editor) doesn't work when ajax call back in the tab panel

    Reply Quote

    Hi there,
    I have a cuteeditor in tabpanel of a tabcontainer.
    I use following code to resize the editor. However, for any ajax postback, it will report the following error message. Is there any way to overcome this problem? thx

    error message : Microsoft JScript runtime error: Object doesn't support this property or method


    Partial Class Test3

    Inherits System.Web.UI.Page

    Protected Sub Button1_Click(ByVal sender As Object, ByVal e As System.EventArgs) Handles Button1.Click

    Dim aa As String = ""

    End Sub

    End Class


    ________________________________________________________________________________________________________________________________
     
     
     
     

    <%@ Page Language="VB" AutoEventWireup="false" CodeFile="Test3.aspx.vb" Inherits="Test3" %>

    <%@ Register Assembly="CuteEditor" Namespace="CuteEditor" TagPrefix="CE" %>

    <%@ Register Assembly="System.Web.Extensions, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"

    Namespace="System.Web.UI" TagPrefix="asp" %>

    <%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc1" %>

    <!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">

    <div>

    <asp:ScriptManager ID="ScriptManager1" runat="server">

    </asp:ScriptManager>

    <asp:UpdatePanel ID="UpdatePanel1" runat="server">

    <ContentTemplate>

    <asp:Button ID="Button1" runat="server" Text="Button" />

    <cc1:TabContainer ID="TabContainer1" runat="server">

    <cc1:TabPanel runat="server" HeaderText="Surveyors Section" ID="TabPanel1" Height="100%">

    <HeaderTemplate>

    <div>

    123</div>

    </HeaderTemplate>

    <ContentTemplate>

    <div id="div1" style="overflow: auto;">

    asdfsdaf

    </div>

    </ContentTemplate>

    </cc1:TabPanel>

    <cc1:TabPanel runat="server" HeaderText="Surveyors Section" ID="TabPanelSurveyor"

    Height="100%">

    <HeaderTemplate>

    <div>

    Surveyors Section</div>

    </HeaderTemplate>

    <ContentTemplate>

    <div id="divSurveyor" style="overflow: auto;">

    <CE:Editor ID="Editor1" runat="server">

    </CE:Editor>

    </div>

    </ContentTemplate>

    </cc1:TabPanel>

    </cc1:TabContainer>

    </ContentTemplate>

    </asp:UpdatePanel>

    </div>

    </form>

    </body>

    </html>

    <script type="text/javascript">

    var editor1 = document.getElementById('<%= Editor1.ClientID %>');

    function CuteEditor_OnInitialized(editor) {

    if (editor1 != null) {

    editor1.SetHeight(document.documentElement.clientHeight - 70 - 70 - 50);

    }

    }

    window.onresize = function() {

    if (editor1 != null) {

    editor1.SetHeight(document.documentElement.clientHeight - 70 - 70 - 50);

    }

    }

     
     
     
     
     
     
     


     

  •  03-25-2010, 12:05 AM 59638 in reply to 59636

    Re: CuteEditor_OnInitialized(editor) doesn't work when ajax call back in the tab panel

    Reply Quote
    It seems to be with the ajax update panel, but not the problem with tabcontainer. I can reproduce the error without the tabcontainer in the ajax update panel.
    desperate
    pls help

  •  03-25-2010, 12:24 AM 59639 in reply to 59638

    Re: CuteEditor_OnInitialized(editor) doesn't work when ajax call back in the tab panel

    Reply Quote
    the error message is located at:
    editor1.SetHeight(document.documentElement.clientHeight - 70 - 70 - 50);
     
    it seems taht the editor1 loses the method setheight after ajax postback.
     
     

  •  03-25-2010, 12:44 AM 59640 in reply to 59639

    Re: CuteEditor_OnInitialized(editor) doesn't work when ajax call back in the tab panel

    Reply Quote
    I've managed this problem by following code:

    document.getElementById('<%= cmsSurveyorComment.ClientID %>').style.height=document.documentElement.clientHeight - 70 - 70 - 50;

     
    It seems that setHeight doesn't work after ajax postback. Hopefully you can fix it in the next version.
     

  •  03-25-2010, 6:18 AM 59644 in reply to 59640

    Re: CuteEditor_OnInitialized(editor) doesn't work when ajax call back in the tab panel

    Reply Quote
    it turns out it's too early to say it's addressed. actually   following command doesn't work in firefox and chrome.
    document.getElementById('<%= cmsSurveyorComment.ClientID %>').style.height=document.documentElement.clientHeight - 70 - 70 - 50;
     
    anyone has any idea? please help~~~

  •  03-26-2010, 2:07 AM 59666 in reply to 59644

    Re: CuteEditor_OnInitialized(editor) doesn't work when ajax call back in the tab panel

    Reply Quote
    Hi wolf11th,
     
    Please download the latest version and tes the example below. This issue have been fixed in version 6.6.
     
    1. <%@ Page Language="C#" %>   
    2.   
    3. <%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc1" %>   
    4. <%@ Register Assembly="CuteEditor" Namespace="CuteEditor" TagPrefix="CE" %>   
    5. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">   
    6. <html xmlns="http://www.w3.org/1999/xhtml">   
    7. <head runat="server">   
    8.     <title>example</title>   
    9. </head>   
    10. <body>   
    11.     <form id="form1" runat="server">   
    12.     <div>   
    13.         <asp:ScriptManager ID="ScriptManager1" runat="server">   
    14.         </asp:ScriptManager>   
    15.         <asp:UpdatePanel ID="UpdatePanel1" runat="server">   
    16.             <ContentTemplate>   
    17.                 <asp:Button ID="Button1" runat="server" Text="Do PostBack" />   
    18.                 <cc1:TabContainer ID="TabContainer1" runat="server">   
    19.                     <cc1:TabPanel runat="server" HeaderText="Surveyors Section" ID="TabPanel1" Height="100%">   
    20.                         <HeaderTemplate>   
    21.                             <div>   
    22.                                 tab1</div>   
    23.                         </HeaderTemplate>   
    24.                         <ContentTemplate>   
    25.                             tab1 text   
    26.                         </ContentTemplate>   
    27.                     </cc1:TabPanel>   
    28.                     <cc1:TabPanel runat="server" HeaderText="Surveyors Section" ID="TabPanelSurveyor">   
    29.                         <HeaderTemplate>   
    30.                             tab2   
    31.                         </HeaderTemplate>   
    32.                         <ContentTemplate>   
    33.                             <div id="divSurveyor" style="overflow: auto;">   
    34.                                 <CE:Editor ID="Editor1" runat="server" Height="400" ShowPreviewMode="False" ResizeMode="None">   
    35.                                 </CE:Editor>   
    36.                             </div>   
    37.                         </ContentTemplate>   
    38.                     </cc1:TabPanel>   
    39.                 </cc1:TabContainer>   
    40.             </ContentTemplate>   
    41.         </asp:UpdatePanel>   
    42.     </div>   
    43.     </form>   
    44. </body>   
    45. </html>   
    46.   
    47. <script>   
    48. function CuteEditor_OnInitialized(editor)   
    49. {   
    50.   editor.SetHeight("1000");   
    51. }   
    52. </script>  
    Regards,
     
    ken

  •  03-28-2010, 12:38 AM 59688 in reply to 59666

    Re: CuteEditor_OnInitialized(editor) doesn't work when ajax call back in the tab panel

    Reply Quote
    thx Ken,
    Your code works fine. however,  I have more than 1 editor which are in different tabpanel. different editor would have differnt screen size. How can I indentify each editor? and also I need to resize the editor screen when window.onresize happens. I actually tried to use following code which is provided by you in another replay. 
    It is NOT working ~~~ Can you pls help
     

    var editor1 = document.getElementById('<%= Editor1.ClientID %>');

    function CuteEditor_OnInitialized(editor) {

    if (editor1 != null) {

    editor1.SetHeight(document.documentElement.clientHeight - 70 - 70 - 50);

    }

    }

    window.onresize = function() {

    if (editor1 != null) {

    editor1.SetHeight(document.documentElement.clientHeight - 70 - 70 - 50);

    }

    }

     

  •  03-29-2010, 2:04 AM 59700 in reply to 59688

    Re: CuteEditor_OnInitialized(editor) doesn't work when ajax call back in the tab panel

    Reply Quote
    hi wolf11th ,
     
    Try
     
    1. <%@ Page Language="C#" %>   
    2.   
    3. <%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc1" %>   
    4. <%@ Register Assembly="CuteEditor" Namespace="CuteEditor" TagPrefix="CE" %>   
    5. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">   
    6.   
    7. <html xmlns="http://www.w3.org/1999/xhtml">   
    8. <head runat="server">   
    9.     <title>example</title>   
    10. </head>   
    11. <body>   
    12.     <form id="form1" runat="server">   
    13.     <div>   
    14.         <asp:ScriptManager ID="ScriptManager1" runat="server">   
    15.         </asp:ScriptManager>   
    16.         <asp:UpdatePanel ID="UpdatePanel1" runat="server">   
    17.             <ContentTemplate>   
    18.                 <asp:Button ID="Button1" runat="server" Text="Do PostBack" />   
    19.                 <cc1:TabContainer ID="TabContainer1" runat="server">   
    20.                     <cc1:TabPanel runat="server" HeaderText="Surveyors Section" ID="TabPanel1" Height="100%">   
    21.                         <HeaderTemplate>   
    22.                             <div>   
    23.                                 tab1</div>   
    24.                         </HeaderTemplate>   
    25.                         <ContentTemplate>   
    26.                             tab1 text   
    27.                         </ContentTemplate>   
    28.                     </cc1:TabPanel>   
    29.                     <cc1:TabPanel runat="server" HeaderText="Surveyors Section" ID="TabPanelSurveyor">   
    30.                         <HeaderTemplate>   
    31.                             tab2   
    32.                         </HeaderTemplate>   
    33.                         <ContentTemplate>   
    34.                             <div id="divSurveyor" style="overflow: auto;">   
    35.                                 <CE:Editor ID="Editor1" runat="server" Height="400" ShowPreviewMode="False" ResizeMode="None">   
    36.                                 </CE:Editor>   
    37.                             </div>   
    38.                         </ContentTemplate>   
    39.                     </cc1:TabPanel>   
    40.                     <cc1:TabPanel runat="server" HeaderText="Surveyors Section" ID="TabPanel2">   
    41.                         <HeaderTemplate>   
    42.                             tab3   
    43.                         </HeaderTemplate>   
    44.                         <ContentTemplate>   
    45.                             <div id="div1" style="overflow: auto;">   
    46.                                 <CE:Editor ID="Editor2" runat="server" Height="400" ShowPreviewMode="False" ResizeMode="None">   
    47.                                 </CE:Editor>   
    48.                             </div>   
    49.                         </ContentTemplate>   
    50.                     </cc1:TabPanel>   
    51.                 </cc1:TabContainer>   
    52.             </ContentTemplate>   
    53.         </asp:UpdatePanel>   
    54.     </div>   
    55.     </form>   
    56. </body>   
    57. </html>   
    58.   
    59. <script>   
    60. var e1=false;   
    61. var e2=false;   
    62. function CuteEditor_OnInitialized(editor)   
    63.   
    64. {   
    65. var editor1=document.getElementById("<%= Editor1.ClientID %>");   
    66. var editor2=document.getElementById("<%= Editor2.ClientID %>");   
    67.   
    68. switch (editor.id) {    
    69. case editor1.id:    
    70.   editor1.SetHeight("1000");   
    71.   e1=true;   
    72.   
    73. break;    
    74. case editor2.id:    
    75. editor2.SetHeight("300");    
    76. e2=true;   
    77. break;    
    78. }    
    79.   
    80. }   
    81. //you can use the code below to change the editor size. but switch between tab will Activation function window.onresize   
    82. //window.onresize=function()   
    83. //{   
    84.   
    85. //var editor1=document.getElementById("<%= Editor1.ClientID %>");   
    86. //var editor2=document.getElementById("<%= Editor2.ClientID %>");   
    87. //if(e1==true)   
    88. //{   
    89. //  editor1.SetHeight("100");   
    90. //}   
    91.   
    92. //if(e2==true)   
    93. //{   
    94. //  editor2.SetHeight("200");   
    95. //}   
    96. //}   
    97. </script>  
    Regards,
     
    Ken

  •  03-29-2010, 10:49 PM 59729 in reply to 59700

    Re: CuteEditor_OnInitialized(editor) doesn't work when ajax call back in the tab panel

    Reply Quote
    thx Ken, that works
View as RSS news feed in XML