Support forums » Products » Cute Editor for .NET » Re: CuteEditor - IE 11 Problem: Cannot get passed information from editor content in custom dialog form with IE 11

CuteEditor - IE 11 Problem: Cannot get passed information from editor content in custom dialog form with IE 11

Last post 05-16-2014, 11:36 AM by wzou. 9 replies.
Sort Posts: Previous Next

  •  05-12-2014, 10:29 AM 80289

    CuteEditor - IE 11 Problem: Cannot get passed information from editor content in custom dialog form with IE 11

    Reply Quote

    I use this function (var newwin = editor.ShowDialog(null, mURL, editor, mSize);)  to open a custom dialog window. 

     

    In dialog form, I use function as bellow to get text selection from editor control. It works fine. 

    But in IE 11, argument "window" is not a object. So I cannot get selected text in editor.

     

    --------------------------------------------------------------------------------------

    var editor = Window_GetDialogArguments(window); 

     

     function Window_GetDialogArguments(win) {

                        var top = win.top;

                        try {

                            var opener = top.opener;

                            if (opener && opener.document._dialog_arguments)

                                return opener.document._dialog_arguments;

                        }

                        catch (x) {

                        }

                        if (top.document._dialog_arguments)

                            return top.document._dialog_arguments;

                        if (top.dialogArguments)

                            return top.dialogArguments;

                        return top.document._dialog_arguments;

       } 

  •  05-12-2014, 1:03 PM 80290 in reply to 80289

    Re: CuteEditor - IE 11 Problem: Cannot get passed information from editor content in custom dialog form with IE 11

    Reply Quote

    Hi,

     

    I just checked the demo http://cutesoft.net/example/howto/AddDialogs/cs/create_a_custom_dialog.aspx  on IE11, it works fine. can you try it too? if the demo works for you, then please use the same method on your own page and try again.

     

    Regards,

     

    Ken 

  •  05-13-2014, 12:18 PM 80291 in reply to 80290

    Re: CuteEditor - IE 11 Problem: Cannot get passed information from editor content in custom dialog form with IE 11

    Reply Quote
     Hi Ken:
    Thanks for the demo code. Using this code, it inserts the new text from the dialog window by replacing the existing highlighted text in the parent window. We need to pass the highlighted text from the parent window to the dialog window and then insert the new text while keeping the highlighted text .

  •  05-13-2014, 2:03 PM 80292 in reply to 80291

    Re: CuteEditor - IE 11 Problem: Cannot get passed information from editor content in custom dialog form with IE 11

    Reply Quote

    Hi wzou,

     

    Please try the new example code below. I have correct it to match your requirement. it will work with IE11 too.

     

    1. create_a_custom_dialog.aspx  code

     

    1. <%@ Register TagPrefix="CE" Namespace="CuteEditor" Assembly="CuteEditor" %>  
    2. <%@ Page language="c#"%>  
    3. <html>  
    4. <head>  
    5.     <title>ASP.NET WYSIWYG Editor - How to create a custom button which displays a dialog?</title>  
    6.   
    7.     <script language="JavaScript" type="text/javascript">  
    8.             function ShowMyDialog(button)  
    9.             {  
    10.                 //use CuteEditor_GetEditor(elementinsidetheEditor) to get the cute editor instance  
    11.                 var editor=CuteEditor_GetEditor(button);  
    12.                 //show the dialog page , and pass the editor as newwin.dialogArguments  
    13.                 //(handler,url,args,feature)  
    14.                 var newwin=editor.ShowDialog(null,"My_Custom_Text.html?_rand="+new Date().getTime()  
    15.                     ,editor,"dialogWidth:400px;dialogHeight:240px");  
    16.             }  
    17.     </script>  
    18.   
    19.     <style>  
    20.         body {   
    21.         text-align: center;   
    22.         margin-top:20px  
    23.         }  
    24.         .demo {   
    25.         text-align: left;   
    26.         width: 800px;  
    27.         padding: 30px 30px 50px 30px;   
    28.         font-family:Segoe UI, Arial,Verdana,Helvetica,sans-serif;  
    29.         font-size: 100%;  
    30.         margin: 0 auto;   
    31.         }   
    32.     </style>  
    33. </head>  
    34. <body>  
    35.     <form runat="server" id="Form1">  
    36.         <div class="demo">  
    37.             <h3>  
    38.                 How to create a custom button which displays a dialog?</h3>  
    39.             <p>  
    40.                 In this example, first we get the location of Italic button. Then we add a custom  
    41.                 dialog after it.</p>  
    42.             <CE:Editor id="Editor1" ThemeType="OfficeXP" AutoConfigure="Minimal" runat="server" />  
    43.         </div>  
    44.     </form>  
    45. </body>  
    46. </html>  
    47. <script runat="server">  
    48.     private void Page_Load(object sender, System.EventArgs e)  
    49.     {  
    50.         //about Italic, see Full.config  
    51.         //<item type="image" name="Italic" imagename="Italic" />  
    52.         //get the pos after the Italic  
    53.         int pos=Editor1.ToolControls.IndexOf("Italic")+1;  
    54.   
    55.         //Themes/%ThemeName%/Images/text.gif  
    56.         WebControl ctrl=Editor1.CreateCommandButton("MyButton","text.gif","Insert My Custom Text");  
    57.   
    58.         ctrl.Attributes["onclick"]="ShowMyDialog(this)";  
    59.       
    60.         //add this custom button into the editor  
    61.         Editor1.InsertToolControl(pos,"MyButton",ctrl);  
    62.     }  
    63. </script>  
     

    2. My_Custom_Text.html  code

     

    1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">  
    2. <html>  
    3.     <head>  
    4.         <title>Insert Text</title>  
    5.     </head>  
    6.     <body bgcolor="#d4d0c8">  
    7.         <div align="center" style="padding:8px">  
    8.             <textarea rows="6" cols="40" id="ta" NAME="ta">Type content here</textarea>  
    9.             <br>  
    10.             <button onclick="button_click()" ID="Button1">Insert It</button>  
    11.             <button onclick="window.top.close();" ID="Button2">Close</button>  
    12.         </div>  
    13.     </body>  
    14.     <script>  
    15.     function button_click()  
    16.     {  
    17.         var editor=Window_GetDialogArguments(window);  
    18.         var ta=document.getElementById("ta");  
    19.         editor.FocusDocument();   
    20.         editor.PasteHTML(ta.value);  
    21.     }  
    22.     //Window_GetDialogArguments.js  
    23.     function Window_GetDialogArguments(win)  
    24.     {  
    25.         var top=win.top;  
    26.         try  
    27.         {  
    28.             var opener=top.opener;  
    29.             if(opener&&opener.document._dialog_arguments)  
    30.                 return opener.document._dialog_arguments;  
    31.         }  
    32.         catch(x)  
    33.         {  
    34.         }  
    35.           
    36.         if(top.document._dialog_arguments)  
    37.             return top.document._dialog_arguments;  
    38.         if(top.dialogArguments)  
    39.             return top.dialogArguments;  
    40.         return top.document._dialog_arguments;  
    41.     }  
    42.     window.onload=function()  
    43.     {  
    44.         var editor=Window_GetDialogArguments(window);  
    45.         var ta=document.getElementById("ta");  
    46.         ta.value= getSelectedHTML(editor);  
    47.        
    48.     }  
    49.     function getSelectedHTML(editor)        
    50.         {           
    51.               var rng=null,html="";              
    52.                    
    53.               // get the active editor document     
    54.               var editdoc = editor.GetDocument();     
    55.             
    56.               // get the active editor window      
    57.               var editwin = editor.GetWindow();        
    58.               if (document.selection && document.selection.createRange)        
    59.               {          
    60.                     rng=editdoc.selection.createRange();        
    61.                    if( rng.htmlText )         
    62.                    {         
    63.                       html=rng.htmlText;         
    64.                    }         
    65.                    else if(rng.length >= 1)         
    66.                    {         
    67.                       html=rng.item(0).outerHTML;         
    68.                    }        
    69.               }        
    70.               else if (window.getSelection)        
    71.               {        
    72.                     rng=editwin.getSelection();        
    73.                     
    74.                     if (rng.rangeCount > 0 && window.XMLSerializer)        
    75.                     {        
    76.                           html=rng.getRangeAt(0);       
    77.                     }        
    78.               }        
    79.               return html;        
    80.         }     
    81.     </script>  
    82. </html>  
     

    Regards,

     

    Ken 

  •  05-13-2014, 5:17 PM 80294 in reply to 80292

    Re: CuteEditor - IE 11 Problem: Cannot get passed information from editor content in custom dialog form with IE 11

    Reply Quote

    Ken,

     

    Thank you for new sample code! It works in IE11.

     

    Thanks!

     

    Wei 

  •  05-15-2014, 9:39 AM 80295 in reply to 80292

    Re: CuteEditor - IE 11 Problem: Cannot get passed information from editor content in custom dialog form with IE 11

    Reply Quote

    Hi Ken:


    Thanks for the code. It works in IE11. 

     

    But it is not working  in  IE10 and IE9. I also tried in your demo site. The inserted text always goes top of the editor's content. 

     

    Any advice?

     

    Wei 

     

  •  05-15-2014, 11:21 AM 80296 in reply to 80295

    Re: CuteEditor - IE 11 Problem: Cannot get passed information from editor content in custom dialog form with IE 11

    Reply Quote

    Hi wzou,

     

    Can you try the demo page I provided directly? Does it get the same problem too? It works fine on my IE10.

     

    Regards,

     

    Ken 

  •  05-15-2014, 3:56 PM 80297 in reply to 80296

    Re: CuteEditor - IE 11 Problem: Cannot get passed information from editor content in custom dialog form with IE 11

    Reply Quote

    Hi Ken,

     

    I tried your page is works in IE10.

     

    The problem is that my popup dialog form is aspx page and has postpack action. After postback, the dialog window cannot keep the position of editor's content. This happened in IE10 and IE9. Other browsers are worked fine.

     

    Wei 

  •  05-15-2014, 4:44 PM 80298 in reply to 80297

    Re: CuteEditor - IE 11 Problem: Cannot get passed information from editor content in custom dialog form with IE 11

    Reply Quote

    Hi wzou,

     

    Can you create the example which can reproduce this issue and send it to [email protected]? So I can check it directly on my end.

     

    Regards,

     

    Ken 

  •  05-16-2014, 11:36 AM 80301 in reply to 80298

    Re: CuteEditor - IE 11 Problem: Cannot get passed information from editor content in custom dialog form with IE 11

    Reply Quote

    Hi Ken,

     

    Finally I got it works in IE10. I missed "editor.FocusDocument();" from your code.

     

    Thank you!

     

    Wei 
View as RSS news feed in XML