Support forums » Products » Cute Editor for .NET » Re: How can I customize Insert Image Icon in Cute Editor of Asp.Net

How can I customize Insert Image Icon in Cute Editor of Asp.Net

Last post 12-11-2013, 8:13 AM by Kenneth. 7 replies.
Sort Posts: Previous Next

  •  12-10-2013, 5:33 AM 78554

    How can I customize Insert Image Icon in Cute Editor of Asp.Net

    Reply Quote

    Hi,

     

            I am using Cute Editor in my asp.net website, Now I want to customize the Insert Image icon and in that icon click I

     

    want to show pop up of ASP.Net Image Gallery(Classic Layout), I tried in a sample aspx page, In a button click I am

     

    displaying the Gallery, But in the Cute Editor's Insert Image icon click I have to show it.  

     

    How can I achieve it..

     

    Please help me and try to give quick reply..

     

    Thanks in advance.. 

    Regards,
    Narendra

  •  12-10-2013, 7:57 AM 78558 in reply to 78554

    Re: How can I customize Insert Image Icon in Cute Editor of Asp.Net

    Reply Quote
    hi narendrababu,

     

    You can catch the InsertImage command and cancel this command then execute the InsertGallery command. Below is the full example. 

     

    1. <%@ Page Language="C#" %>  
    2.   
    3. <%@ Register Assembly="CuteEditor" Namespace="CuteEditor" TagPrefix="CE" %>  
    4. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
    5. <html xmlns="http://www.w3.org/1999/xhtml">  
    6. <head id="Head1" runat="server">  
    7.     <title>example</title>  
    8. </head>  
    9. <body>  
    10.     <form id="form1" runat="server">  
    11.         <CE:Editor ID="Editor1" runat="server">  
    12.         </CE:Editor>  
    13.         <script type="text/javascript">  
    14.         function CuteEditor_OnCommand(editor,command,ui,value)  
    15.          {  
    16.             //catch the InsertImage command  
    17.            if(command=="InsertImage")  
    18.            {  
    19.                 //execute command InsertGallery  
    20.                 editor.ExecCommand("ImageGalleryByBrowsing");  
    21.                 //return true to cancel the InsertImage command  
    22.                 return true;  
    23.            }  
    24.              
    25.         }  
    26.         </script>  
    27.     </form>  
    28. </body>  
    29. </html>  
     

    Regards,

     

    Ken 

  •  12-10-2013, 8:22 AM 78560 in reply to 78558

    Re: How can I customize Insert Image Icon in Cute Editor of Asp.Net

    Reply Quote

    I want to display cute soft asp.net Image Gallery on that insert image icon click

     

    How can I achieve it..

    Regards,
    Narendra

  •  12-10-2013, 9:03 AM 78562 in reply to 78560

    Re: How can I customize Insert Image Icon in Cute Editor of Asp.Net

    Reply Quote

    HI narendrababu,

     

    Can you sow me what is the "cute soft asp.net Image Gallery"? It is another product? or is a part of the editor?

     

    Regards,

     

    Ken 

  •  12-10-2013, 9:09 AM 78563 in reply to 78562

    Re: How can I customize Insert Image Icon in Cute Editor of Asp.Net

    Reply Quote

    Hi,

     

    Please Look at this URL

     

    http://cutesoft.net/ASP.NET+Image+Gallery/

     

    I am using this gallery and I want to display this gallery in a popup window on editor's insert image icon click 

     

    Please help me.. 

    Regards,
    Narendra

  •  12-10-2013, 9:27 AM 78564 in reply to 78563

    Re: How can I customize Insert Image Icon in Cute Editor of Asp.Net

    Reply Quote

    Hi,

     

    Below is the full example.

     

    The "CuteEditor_OnCommand" API will catch the InsertImage command and execute custom command "ShowMyDialog".

     

    In "ShowMyDialog" function, the code will open your own page as a dialog for editor. "MyGallery.aspx" should change to your DotNetGallery page location. 

     

    1. <%@ Page Language="C#" %>    
    2.     
    3. <%@ Register Assembly="CuteEditor" Namespace="CuteEditor" TagPrefix="CE" %>    
    4. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">    
    5. <html xmlns="http://www.w3.org/1999/xhtml">    
    6. <head id="Head1" runat="server">    
    7.     <title>example</title>    
    8. </head>    
    9. <body>    
    10.     <form id="form1" runat="server">    
    11.         <CE:Editor ID="Editor1" runat="server">    
    12.         </CE:Editor>    
    13.         <script type="text/javascript">    
    14.         function CuteEditor_OnCommand(editor,command,ui,value)    
    15.          {    
    16.             //catch the InsertImage command    
    17.            if(command=="InsertImage")    
    18.            {    
    19.                 ShowMyDialog();  
    20.                 return true;    
    21.            }    
    22.          
    23.         }    
    24.             function ShowMyDialog()  
    25.             {  
    26.                 var editor1=document.getElementById("<%= Editor1.ClientID %>");  
    27.                 var newwin=editor1.ShowDialog(null,"MyGallery.aspx" ,editor1,"dialogWidth:800px;dialogHeight:840px");  
    28.             }  
    29.         </script>    
    30.     </form>    
    31. </body>    
    32. </html>    
     

    Regards,

     

    Ken 

  •  12-11-2013, 5:54 AM 78570 in reply to 78564

    Re: How can I customize Insert Image Icon in Cute Editor of Asp.Net

    Reply Quote

    Hi,

     

          It's not working for me.. Is there any other way I want to customize 'ImageGallery' button click in the editor.. 

     

    Please try to give Quick reply.. 

    Regards,
    Narendra

  •  12-11-2013, 8:13 AM 78575 in reply to 78570

    Re: How can I customize Insert Image Icon in Cute Editor of Asp.Net

    Reply Quote

    Hi narendrababu,

     

    I have show you how to catch the insertimage button click command, you can achieve your own logic there. What problem you got?

     

    1.   <script type="text/javascript">  
    2.         function CuteEditor_OnCommand(editor,command,ui,value)  
    3.          {  
    4.             //catch the InsertImage command  
    5.            if(command=="InsertImage")  
    6.            {  
    7.                 //achieve your own logic here
    8.                 return true;  
    9.            }  
    10.              
    11.         }  
    12.         </script>  

     

    Regards,

     

    Ken 
View as RSS news feed in XML