Enable Save button when content in RadEditor has changed (client-side)

3 posts, 1 answers
  1. scott
    scott avatar
    35 posts
    Member since:
    Mar 2011

    Posted 13 Jun 2014 Link to this post

    I'm trying to achieve the following:

    On a page I have a series of radeditor controls that will load the last saved data. I have a Save button that I do not want to be enabled until the user begins typing or makes a change of some kind into any of the radeditors. I tried the advice on http://www.telerik.com/help/aspnet-ajax/editor-attacheventhandler.html to attach a handler to the "onkeydown" event but it does not seem to be firing at all. "Onclick" works, but not "onkeydown".

    Here is what I have in a demo page:

    <div>
        <telerik:RadScriptManager ID="ScriptManager1" runat="server" >
        </telerik:RadScriptManager>
     
       <telerik:RadCodeBlock ID="RadCodeBlock1" runat="server">
            <script type="text/javascript">
     
                function OnClientLoad(editor, args) {
                    var element = document.all ? editor.get_document().body : editor.get_document();
                    $telerik.addExternalHandler(element, "onkeypress", function (e) {
                        $('#<%=btnSave.ClientID %>').text = "Save";
                        $('#<%=btnSave.ClientID %>').disabled = false;
                    });
                }
         
            </script>
        </telerik:RadCodeBlock>
     
        <telerik:RadEditor runat="server" ID="reText" Height="400px" Width="100%" EditModes="Design" Skin="WebBlue"
            DialogHandlerUrl="~/Telerik.Web.UI.DialogHandler.axd" StripFormattingOnPaste="MSWordRemoveAll"
            StripFormattingOptions="MSWordRemoveAll" AjaxUrl="~/Telerik.Web.UI.SpellCheckHandler.axd" EnableResize="false" OnClientLoad="OnClientLoad" >
        </telerik:RadEditor>
     
        <telerik:RadButton ID="btnSave" runat="server" Text="Current" Enabled="false" />
    </div>


    Any help to achieve my scenario is appreciated!

    Thanks,
    -Scott
  2. scott
    scott avatar
    35 posts
    Member since:
    Mar 2011

    Posted 13 Jun 2014 in reply to scott Link to this post

    Typo in the function, but still the same result

    function OnClientLoad(editor, args) {
     
        var element = document.all ? editor.get_document().body : editor.get_document();
     
        $telerik.addExternalHandler(element, "onkeydown", function (e) {
     
            $('#<%=btnSave.ClientID %>').text = "Save";
     
            $('#<%=btnSave.ClientID %>').disabled = false;
     
        });
     
    }
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Answer
    Shinu
    Shinu avatar
    17764 posts
    Member since:
    Mar 2007

    Posted 16 Jun 2014 in reply to scott Link to this post

    Hi scott,

    Please do the following modification in your JavaScript which works fine at my end.

    JavaScript:
    function OnClientLoad(editor, args) {
        editor.attachEventHandler("onkeypress", function (e) {
            $find("<%=btnSave.ClientID%>").set_text("Save");
            $find("<%=btnSave.ClientID%>").set_enabled(true);
        });
    }

    Thanks,
    Shinu.
Back to Top