For the time being you can safely use the same scenario with ContentAreaMode set to Div.
For all controls that have a dropdown, there should be a DropDownSettings part. Namely, it should control: width, height as well as their min / max counterparts and css class. Perhaps z-index
There are several other suggestions along these lines, but in general, Telerik needs to make their data input controls more consistent in the implementation of a "Label" property. Without such consistencies, it makes including controls that have this property and those that don't together on the same page much more difficult. As of the writing of this, the DropDownList and DatePicker controls do not have a Label property. There is no apparent reason why this should be so. All of the input controls should have this property. Related requests: http://feedback.telerik.com/Project/108/Feedback/Details/149658-add-built-in-label-to-control http://feedback.telerik.com/Project/108/Feedback/Details/66117-add-label-property-to-ajax-raddatepicker Related annoyed forum thread about the omission of this property in the DropdownList control: http://www.telerik.com/forums/dropdownlist-label#TI3zWYeMFESXjPIY_bYjZg
The editor does not go to edit mode. The problem occurs also when Auto mode is used. This prevents the developers to rely on the AutoResizeHeight functionality when a mix of all rendering modes is required.
Possible workaround is to use the RadDeviceDetectionFramework - http://docs.telerik.com/devtools/aspnet-ajax/controls/raddevicedetectionframework - and programmatically disable the AutoResizeHeight in mobile devices:
ASP.NET
<telerik:RadEditor ID="RadEditor1" runat="server" RenderMode="Auto"
AutoResizeHeight="true">
<Content>
<p>editor</p>
</Content>
</telerik:RadEditor>
C#
using Telerik.Web.Device.Detection;
public partial class Default : System.Web.UI.Page
{
private void Page_Load()
{
if (Detector.GetScreenSize(Request.UserAgent) < DeviceScreenSize.Medium) {
RadEditor1.AutoResizeHeight = false;
}
}
}
There is a missing label in the Box tab (Width and Height options) in the StyleBuilder dialog.
You can dynamically change the label by following this example:
<telerik:RadEditor runat="server" ID="RadEditor1" OnClientCommandExecuted="OnClientCommandExecuted">
<Tools>
<telerik:EditorToolGroup>
<telerik:EditorTool Name="StyleBuilder" />
</telerik:EditorToolGroup>
</Tools>
</telerik:RadEditor>
<script>
function OnClientCommandExecuted(sender, args) {
var command = args.get_commandName();
if (command === "StyleBuilder") {
var dialog = sender.get_dialogOpener()._dialogContainers[command];
dialog.add_pageLoad(fixSectionName);
}
}
function fixSectionName(sender, args) {
var dialogWin = sender.get_contentFrame().contentWindow;
var label = dialogWin.$telerik.$(".reStyleBuilderBoxSize").find("legend");
label.html("Dimensions");
}
</script>
I am doing a bin deployment on a web site for the following assemblies... Telerik.Windows.Documents.Core Telerik.Windows.Zip Telerik.Windows.Documents.Fixed Telerik.Windows.Documents.Flow Telerik.Windows.Documents.Flow.FormatProviders.Pdf Telerik.Windows.Documents.Spreadsheet Telerik.Windows.Maths Telerik.Windows.Documents.Spreadsheet.FormatProviders.OpenXml Telerik.Windows.Documents.Spreadsheet.FormatProviders.Pdf I recently used the upgrade wizard, and it successfully updated the versions for these assemblies, but it did not update the version numbers in the Web.config. I manually removed the version number completely from Web.config, and it seems to work fine.
When RadEditor with Bootstrap skin is inserted in the ContentTemplate of RadWindow, the tools look incorrect.
A temporary solution is to override some CSS rules with more proper values:
<style>
.RadWindow .RadEditor .Bootstrap.reToolbarWrapper .reToolbar .reToolLastItem .reTool {
border-right-width: 0;
}
.RadWindow .Bootstrap.RadEditor.reWrapper .reSplitButton.reTool {
width: 42px;
}
.RadWindow .Bootstrap.RadEditor.reWrapper .Bootstrap.reToolbarWrapper .reToolbar li {
border-right-width: 1px;
border-left-width: 0;
}
.RadWindow .Bootstrap.RadEditor.reWrapper .Bootstrap.reToolbarWrapper .reToolbar li.reToolFirstItem {
border-left-width: 1px;
}
.RadWindow .Bootstrap.RadEditor.reWrapper .Bootstrap.reToolbarWrapper .reToolbar .reSeparator + li {
border-width: 1px;
}
</style>
<telerik:RadWindow runat="server" Width="1200px" Height="600px" VisibleOnPageLoad="true">
<ContentTemplate>
<telerik:RadEditor runat="server" Skin="Bootstrap">
</telerik:RadEditor>
</ContentTemplate>
</telerik:RadWindow>
The text in the tabs' titles of the Sliding panes of the Splitter control are not properly rotated. Can be reproduced here: http://demos.telerik.com/aspnet-ajax/splitter/examples/overview/defaultcs.aspx http://demos.telerik.com/aspnet-ajax/splitter/examples/sp_firstlook/defaultcs.aspx
When adding a link with a class name, the Unlink command cannot remove the formatting.
Temporary solution is to clear anchor's classes programmatically via the ApplyClass command:
<telerik:RadEditor runat="server" ID="RadEditor1" OnClientCommandExecuting="OnClientCommandExecuting">
<Content>
<a href="http://www.telerik.com" class="my-class">link</a>
</Content>
</telerik:RadEditor>
<script type="text/javascript">
function OnClientCommandExecuting(sender, args) {
var command = args.get_commandName && args.get_commandName();
if (command === "Unlink") {
var myArgs = new Telerik.Web.UI.EditorCommandEventArgs("ApplyClass", null, "");
sender.fire("ApplyClass", myArgs);
}
}
</script>
I love WebForms and the wealth in the Toolbar. I would like to write the payload of the web page in a webform and limit the round tripping with micro webservices, so there is no PostBack. Which means I can do more clientside in a KendoUI style. This would address the criticism of the bloat that comes with ViewState in webforms offering a leaner web page, but with all the advantages of the JavaScript tooling. For the most part a lot of this can be done already, would just prefer not to have any limitations in the controls that I can use for this. Just that there is such a driver now with the fashion of AngularJS/SPA applications suggesting that webforms cannot compete here.
RadHtmlChart does not cache the correct size when placed inside initially hidden iframe.
Workaround:
function redrawChart() {
kendo.drawing.util.TextMetrics.current._cache = new kendo.drawing.util.LRUCache(1000);
$find("<%=RadHtmlChart1.ClientID%>").get_kendoWidget().redraw();
}
The dragging clue element is shown before the actual dragging of the element in the Grid is initiated (immediately after the item is clicked). The problem is reproducible in Chrome. Comment: The problem is not reproducible in the following TreeView demo: http://demos.telerik.com/aspnet-ajax/treeview/examples/functionality/draganddropnodes/defaultcs.aspx Steps to reproduce: 1. Open http://demos.telerik.com/aspnet-ajax/grid/examples/columns-rows/rows/drag-and-drop/defaultcs.aspx 2. Click over an item (just mouse-down, without moving the mouse nor full click) Result: The dragging clue is shown without actual moving of the mouse pointer
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>
A rad calculator picker for asp.net textboxes similar to what you have in Silverlight.