For the time being you can disable the StripCssExpressions filter: protected void Page_Load(object sender, EventArgs e) { RadEditor1.DisableFilter(Telerik.Web.UI.EditorFilters.StripCssExpressions); } Alternative approach to fix the issue is removing the StripCssExpressions filter from the client-side filters collection, so that the server-side functionality could still sanitize the HTML content: <telerik:RadEditor runat="server" ID="RadEditor1" OnClientInit="OnClientInit"> </telerik:RadEditor> <script type="text/javascript"> function OnClientInit(sender, args) { sender.set_contentFilters(sender.get_contentFilters() - Telerik.Web.UI.EditorFilters.StripCssExpressions); } </script>
The RadWindow used to hold the toolbar does not have a proper width set and the toolbar's layout is unusable. Possible workarounds: - avoid setting the Width property of the editor in percent - set the ToolsWidth property to the desired static value - use the following script to calculate the current dimensions each time the toolbar shows up: function OnClientLoad(sender, args) { var toolPopup = sender.get_toolAdapter().get_window(); toolPopup.__editor = sender; toolPopup.add_show(resizeToolWindow); } function resizeToolWindow(sender, args) { if (sender.__editor) { var editorDims = $telerik.getBounds(sender.__editor.get_element()); sender.set_width(editorDims.width); var currDims = sender.getWindowBounds(); sender.moveTo(editorDims.x, editorDims.y - currDims.height - 10); } } where the OnClientLoad function is attached to the OnClientLoad event of the editor Leave your comment on the desired behavior - whether the toolbar should have a static width (i.e., the initial width with which the editor renders, as is the current behavior with the ShowOnFocus ToolbarMode), or whether it should update its width according to the editor width when it shows up (as the script above does).
When pasting a list element in the editor via the pasteHtml method, the cursor is positioned in the beginning of the first possible list element. The expected behavior should be to be placed right after the last list item.
In this scenario the EncodeScripts and RemoveScripts filters are disabled, so that script tags can be inserted. Using a script tag with some HTML content after it and submit when still on HTML mode, the content after the script tag will be removed. For the time being you can workaround this problem by forcing the editor to switch to Design mode on submitting: <telerik:RadEditor ID="RadEditor2" runat="server" OnClientSubmit="OnClientSubmit"> </telerik:RadEditor> <script> function OnClientSubmit(sender, args) { sender.set_mode(Telerik.Web.UI.EditModes.Design); } </script>
The JS error also causes the tool to break, and all table-related tools are not available in RibbonBar mode.
RadEditor Find/Replace functionalities are not working in IE. The following workaround could be used temporarily: <script type="text/javascript"> var $T = Telerik.Web.UI; Telerik.Web.UI.RadEditor.prototype.setActive = function () { if (this._emptyMessageContainer) this._hideEmptyMessage(); if ($telerik.isIE && this.getSelection().isControl()) return; var curArea = this.get_mode() == $T.EditModes.Html ? this._getTextArea() : this.get_contentArea(); if (curArea && curArea.setActive) curArea.setActive(); }; Telerik.Web.UI.RadEditor.prototype.setActiveIfElementIsNotInContent = function () { if (this._emptyMessageContainer) this._hideEmptyMessage(); if ($telerik.isIE && this.getSelection().isControl()) return; var curArea = this.get_mode() == $T.EditModes.Html ? this._getTextArea() : this.get_contentArea(); var activeElement = this.get_document().activeElement; var activeElementIsInContent = (activeElement && activeElement === curArea) || $.contains(curArea, activeElement); if (curArea && curArea.setActive && !activeElementIsInContent) { curArea.setActive(); } }; </script>
Using the delete key in the content area of the RadEditor sometimes cause incorrect behavior to be encountered, e.g., content disappearance, incorrect elements to be removed etc. For example pressing delete key before a list element, the li tag is removed, instead of just the cursor to be positioned in it. This behavior comes from the browser and there is no RadEditor logic that interferes with it. It would be nice if this inconsistencies are handled via custom commands that act more stable across browsers. The following issues are fixed with this item: Pressing backspace in a table sometimes inserts non breaking spaces Could not complete the operation due to error 800a025e when deleting table columns Redundand nbsps are added to the content using backspace inside <ul> in IE9 IE10 crashes when nested lists are highlighted and deleted Incorrect List nesting is generated when a Paragraph is deleted via backspace key under IE11
Commonly, plain words are listed in a an MS Word document and full stops are added. Pasting such a list in the editor will cause them to appear with upper-alpha type list and no text in the list item. The following code snippet further modifies the convert() method of the ConvertWordLists logic to encode and decode such full stops. You can use it as a temporary workaround to resolve this issue. <telerik:RadEditor runat="server" ID="RadEditor1"></telerik:RadEditor> <script type="text/javascript"> var originalConvert = Telerik.Web.UI.Editor.WordListConverter.prototype.convert; Telerik.Web.UI.Editor.WordListConverter.prototype.convert = function (htmlText) { // Encode the full stops only if they are after words with 2 or more characters. htmlText = htmlText.replace(/(\w{2,})[.]/gim, "$1_TELERIK_DOT_"); htmlText = originalConvert.call(this, htmlText); // Decode the full stops. htmlText = htmlText.replace(/_TELERIK_DOT_/gm, "."); return htmlText; } </script> Make sure that this script block is placed right after the RadEditor declaration, so that the WordListConverter is properly created.
classes are being applied to <p> when you do a return in the design view, sometimes. This one's a bit harder to explain so I apologize if this get's confusing. If you go into the HTML view and wrap some text in a <div> with a class on it then switch over to the design view and add a return and some more text the editor will add the div class to the paragraph tag, it might also strip out the paragrah line and place it after the closing div. If the content within the <div> is already formatted in <p> tags then the editor behaves properly when you do a return in the design view. See Screencast: http://screencast.com/t/pmcayQrO
Running the Word formatting tool on a plain HTML text with underline decoration, strips the style formatting. This tool should only affect the specific MS Word markup fetched from pasting.
Adding some initial, plain text (no HTML <p> tag wraps the text) and e.g., bolding the last word, pressing enter after it removes a white space. The easiest workaround is changing the NewLineMode property to Br. Example: <telerik:RadEditor runat="server" ID="RadEditor1" NewLineMode="Br"> </telerik:RadEditor> More complex solution that will enable you continue using the paragraphs as new lines is by incorporating the following JavaScript code: <telerik:RadEditor runat="server" ID="RadEditor1"> </telerik:RadEditor> <script type="text/javascript"> Telerik.Web.UI.Editor.Utils.trimWhitespaceTextNodes = function () { }; </script> Note that the script should be put right after the RadEditor declaration to ensure that the RadEditor scripts are loaded.
When a link is highlighted in the content, the RadEditor does not seem to recognize it as an anchor element. Due to that the the properties inspection module do not show the expected properties and the Hyperlink Manager do not work also.
Using an MS Word file with an inline image or an carriage return (<br/>) to paste the content in the editor, the ConvertWordList StripFormatting option removes the <img /> and <br /> elements.
If the user creates a link with the first word in the editor and then decides to insert a new paragraph, even though the link is moved to the 2nd paragraph the same link is also created in the first paragraph.
Steps to reproduce the issue: 1) Run the code below in IE11 2) Set background color to the "some text" cell by right clicking and then selecting cell property through the context menu. 3) Switch to design - there are many nbps's added. ASPX: <telerik:RadEditor ID="RadEditor1" runat="server"> <Content> <table> <tbody> <tr> <td> </td> <td> </td> <td> </td> </tr> <tr> <td> </td> <td> <table> <tbody> <tr> <td> </td> <td> </td> <td> </td> </tr> <tr> <td> </td> <td>some text </td> <td> </td> </tr> <tr> <td> </td> <td> </td> <td> </td> </tr> </tbody> </table> </td> <td> </td> </tr> <tr> <td> </td> <td> </td> <td> </td> </tr> </tbody> </table> </Content> </telerik:RadEditor> For the time being you can place the following JavaScript workaround below the editor's declaration: <script type="text/javascript"> if ($telerik.isIE) { Telerik.Web.UI.Editor.CommandList.SetCellProperties = function (commandName, editor, commandArgs) { var $ECL = Telerik.Web.UI.Editor.CommandList; var argument = $ECL._getTableArgument(editor, 2, false, true); if (!argument) { alert(editor.getLocalizedString("cellwarning")); return false; } $ECL._getDialogArguments(argument, "TABLE", editor, commandName); var previousTable = $ECL._getParentTable(editor); var callbackFunction = $ECL.getCallbackFunction(commandArgs, function (sender, args) { $telerik.$(args.tableToModify).insertAfter(previousTable); $telerik.$(previousTable).remove(); if (args.styleSheetToImport) $telerik.$(args.styleSheetToImport).insertAfter(args.tableToModify); if (args.styleSheetToRemove) $telerik.$(args.styleSheetToRemove).remove(); }); editor.showDialog("TableWizard", argument, callbackFunction); return false; } } </script>
When the user select an inserted through the ImageManager image from the Editor's content, its size in the properties tab of the ImageManager always displays its original width and height. Steps to reproduce: 1. Add an image to the editor and set it's width and height. 2. Select the image and click in the toolbar on the ImageManager 3. Click on the Properties tab Result: The width and height are set back to the initial ones.
For the time being you can use either approach: 1) Disable ConvertToXhtml filter: C#: protected void Page_Load(object sender, EventArgs e) { RadEditor1.DisableFilter(EditorFilters.ConvertToXhtml); } ASPX: <telerik:RadEditor ID="RadEditor1" runat="server"> <Content> <p> <h2></h2> <h2></h2> </p> </Content> </telerik:RadEditor> <script type="text/javascript"> Telerik.Web.UI.Editor.NestedElementsFix.prototype._shouldRemoveBlockElement = function (element, elementChanged) { var utils = Telerik.Web.UI.Editor.Utils; if (!elementChanged || !element) return false; if (!/^li|td|th$/.test(element.nodeName) && utils.isNodeEmptyRecursive(element) && !$telerik.$(element).find("ol,ul,table,h1,h2,h3,h4,h5,h6").length) { return true; } return false; } </script>
Here is the simplest sample we have managed to isolate this issue to: <iframe id="Iframe1" runat="server" src="http://bing.com"></iframe> <telerik:RadEditor ID="RadEditor1" runat="server"> </telerik:RadEditor> 1. Run this code in Chrome 2. Click anywhere on the page except for the iframe. Please check the attached workaround (chrome_editor_iframe_workaround.js) and add the script to the end of the page. An official fix will be available in the Q3 2014 release.