Detecting text changes in a nice editor Using jQuery

Question

I developed a small script with some logic to check if the ASP.Net form values ​​have been updated since the page was loaded, so that I can display a message like "You have unsaved changes" to the user if they try to close the browser window or more on another tab in the window browser.

The only control I could not connect with with this script is the WYSIWYG Cute Editor 3rd Party text editing control. The control appears to display using some smoke and mirrors involving an iframe.

Now I tried everything I could to bind the jQuery.change () and .keyup () events to this control, as well as to all other controls, with no luck. It seems I can't catch the changes or actually find the containing control that contains the text.

Has anyone done much with this control or managed to achieve something similar?

Answer 1

almost all wysiwyg editors use an iframe anyway, so you need to get the information out of what you are looking for. For this you can call

$('#myIframe').contents(); 

This gives you an (html) document located in an iframe. You can then attach the item in this document to set up change tracking using any method you are currently using.