When user clicks on e.g., bold text, comment, link, etc. the UI of RadEditor is not updated Possible workaround is using the Window's Show event to attach a handler, that re-attaches the mouseup event of RadEditor with setTimeout: <telerik:RadWindowManager runat="server" ID="RadWindowManager1"> <Windows> <telerik:RadWindow runat="server" ID="RadWindow1" VisibleOnPageLoad="true" Width="800px" Height="500px" OnClientShow="OnClientShow"> <ContentTemplate> <telerik:RadEditor ID="theEditor" runat="server" Width="100%" Height="100%" EnableComments="true"> <TrackChangesSettings Author="RadEditorUser" UserCssId="reU1"></TrackChangesSettings> <Content> <h2 class="titleText">RadEditor for ASP.NET AJAX</h2> <p style="text-align: justify;"><span style="font-size: 19px; color: #4f6128;"><strong>RadEditor</strong></span> is not simply an <strong> <span class="reComment reU1" author="RadEditorUser" comment="comment 1" title="RadEditorUser: comment 1: 6/12/2015, 11:27:35 AM" timestamp="1434097655291">HTML</span></strong> Editor. <a href="http://www.telerik.com/products/aspnet-ajax/sharepoint.aspx">Link</a>.</p> </Content> </telerik:RadEditor> </ContentTemplate> </telerik:RadWindow> </Windows> </telerik:RadWindowManager> <script type="text/javascript"> function OnClientShow(sender, args) { var editor = $find("<%= theEditor.ClientID %>"); window.setTimeout(function () { editor.attachInternalHandler("mouseup", function () { editor.raiseEvent("selectionChange"); }); }, 0); } </script>
Despite the fact that keyboard support is not supported with RadEditor, JavaScript error should not be thrown in such a situation. You can workaround this by following this example code to override the method related to the error: <telerik:RadEditor ID="RadEditor1" runat="server" EnableAriaSupport="true"> </telerik:RadEditor> <script type="text/javascript"> Telerik.Web.UI.EditorDropDown.prototype.hide = function () { if (this._popupBehavior) this._popupBehavior.hide(); this._popupVisible = false; //Notify controller that tooltip was hidden this._getPopupVisibilityController().notifyPopupClosed(this); //Notify listeners for the dropdown being hidden this.raiseEvent("hide"); if (this._popupBehavior && this.get_enableAriaSupport()) this._popupElement.setAttribute("aria-hidden", "true"); }; </script>
A sample project for reproducing the issue is attached: Each of the pages in the ContentUrl properties has an alert("PageName") displayed at pageLoad. 1, Brows the Default.aspx - an alert - page1 occurs 2. Select Level 2 tab, which would load the subTab - Page4 and the "page4" alert should be shown. Problem : In addition to the "page4" alert - the "page5" alert is raised and the page5.aspx had been loaded along with page4.aspx. ---------------------------------- Workaround: To workaround this issue, set the PageViewID property of the parent tab to be with the same value as the PageViewID property on the selected child tab. <telerik:RadTabStrip runat="server" ID="RadTabStrip1" MultiPageID="rmpPages" Width="100%"> <Tabs> <telerik:RadTab Text="Level 1" Selected="true" PageViewID="page1"> <Tabs> <telerik:RadTab Text="Page 1" PageViewID="page1" Selected="true" /> <telerik:RadTab Text="Page 2" PageViewID="page2" /> <telerik:RadTab Text="Page 3" PageViewID="page3" /> </Tabs> </telerik:RadTab> <telerik:RadTab Text="Level 2" PageViewID="page4"> <Tabs> <telerik:RadTab Text="Page 4" PageViewID="page4" Selected="true" /> <telerik:RadTab Text="Page 5" PageViewID="page5" /> <telerik:RadTab Text="Page 6" PageViewID="page6" /> </Tabs> </telerik:RadTab> </Tabs> </telerik:RadTabStrip> <telerik:RadMultiPage runat="server" ID="rmpPages"> <telerik:RadPageView runat="server" ID="page1" ContentUrl="page1.aspx" Selected="true" /> <telerik:RadPageView runat="server" ID="page2" ContentUrl="page2.aspx" /> <telerik:RadPageView runat="server" ID="page3" ContentUrl="page3.aspx" /> <telerik:RadPageView runat="server" ID="page4" ContentUrl="page4.aspx" /> <telerik:RadPageView runat="server" ID="page5" ContentUrl="page5.aspx" /> <telerik:RadPageView runat="server" ID="page6" ContentUrl="page6.aspx" /> </telerik:RadMultiPage>
The grid adds the correct Aria-Selected attribute, but JAWS does not work
I have 2 ideas for teleriks control future, i will love to have a 3D graphics in charts for AJAX ASP.NET controls, the infragistics control have some interesting thinks on this ways. my second idea will be a control that can be used to migrate information for excel to a database in our aplications as you can do in the SQL Integration Services.
This leads to possibility for the end-user to press the button before selecting the content area and accept/reject tracked content. This can be resolved via some custom code that disables the tools on initial load. For example: <telerik:RadEditor runat="server" ID="RadEditor1" OnClientLoad="OnClientLoad" EnableTrackChanges="true" TrackChangesSettings-CanAcceptTrackChanges="false"> <Tools> <telerik:EditorToolGroup> <telerik:EditorTool Name="AcceptTrackChange" Text="Accept Track Change" /> <telerik:EditorTool Name="RejectTrackChange" Text="Reject Track Change" /> <telerik:EditorTool Name="AcceptAllTrackChanges" Text="Accept All Track Changes" /> <telerik:EditorTool Name="RejectAllTrackChanges" Text="Reject All Track Changes" /> <telerik:EditorTool Name="EnableTrackChangesOverride" Text="Enable Track Changes Override" /> </telerik:EditorToolGroup> </Tools> </telerik:RadEditor> <script type="text/javascript"> function OnClientLoad(sender, args) { var editor = sender; var toolNamesToDisable = ["AcceptTrackChange", "RejectTrackChange", "AcceptAllTrackChanges", "RejectAllTrackChanges"]; var canAcceptChanges = editor.get_canAcceptTrackChanges(); if (!canAcceptChanges) { for (var i = 0; i < toolNamesToDisable.length; i++) { var toolName = toolNamesToDisable[i]; editor.getToolByName(toolName) .setState(Telerik.Web.UI.Editor.CommandStates.Disabled) } } } </script>
When end-user changes the font-name and size of a single word in the content, pressing spacebar resets the formatting to its default state. Steps to reproduce: 1. Go to http://demos.telerik.com/aspnet-ajax/editor/examples/overview/defaultcs.aspx; 2. Remove all content and add a simple sentence, e.g., "some text"; 3. Highlight "text"; 4. Change font-name and size; 5. Put the cursor right after "text" 6. Press spacebar (add white space) 7. Type another word.
Enabling Fluid behavior of RadEditor (Width="100%") causes the tools not to collapse with a smaller view-port. Also, there are some further visual glitches with the toolbar. Solution 1: Add a CSS rule to expand the height of the tool-groups automatically. .<SkinName>.reToolbar { height:auto !important; } Solution 2: Enable Lightweight rendering (or Auto). <telerik:RadEditor ID="RadEditor1" Skin="Silk" RenderMode="Lightweight" runat="server" Width="100%" > </telerik:RadEditor>
The issue is caused by a bug in the KB3057839 windows update. The bug has been reported to Microsoft and can be tracked at the following link: https://connect.microsoft.com/VisualStudio/feedback/details/1475291 Currently the only workaround is to revert the KB3057839 update on the production server.
Cursor is placed in the next available element (e.g., <p>) instead of being placed right after the tab space in the same paragraph. Possible workaround is to implement a custom command to be triggered with tab key press: <telerik:RadEditor runat="server" ID="RadEditor1" OnClientLoad="OnClientLoad"> </telerik:RadEditor> <script> Telerik.Web.UI.Editor.CommandList["MyInsertTab"] = function (commandName, editor, oTool) { var utils = Telerik.Web.UI.Editor.Utils; var selecedElm = editor.getSelectedElement(); var blockElm = utils.isBlockElement(selecedElm) ? selecedElm : utils.getBlockParent(selecedElm); var executeDefaultCommand = utils.isList(blockElm) || utils.isTag(blockElm, "LI") || utils.isTag(blockElm, "TD") || utils.isTag(blockElm, "TH"); if (executeDefaultCommand) { editor.fire("InsertTab"); } else { editor.pasteHtml("<span> </span>​", commandName); } }; function OnClientLoad(editor, args) { var shortcutManager = editor.get_shortCutManager(); // Removing the InsertTabMozilla shortcut will // assure that in Firefox the behavior will be consistent with IE. shortcutManager.removeShortCut("InsertTabMozilla"); editor.addShortCut("MyInsertTab", "TAB"); } </script>
Workaround: <telerik:RadEditor ID="radEditor1" runat="server" EnableTrackChanges="true" TrackChangesSettings-CanAcceptTrackChanges="true"> <Content> <table> <tbody> <tr> <td>test</td> <td>test</td> </tr> </tbody> </table> <p>test paragraph</p> </Content> </telerik:RadEditor> <script type="text/javascript"> (function ($T) { var prototype = $T.Editor.DefaultToolAdapter.prototype; var onContextMenu = prototype.onContextMenu; prototype.onContextMenu = function (e) { var editor = this.get_editor(); if (!editor.get_enableTrackChanges()) { return onContextMenu.call(this, e); } if (!this._contextMenusEnabled || editor.get_mode() != $T.EditModes.Design) { return; } this.createContextMenus(); var element = editor.getSelectedElement() || e.srcElement; var contextMenus = this._contextMenus; var contextElement = $T.Editor.Utils.getElementParentByCondition(element, function (node) { return !!contextMenus[node.nodeName]; }); var contextMenuId = contextElement ? contextElement.nodeName : "*"; var parentTrackChangeEl = $T.Editor.TrackChangesUtils.findTrackChangesParentElement(element); if (parentTrackChangeEl) { if (parentTrackChangeEl.Type == $T.Editor.TrackChangesElementType.Comment) contextMenu = this.createContextMenuWithTrackChangeCommentItems(contextMenuId); else contextMenu = this.createContextMenuWithTrackChangeItems(contextMenuId); } else { contextMenu = this.createContextMenuWithTrackChangeDefaultItems(contextMenuId) || contextMenus[contextMenuId]; } if (contextMenu) { contextMenu.set_eventObject(e); contextMenu.show(); } return $telerik.cancelRawEvent(e); }; })(Telerik.Web.UI) </script>
A rad calculator picker for asp.net textboxes similar to what you have in Silverlight.
The error is "Wrong Document". The dialog creates the table from different document instead of the document of the RadEditor's content area. Here is the workaround: <script type="text/javascript"> Telerik.Web.UI.InsertTableLight.prototype.getModifiedTable = function(tableToModify){ var rowCount = parseInt(this._rowsCount.value, 10); var colCount = parseInt(this._colsCount.value, 10); if (!tableToModify && !(isNaN(rowCount) || isNaN(colCount))) { tableToModify = this._editor.get_document().createElement("table"); this._originalRowsCount = 0; this._originalColsCount = 0; } if (!tableToModify) return; var originalRowsCount = this._originalRowsCount; var originalColsCount = this._originalColsCount; if (rowCount > 0 && rowCount != originalRowsCount) { rowCount > originalRowsCount ? this.addRowsCols(tableToModify, originalRowsCount, rowCount, true) : this.removeRowsCols(tableToModify, originalRowsCount, rowCount, true); } if (colCount > 0 && colCount != originalColsCount) { colCount > originalColsCount ? this.addRowsCols(tableToModify, originalColsCount, colCount, false) : this.removeRowsCols(tableToModify, originalColsCount, colCount, false); } this._setAttribValue(tableToModify, "align", this._alignmentSelectorTable.getAlign()); var oSpacing = parseInt(this._cellSpacing.value, 10); if (!isNaN(parseInt(oSpacing, 10))) this._setAttribValue(tableToModify, "cellSpacing", oSpacing >= 0 ? oSpacing : "", (oSpacing >= 0)); var oPadding = parseInt(this._cellPadding.value, 10); if (!isNaN(parseInt(oPadding, 10))) this._setAttribValue(tableToModify, "cellPadding", oPadding >= 0 ? oPadding : "", (oPadding >= 0)); var oBorderWidth = parseInt(this._borderWidth.value, 10); if (!isNaN(parseInt(oBorderWidth, 10))) this._setAttribValue(tableToModify, "border", oBorderWidth >= 0 ? oBorderWidth : "", (oBorderWidth >= 0)); return tableToModify; } </script>