Due to this problem end-users cannot manipulate the newly added areas and use the dialog properly. A possible workaround is to force the IE10 compatibility mode of the browser by adding the following meta tag in the head element of the page. <meta http-equiv="X-UA-Compatible" content="IE=10">
This causes incorrect behavior. The STYLE tags should be removed along with the get_text method. The origin of this problem is the behavior of the get_text method of the RadEditor control. The following workaround can be used as a workaround for this issue. The implemented resolution is related to another logged bug - http://feedback.telerik.com/Project/108/Feedback/Details/119856 <telerik:RadEditor runat="server" ID="RadEditor1"> </telerik:RadEditor> <script type="text/javascript"> Telerik.Web.UI.RadEditor.prototype.get_text = function () { var $T = Telerik.Web.UI, modeEnum = $T.EditModes, oContent = ""; if (this.get_mode() != modeEnum.Html) { var oArea = this.get_contentArea(); if (oArea) { oContent = oArea.innerHTML; oContent = oContent.replace(/<br>/ig, "\r\n"); oContent = oContent.replace(/<\/p>/gi, "\r\n"); oContent = oContent.replace(/ /gi, "\s"); if (this.get_newLineMode() === $T.EditorNewLineModes.Div) { oContent = oContent.replace(/<\/div>/gi, "\r\n"); } oContent = oContent.replace(/\s*<div[^>]*style="display:none;"[^>]*>[^>]*>\s*/gi, ""); oContent = oContent.replace(/\s*<style[^>]*>[^>]*>\s*/gi, " "); oContent = oContent.replace(/<\/?[^>]*>/ig, ""); oContent = oContent.replace(/<!--(.|\s)*?-->/gi, ""); } } else { oContent = this._getTextArea().value; oContent = oContent.replace(/\s*<style[^>]*>[^>]*>\s*/gi, " "); oContent = oContent.replace(/<\/?[^>]*>/ig, ""); } return oContent; }; </script>
A workaround is to add the settings in the markup, for example: <telerik:RadPersistenceManager runat="server" ID="RadPersistenceManager1"> <PersistenceSettings> <telerik:PersistenceSetting ControlID="RadTileList1" /> </PersistenceSettings> </telerik:RadPersistenceManager> <telerik:RadTileList runat="server" ID="RadTileList1"> </telerik:RadTileList>
When a dropdown element is decorated, dragging of items causes incorrect selection. The problem is due to browser behavior of the click event. When performing a dragging like action on plain list items the event target is the UL element instead the LI. The following resolution will work only for dropdowns without multiple selection: <telerik:RadFormDecorator ID="FormDecorator1" runat="server" DecoratedControls="All" DecorationZoneID="decorationZone" Skin="Silk"></telerik:RadFormDecorator> <div id="decorationZone"> <asp:DropDownList ID="DropDownList1" runat="server" AutoPostBack="false" Width="135px" TabIndex="3"> <asp:ListItem Text="Comedy" Value="1"></asp:ListItem> <asp:ListItem Text="Drama" Value="2"></asp:ListItem> <asp:ListItem Text="Romance" Value="3"></asp:ListItem> <asp:ListItem Text="Religious" Value="4"></asp:ListItem> <asp:ListItem Text="Fantasy" Value="5"></asp:ListItem> <asp:ListItem Text="Mystery" Value="6"></asp:ListItem> <asp:ListItem Text="Science fiction" Value="7"></asp:ListItem> </asp:DropDownList> </div> <script type="text/javascript"> Telerik.Web.UI.RadFormDecorator.prototype.decorateSelects = function (rootElement) { var selects = rootElement.getElementsByTagName("select"); if (selects.length == 0 && rootElement.tagName && rootElement.tagName.toLowerCase() == "select") selects = [rootElement]; for (var i = 0; i < selects.length; i++) { this.decorateSelect(selects[i]); } if (selects.length > 0) { if (!this._selectBodyClickDelegate) { this._selectBodyClickDelegate = Function.createDelegate(this, this._selectBodyClickHandler); if ($telerik.isTouchDevice) { this._ensureThisDelegate("_selectScrollingDelegate", this._selectScrollingHandler); $telerik.addHandler(document, "touchmove", this._selectScrollingDelegate); } $telerik.addHandler(document, ($telerik.isTouchDevice ? "touchend" : "mousedown"), this._selectBodyClickDelegate); } } }; </script>
Stylebuilder seems to be down. I get a server error when trying to create a new skin or edit an existing one?
When the Editor is set with Skin=Window7, fieldsets has a non designed margin top value. The New Area bottom also drop to a new line, where it should be next to the radio buttons. Possible solutions is setting a CSS file to the DialogsCssFile property with CSS rules that resolve the issue: <telerik:RadEditor ID="RadEditor1" runat="server" Skin="Windows7" DialogsCssFile="~/Styles/Styles.css"> </telerik:RadEditor> Styles.css html.redImageMapDialog.RadForm_Windows7 #dialogControl fieldset { margin-top:0; } button#ImageMap_NewArea { width:110px !important; }
The best approach is to handle the OnClientTileClicking event for the TileList and determine whether it should be cancelled: http://www.telerik.com/help/aspnet-ajax/tilelist-client-side-events-onclienttileclicking.html. A possible way to change the behavior is to pass the _cancel field value from the Clicking event of the Tile to the TileClicking event of the TileList with the following override. var $T = Telerik.Web.UI; $T.RadTileList.prototype._onTileClicking = function (tile, args) { var eventArgs = new $T.RadTileListCancelEventArgs(tile, args.get_value()); eventArgs.set_cancel(args.get_cancel()); //the change - pass the _cancel argument to the TileList handler too this.raiseEvent("tileClicking", eventArgs); args.set_cancel(tile._isDragged || eventArgs.get_cancel()); args.set_value(eventArgs.get_value()); tile._isDragged = false; }
When user adds paragraph with formatting (e.g., Underline), this style is transferred to new lines automatically. The issue is when these paragraphs are empty. They contain an or <br> which is styled too, although this empty paragraphs should not be formatted until some text is inserted.
When adding nested list elements in the content, the user is able to go to parent element, press enter and add a sibling element. This element, as expected has a br tag that allows user to type text, but deleting this tag causes the list item to be not editable and the user is forced to go to HTML mode to modify the HTML code manually.
This issue causes an additional ghost character to appear in the text without any incorrect user interaction. For the time being you can incorporate the JavaScript code from the following example: <telerik:RadEditor runat="server" ID="RadEditor1" EnableTrackChanges="true"> <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 () { var $E = Telerik.Web.UI.Editor; var utils = $E.Utils; var isTypingKey = utils.isTypingKey; utils.isTypingKey = function (e) { return e.keyCode != 13 && isTypingKey(e); } var extractFrom = $E.InsertParagraphCommand.prototype.extractFrom; $E.InsertParagraphCommand.prototype.extractFrom = function (cursor, container) { var newElement = extractFrom.call(this, cursor, container); if (!this.get_editor().get_enableTrackChanges() || utils.isTextNode(cursor.nextSibling)) return newElement; $telerik.$(newElement).find("*").each(function (index, item) { if ($E.TrackChangesUtils.isTrackChangeElement(item)) { if (utils.isTag(item, "ins") || utils.isTag(item, "del")) { utils.removeNode(item); return; } $E.TrackChangesUtils.removeNodeTracking(item); } }); return newElement; } }()); </script>
In Chrome and Safari, adding a space with disabled Track Changes right after a tracked text, the space appears inside the <ins> tag instead of outside.
The NewLine command behave inconsistently across browsers and causes different incorrect content generation in IE, Chrome and Safari. - In IE - New lines are added, but the cursor stays in the initial/first line. This issue also causes an performance problems when typing and pressing Enter with regular speed. - In Chrome - Pressing Enter causes mixed content of tracked and not-tracked text to appear without toggling the state of the Track Changes. Also, adds an empty INS tag in from of the new line. - In Safari - Adds an empty INS tag in from of the new line. For the time being you can incorporate the JavaScript code from the following example: <telerik:RadEditor runat="server" ID="RadEditor1" EnableTrackChanges="true"> <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 () { var $E = Telerik.Web.UI.Editor; var utils = $E.Utils; var isTypingKey = utils.isTypingKey; utils.isTypingKey = function (e) { return e.keyCode != 13 && isTypingKey(e); } var extractFrom = $E.InsertParagraphCommand.prototype.extractFrom; $E.InsertParagraphCommand.prototype.extractFrom = function (cursor, container) { var newElement = extractFrom.call(this, cursor, container); if (!this.get_editor().get_enableTrackChanges() || utils.isTextNode(cursor.nextSibling)) return newElement; $telerik.$(newElement).find("*").each(function (index, item) { if ($E.TrackChangesUtils.isTrackChangeElement(item)) { if (utils.isTag(item, "ins") || utils.isTag(item, "del")) { utils.removeNode(item); return; } $E.TrackChangesUtils.removeNodeTracking(item); } }); return newElement; } }()); </script>
RadScheduler's "today" link is positioned below the Prev/Next arrows in Safari on iOS and OS X. It is positioned properly after changing the views. As a quick fix, you can set CSS: <style type="text/css"> html .RadScheduler .rsHeader > p { width: 80px; } </style> Width value will vary depending on the skin used.