The tools are not respected by the toolgroups under IE7 and IE7 standards. This issue causes incorrect layout at resizing and overlay issues of floated tools.
The problem is introduced because the toolgroup elements does not have a properly set width.
Possible resolution is setting a proper width to every UL at the load event of the editor:
<telerik:RadEditor runat="server" ID="RadEditor1"
OnClientLoad="OnClientLoad"></telerik:RadEditor>
<script type="text/javascript">
function OnClientLoad(editor, args) {
if (editor.isVisible()) {
fixToolbarsInIE(editor);
} else {
editor.add_firstShow(function () {
setTimeout(function () {
fixToolbarsInIE(editor);
}, 0);
})
}
}
function fixToolbarsInIE(editor) {
if ($telerik.isIE) {
var $ = $telerik.$;
var editorID = editor.get_id();
var topTD = document.getElementById(editorID + "Top");
var toolGroupElements = $(topTD).find(".reToolbar");
for (var i = 0, l = toolGroupElements.length; i < l; i++) {
calculateTools(toolGroupElements[i]);
}
}
}
function calculateTools(toolGroup) {
var tools = toolGroup.children;
var size = 0;
for (var i = 0, l = tools.length; i < l; i++) {
var tool = tools[i];
size += tool.offsetWidth;
}
toolGroup.style.width = size + "px";
}
</script>
The initial problem is related with the JS error, because of which the editor's initialization is interrupted.
You can workaround this by incorporating this piece of code:
<telerik:RadWindow ID="RadWindow1" runat="server" Width="805" Height="450" VisibleOnPageLoad="true">
<ContentTemplate>
<telerik:RadEditor runat="server" ID="RadEditor1" Height="200" Width="400" >
</telerik:RadEditor>
</ContentTemplate>
</telerik:RadWindow>
<script type="text/javascript">
var oldCommand = Telerik.Web.UI.RadEditor.prototype.toggleEnhancedEdit;
Telerik.Web.UI.RadEditor.prototype.toggleEnhancedEdit = function (newValue) {
if ($telerik.isSafari && typeof (newValue) != "undefined" && false == this.disableContentAreaStylesheet(newValue)) {
window.setTimeout(Function.createDelegate(this, function () {
this.disableContentAreaStylesheet(newValue);
}), 200);
} else {
oldCommand.call(this, newValue);
}
};
</script>
The main issue is the inconsistent behavior of the borders around the content area.
A proper workaround for this problem is applying this CSS rule:
div.RadEditor .RadRibbonBar .rrbButton img.rrbButtonImage {
top:-7px;
}
When the HTML content is set with nested list elements and an empty paragraph right after the primary list, deleting this empty paragraph will cause the nested list to go outside the list item.
This matter causes an incorrect HTML markup and additionally causes incorrect tool behavior.
Passing trough Design to HTML cures the issue (invoking the content filters) cures the issue, although there are cases where users cannot be prompted to do that.
Using native events to resolve the backspace behavior:
<telerik:RadEditor ID="RadEditor1" runat="server" OnClientLoad="OnClientLoad">
</telerik:RadEditor>
<script type="text/javascript">
function OnClientLoad(editor, args) {
editor.attachEventHandler("onkeydown", function (e) {
if (e.keyCode == 8 && $telerik.isIE10Mode && !$telerik.isIE10) {
var selElm = editor.getSelectedElement();
var isCursorInFront = editor.getSelection().getRange().startOffset == 0;
if (selElm && selElm.nodeName == "P" && isCursorInFront) {
editor.attachEventHandler("onkeyup", fixContent);
}
}
});
var fixContent = function () {
editor.set_html(editor.get_html(true));
editor.detachEventHandler("onkeyup", fixContent);
}
}
</script>
Hello Team; The following request, is a feature that everyone needs all the time. It is eMail mailmerge control. Here how it works: a) Just like a mailmege that has been around since the 80's, A user can use the editor to create the body/content of an email more like a template that will have tags/placeholders that at run time live data will replace them. This control can use the RADEditor to create such template. This template should be saved in order for the email Merge control to use. b) The second part is the Mailmerge control - W should be able to attach it to a collection of objects (that these objects could have come from database), and each object could provide the FROM, TO, SUBJECT and for MESSAGE, it could use the template that user had created and saved. The Mailmerge will create new email for each object replacing place holders and sends email to SMTP server. If you need more info, please contact me and I'll provide more info. Please everyone, vote for this control/feature. Thanks!
FileBrowser pager slider tooltips: "Increase", "Decrease" FileBrowser grid column resize: "Drag to resize"
i am looking for an example how to handle an uploaded screenshot with the radeditor. it is a great feature, one reason why i took telerik, but i can't find the documentation for that. do you have a link where i can look it up ?
The current content filters of the RadEditor control supports XHTML content, in which attributes should have a proper value. Although with HTML5 the browsers started supporting boolean attributes that could be used without any type of value. Such attributes are being stripped or replaced, which at some point leads to an incorrect behavior if the user's HTML code. It would be useful if developers could have the ability to modify this behavior and generate correct HTML5 code. A possible usage of such attributes is when they are used as XHTML5 valid attributes, with the proper value (e.g. disabled="disabled").
Inline commands such as bold, italic, underline doesn't trigger each time with empty selection in Internet Explorer.
Due to that behavior the Editor control appears to change the actual content of the user, which is considered as a faulty behavior.
When the tracking feature is enabled some of the existing features don't work properly. For eg: a. If existing text were bulleted they were not displayed properly. b. If bulleted content was copied over from a web page and pasted into the RadEditor control formatting was not retained. c. If text in the editor that was modified previously and not accepted by a user, a change made to the same text after some time does not capture the new username and date time stamp by the same /different user. Please fix the tracking feature for SharePoint
Hi, We have just upgraded our controls to fix a security concern with the file upload control. However having done this the radeditor nolonger works with firefox. You cannot enter any text into the editor. Just wanted to know if this was a known issue and if there is a fix/work around.
When RadEditor is set with width of 100% switching to Full Screen mode and going back from Full Screen to the initial mode, the content area becomes only few lines high.
The following temporary solution should resolve the layout issue for common scenarios:
<telerik:RadEditor ID="txtComments" runat="server" Width="100%"
OnClientCommandExecuted="OnClientCommandExecuted">
</telerik:RadEditor>
<script type="text/javascript">
function OnClientCommandExecuted(sender, args) {
if (args.get_commandName() === "ToggleScreenMode") {
sender.repaint();
}
}
</script>
Inserting an image after opening ImageManager from within the ImageManager's Properties tab throws JS error. The issue is reproducible both in IE and Firefox video: http://screencast.com/t/n4T0XYtSpt
In the ImageManager when using AsyncUpload as the upload manager control, the uploaded image is not selected. This prevents a fluent workflow of upload and insert of the image. The image preview should react in a contextual way when deleting the image as well. Then the previewer should stay empty as is the case with a first load of the dialog.
ImageManager loses the selection after an image has been edited into the ImageEditor and saved with new file name. video: http://screencast.com/t/rZIp4iioehE
The Text property of the editor converts the html into plain text. Very handy. It would be really helpful if this could be exposed as a static method on the editor for use elsewhere, without having to create an editor object. I know that I could just grab the source code and create my own, but then I don't get the benefit of improvements and bug fixes you may add in the future.
When the Toggle Full Screen is pressed the RadEditor does not fill the entire page.
The changes applied to a newly uploaded image through the ImageEditor are not taken into account when inserting the image in RadEditor. The issue is reproducible in all browsers. video: http://screencast.com/t/Uz4BAr9Lj