Skip to content

Commit b937df3

Browse files
committed
Add how-to about RadEditor content and back button
1 parent d08de28 commit b937df3

File tree

1 file changed

+66
-0
lines changed

1 file changed

+66
-0
lines changed
Lines changed: 66 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,66 @@
1+
---
2+
title: Preserve the Content in RadEditor when Using Back Button
3+
page_title: Preserve the Content in RadEditor when Using Back Button | RadEditor for ASP.NET AJAX Documentation
4+
description: You can learn here possible solutions to preserve content when user has navigated to a page with RadEditor by using the browser's back button.
5+
slug: editor/how-to/preserve-content-on-back-button
6+
tags: back, history, forward, previous, browser, content, preserve, hidden, textarea, form
7+
published: True
8+
position: 11
9+
---
10+
11+
# Preserve the Content in RadEditor when Using Back Button
12+
13+
**RadEditor UI for ASP.NET AJAX** looses its content when user navigates out of the page and comes back by using the **Back** button of the browser. Browsers automatically preserve the content in such scenario only for form elements like `<textarea>`, `<input/>` and so on. **RadEditor**, however, is an editable DOM element that the browser does not consider as a form element field so to preserve its contents automatically.
14+
15+
Possible solutions:
16+
17+
* For **Chrome** and **Firefox**: You can use the `window.onbeforeunload` event in order to detect that user navigates out of the page and save the content of **RadEditor** in its own hidden `<textarea>`.
18+
19+
>caption Example 1: Solution with `window.onbeforeunload` event.
20+
21+
22+
<telerik:RadEditor runat="server" ID="RadEditor" RenderMode="Lightweight"></telerik:RadEditor>
23+
24+
<a href="http://www.telerik.com/">Navigate to www.telerik.com</a>
25+
26+
<script>
27+
window.onbeforeunload = function (ev) {
28+
$find("<%= RadEditor.ClientID %>").saveContent();
29+
};
30+
</script>
31+
32+
33+
* For all browsers: IE cannot preserve the content during `window.onbeforeunload` and you can either save the content in the `<textarea>` while text is being typed in, or by using a `setTimeout` to not affect the performance of your page.
34+
35+
>caption Example 2: Solution with `onkeyup` event.
36+
37+
38+
<telerik:RadEditor runat="server" ID="RadEditor" RenderMode="Lightweight" OnClientLoad="OnClientLoad"></telerik:RadEditor>
39+
40+
<a href="http://www.telerik.com/">Navigate to www.telerik.com</a>
41+
42+
<script>
43+
function OnClientLoad(editor, args) {
44+
editor.attachEventHandler("onkeyup", function (e) {
45+
editor.saveContent();
46+
});
47+
}
48+
</script>
49+
50+
51+
>caption Example 3: Solution with `setInterval` approach.
52+
53+
54+
<telerik:RadEditor runat="server" ID="RadEditor" RenderMode="Lightweight" OnClientLoad="OnClientLoad"></telerik:RadEditor>
55+
56+
<a href="http://www.telerik.com/">Navigate to www.telerik.com</a>
57+
58+
<script>
59+
function OnClientLoad(editor, args) {
60+
setInterval(function () {
61+
editor.saveContent();
62+
}, 5000);
63+
}
64+
</script>
65+
66+

0 commit comments

Comments
 (0)