locked
HtmlEditorExtender and TextChanged event RRS feed

  • Question

  • User1231912896 posted

    Hello,

    I have discovered taht the TextChanged event of the TextBox that has an AJAX HtmlEditorExtender extension attached does not occur.

    How can I check when the text into the HtmlEditor is changed?

    I need some server side event, in order to save the text into e session variable when the control lost the focus.

    This is my actual code that doesn't work.

    <asp:TextBox runat="server" ID="txtDescrizione" AutoPostBack="True" TextMode="MultiLine" Width="450px" Height="250px" Rows="5" />
    <br />
    <cc1:HtmlEditorExtender ID="htmleeDescrizione" 
            TargetControlID="txtDescrizione"
            runat="server"
            DisplaySourceTab="True"                                                                    
            OnImageUploadComplete="ajaxFileUpload_OnUploadComplete" 
            Enabled="True">
        <Toolbar>
            <cc1:Bold />
            <cc1:Italic />
            <cc1:Underline />
            <cc1:HorizontalSeparator />
            <cc1:JustifyLeft />
            <cc1:JustifyCenter />
            <cc1:JustifyRight />
            <cc1:JustifyFull />
            <cc1:CreateLink />
            <cc1:UnLink />
            <cc1:InsertImage />
        </Toolbar>
    </cc1:HtmlEditorExtender>

    code behind

    if (!Page.IsPostBack)
    {
    	txtDescrizione.TextChanged += new EventHandler(txtDescrizione_LostFocus);
    	//
    	if (Session["txtDescrizione_temp"] != null)
    	{
    		txtDescrizione.Text = Convert.ToString(Session["txtDescrizione_temp"]);
    	}
    }
    
    private void txtDescrizione_LostFocus(object sender, System.EventArgs e)
    {
    	Session["txtDescrizione_temp"] = System.Web.HttpUtility.HtmlDecode(txtDescrizione.Text);
    }



     

    Thursday, November 21, 2013 11:23 AM

Answers

  • User1734617369 posted

    Hi,

    You could try something like this, the page:

    <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="WebApplication12.WebForm1" %>
    
    <%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="asp" %>
    
    <!DOCTYPE html>
    
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <title></title>
        <script>
            function onContentChanged() {
                __doPostBack('txtDescrizione', '');
            }
        </script>
    </head>
    <body>
        <form id="form1" runat="server">
            <asp:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server"></asp:ToolkitScriptManager>
        <div>
            <asp:TextBox runat="server" ID="txtDescrizione" AutoPostBack="True" TextMode="MultiLine" Width="450px" Height="250px" Rows="5" />
            <br />
            <asp:HtmlEditorExtender ID="htmleeDescrizione"
            TargetControlID="txtDescrizione"
            runat="server"
            DisplaySourceTab="True" EnableSanitization="false"
            Enabled="True" OnClientChange="onContentChanged">
        <Toolbar>
            <asp:Bold />
            <asp:Italic />
            <asp:Underline />
            <asp:HorizontalSeparator />
            <asp:JustifyLeft />
            <asp:JustifyCenter />
            <asp:JustifyRight />
            <asp:JustifyFull />
            <asp:CreateLink />
            <asp:UnLink />
            <asp:InsertImage />
        </Toolbar></asp:HtmlEditorExtender>
        </div>
        </form>
    </body>
    </html>

    and the code:

    using System;
    using System.Web.UI;
    
    namespace WebApplication12
    {
        public partial class WebForm1 : System.Web.UI.Page
        {
            protected void Page_Load(object sender, EventArgs e)
            {
                txtDescrizione.TextChanged += new EventHandler(txtDescrizione_LostFocus);
                if (!Page.IsPostBack)
                {                
                    if (Session["txtDescrizione_temp"] != null)
                    {
                        txtDescrizione.Text = Convert.ToString(Session["txtDescrizione_temp"]);
                    }
                }
            }
    
            private void txtDescrizione_LostFocus(object sender, System.EventArgs e)
            {
                Session["txtDescrizione_temp"] = System.Web.HttpUtility.HtmlDecode(txtDescrizione.Text);
            }
        }
    }

    this handles when the editor losts focus and posts it back to the server to be handled by the event handler.

    Best regards
    Johan


    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Thursday, November 21, 2013 4:03 PM

All replies

  • User1734617369 posted

    Hi,

    You could try something like this, the page:

    <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="WebApplication12.WebForm1" %>
    
    <%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="asp" %>
    
    <!DOCTYPE html>
    
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <title></title>
        <script>
            function onContentChanged() {
                __doPostBack('txtDescrizione', '');
            }
        </script>
    </head>
    <body>
        <form id="form1" runat="server">
            <asp:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server"></asp:ToolkitScriptManager>
        <div>
            <asp:TextBox runat="server" ID="txtDescrizione" AutoPostBack="True" TextMode="MultiLine" Width="450px" Height="250px" Rows="5" />
            <br />
            <asp:HtmlEditorExtender ID="htmleeDescrizione"
            TargetControlID="txtDescrizione"
            runat="server"
            DisplaySourceTab="True" EnableSanitization="false"
            Enabled="True" OnClientChange="onContentChanged">
        <Toolbar>
            <asp:Bold />
            <asp:Italic />
            <asp:Underline />
            <asp:HorizontalSeparator />
            <asp:JustifyLeft />
            <asp:JustifyCenter />
            <asp:JustifyRight />
            <asp:JustifyFull />
            <asp:CreateLink />
            <asp:UnLink />
            <asp:InsertImage />
        </Toolbar></asp:HtmlEditorExtender>
        </div>
        </form>
    </body>
    </html>

    and the code:

    using System;
    using System.Web.UI;
    
    namespace WebApplication12
    {
        public partial class WebForm1 : System.Web.UI.Page
        {
            protected void Page_Load(object sender, EventArgs e)
            {
                txtDescrizione.TextChanged += new EventHandler(txtDescrizione_LostFocus);
                if (!Page.IsPostBack)
                {                
                    if (Session["txtDescrizione_temp"] != null)
                    {
                        txtDescrizione.Text = Convert.ToString(Session["txtDescrizione_temp"]);
                    }
                }
            }
    
            private void txtDescrizione_LostFocus(object sender, System.EventArgs e)
            {
                Session["txtDescrizione_temp"] = System.Web.HttpUtility.HtmlDecode(txtDescrizione.Text);
            }
        }
    }

    this handles when the editor losts focus and posts it back to the server to be handled by the event handler.

    Best regards
    Johan


    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Thursday, November 21, 2013 4:03 PM
  • User1231912896 posted

    Hi valuja, thanks a lot!

    Your example works fine, my page is refreshed when the HtmLEditor lost the focus, but after the refresh in my page disappears all the content that is in the master page.

    I have forgot to mention that my "HtmlEditorExtender" is inside an update panel that is inside a "ContentPlaceHolder".

    Any idea on how I can change the code in order to preserve all the master page content?

    Thursday, November 21, 2013 4:58 PM