I have RadSpreadsheet with 5 rows. If I copy 10 rows from Excel into RadSpreadsheet, it will show error message "Cannot paste, because area not the same size".
Is it possible to get RadSpreadsheet to automatically add rows when we paste data? (similar to the Kendo Spreadsheet Widget)
Currently, a script solution is required to pre-select a sheet different from the first one.
function pageLoadHandler() {
var spreadsheet = $find("<%= RadSpreadsheet1.ClientID %>").get_kendoWidget();
var sheet = spreadsheet.sheetByName("Sheet1");
spreadsheet.activeSheet(sheet);
// Sys.Application.remove_load(pageLoadHandler);
}
Sys.Application.add_load(pageLoadHandler);
This script could be entirely loaded from the server-side following this article on how to properly register a script from the code-behind:
Getting these errors when trying to update spreadsheet cells. Uncaught TypeError: Cannot read property 'offsetWidth' of undefined
The issue is happening even on the demo component when editing a cell:
https://demos.telerik.com/aspnet-ajax/spreadsheet/examples/overview/defaultcs.aspx
Workaround from Admin:
Load the following script under the ScriptManager:
<script>
if (kendo && kendo.spreadsheet && kendo.spreadsheet.SheetEditor) {
kendo.spreadsheet.SheetEditor.fn.activate = function (options) {
var viewElement = this.view.element, viewWidth, scrollerElement, scrollbarWidth;
this._active = true;
this._rect = options.rect;
this._range = options.range;
this.cellInput.position(options.rect);
this.cellInput.resize(options.rect);
this.cellInput.tooltip(options.tooltip);
this.cellInput.activeCell = this.barInput.activeCell = this._range.topLeft();
this.cellInput.activeSheet = this.barInput.activeSheet = this._range._sheet;
if (viewElement) {
viewWidth = viewElement.width();
scrollerElement = viewElement.find('.' + kendo.spreadsheet.View.classNames.scroller)[0];
scrollbarWidth = scrollerElement.offsetWidth - scrollerElement.clientWidth;
this.cellInput.element.css('max-width', viewWidth - scrollbarWidth - this.cellInput.element.position().left + 'px');
}
this.trigger('activate');
return this;
}
}
</script>
Repro:
<telerik:RadSpreadsheet runat="server" ID="RadSpreadsheet1" />
<telerik:RadSpreadsheet runat="server" ID="RadSpreadsheet2" />
protected void Page_Load(object sender, EventArgs e)
{
var workbook = new Workbook();
var sheet1 = workbook.AddSheet();
AddDateRow(sheet1);
sheet1.Columns = new List<Column>() { new Column() { Index = 1, Width = 150 } };
RadSpreadsheet1.Sheets.Add(sheet1);
RadSpreadsheet2.Sheets.Add(sheet1);
RadSpreadsheet1.ColumnsCount = 5;
RadSpreadsheet1.RowsCount = 10;
}
private void AddDateRow(Worksheet sheet1)
{
var row = new Row() { Index = 0 };
Cell firstCell = new Cell() { Index = 0, Value = "Select Date:", Bold = true };
row.AddCell(firstCell);
Cell secondCell = new Cell() { Index = 1, Value = "", Bold = true, Background = "#fef0cd", Format = "mmmm d, yyyy" };
secondCell.Validation = new Validation()
{
AllowNulls = true,
DataType = "date",
ShowButton = true,
ComparerType = "between",
From = "DATEVALUE(\"1/1/2000\")",
To = "DATEVALUE(\"12/31/2020\")",
Type = "reject",
TitleTemplate = "Invalid date selected",
MessageTemplate = "Select a date between year 2000 and 2020."
};
row.AddCell(secondCell);
sheet1.AddRow(row);
}
Workaround(Approved by Admin):
<script>
// Place/load this script after the ScriptManager
if (Telerik.Web.UI.RadSpreadsheet) {
Telerik.Web.UI.RadSpreadsheet.prototype.original_initialize = Telerik.Web.UI.RadSpreadsheet.prototype.initialize;
Telerik.Web.UI.RadSpreadsheet.prototype.initialize = function () {
this.original_initialize();
this.add_parentShown(this.get_element());
}
Telerik.Web.UI.RadSpreadsheet.prototype.repaint = function () {
this.get_kendoWidget().refresh()
}
}
</script>
Reproduction:
<telerik:RadWizard runat="server" ID="RadWizard1">
<WizardSteps>
<telerik:RadWizardStep ID="WizardStep1" StepType="Start">
Step 1
</telerik:RadWizardStep>
<telerik:RadWizardStep ID="WizardStep3">
<telerik:RadSpreadsheet runat="server" ID="RadSpreadsheet1"></telerik:RadSpreadsheet>
</telerik:RadWizardStep>
<telerik:RadWizardStep ID="WizardStep4" StepType="Finish">
Finish step
</telerik:RadWizardStep>
<telerik:RadWizardStep ID="WizardStep5" StepType="Complete">
Completed!
</telerik:RadWizardStep>
</WizardSteps>
</telerik:RadWizard>
Hello,
The problem is as follows:
Link is not clickable when situated in a disabled cell.
Steps to reproduce.
1. Place a link in a cell or a range of cells
2. Disable the cell (range)
3. Click the link
The issue is replicated when the spreadsheet is higher than the screen height. To reproduce it, scroll the page and click the last visible cell.
Result: The page is scrolled to the beginning of the Spreadsheet element
Expected: The page is not scrolled
<telerik:RadSpreadsheet runat="server" ID="RadSpreadsheet1" Height="2000px" Width="100%">
</telerik:RadSpreadsheet>
Workaround: Placing the following script under the ScriptManager
<script>
kendo.spreadsheet.registerEditor('_validation_list', function () {
var context, list;
function create() {
var $list = $("[id$='SpreadsheetListBoxDropDown']").first();
var element = $list.closest(".rssPopup");
list = $find($list.attr("id"));
if (!this._listdropdown) {
var dropdown = new kendo.spreadsheet.DropDown(element);
this._listdropdown = dropdown;
list.add_selectedIndexChanged(function (sender, args) {
dropdown.close();
var item = list.get_selectedItem();
if (item) {
context.callback(item.get_value());
}
});
}
this._listdropdown.openFor(context.view.element.find('.k-spreadsheet-editor-button'));
}
function open() {
create();
var matrix = context.validation.from.value;
if (matrix) {
var items = list.get_items();
items.clear();
matrix.each(function (el) {
var item = new Telerik.Web.UI.RadListBoxItem();
item.set_text(el);
items.add(item);
});
}
}
return {
edit: function (options) {
context = options;
open();
},
icon: 'p-icon p-i-arrow-60-down'
};
});
</script>
The RadSpreadsheet server-side object does not support Named Ranges.
Workaround:
Nevertheless, you can load them client-side with the code below, by saving a JSON in a hidden field and loading it via the API:
protected void Page_Init(object sender, EventArgs e)
{
var path = Server.MapPath("~/App_Data/spreadsheet.xlsx");
var workbook = Workbook.Load(path);
HiddenField1.Value = workbook.ToJson();
}
<script>
function pageLoadHandler() {
var spreadsheet = $find("<%= RadSpreadsheet1.ClientID %>");
var hiddenfield = $get("<%= HiddenField1.ClientID %>");
if (hiddenfield.value) {
spreadsheet.get_kendoWidget().fromJSON(JSON.parse(hiddenfield.value))
hiddenfield.value = '';
}
// Sys.Application.remove_load(pageLoadHandler);
}
Sys.Application.add_load(pageLoadHandler);
</script>
<telerik:RadSpreadsheet runat="server" ID="RadSpreadsheet1"></telerik:RadSpreadsheet>
<asp:HiddenField runat="server" ID="HiddenField1" />
I think it might be very useful to add to cell comments a html code and be able to do it programmatically.
Thank you
In Internet Explorer version 11.418.18362.0, when hovering over the lower-right dot the cursor doesn't change to the expected cross-hair.
To Reproduce:
1. Open IE11
2. Navigate to the ASP.NET Spreadsheet Demo
3. Highlight a few cells
4. Hover the cursor over the lower-right dot
Expected Behavior:
The cursor changes to a thin cross-hair icon but it doesn't change in IE 11.
Currently, the RadSpreadsheet supports only Dollar as currency. As a temporary workaround, the Kendo UI Spreadsheet (https://demos.telerik.com/kendo-ui/spreadsheet/index) can be used as demonstrated in this Dojo example: https://dojo.telerik.com/imAWasuJ - Select a cell with number as value - Open the formats dropdown - Choose the "More Formats..." option - Select "Currency" tab - Choose a currency from the dropdown - Choose the desired format.
The default font size on the client is not saved explicitly on the Excel file, so the Excel defaults take over (11px Calibri), so upon subsequent import all cells will have that font.
Steps to repro:
go to https://demos.telerik.com/aspnet-ajax/spreadsheet/examples/import-export/defaultcs.aspx
export the file
import the file
Expected: nothing changes
Actual: all cells are 11px Calibri
Workaround: Set a default font when the cell font is null
public override void SaveWorkbook(Workbook workbook)
{
string path = "C:\\path-to-output.xlsx";
for (int i = 0; i < workbook.Sheets.Count; i++)
{
for (int j = 0; j < workbook.Sheets[i].Rows.Count; j++)
{
for (int l = 0; l < workbook.Sheets[i].Rows[i].Cells.Count; l++)
{
string fontFamily = workbook.Sheets[i].Rows[i].Cells[l].FontFamily;
workbook.Sheets[i].Rows[i].Cells[l].FontFamily = !string.IsNullOrEmpty(fontFamily) ? fontFamily : "Courier New";
double? fontSize = workbook.Sheets[i].Rows[i].Cells[l].FontSize;
workbook.Sheets[i].Rows[i].Cells[l].FontSize = fontSize.HasValue ? fontSize : 12;
}
}
}
workbook.Save(path);
}
A workaround is using directly the Kendo Spreadsheet widget as this will allow you to use its latest version that does not manifest this issue: https://demos.telerik.com/kendo-ui/spreadsheet/server-side-import-export Repro steps Go to https://demos.telerik.com/aspnet-ajax/spreadsheet/examples/import-export/defaultcs.aspx Go to an empty cell type some text change its font size (e.g., to 18) save the file import the file you just saved Expected: nothing changes Actual: (some) cells change their height and font size, not just the cell that was edited above
If you type 15 into the font size combo box and click away, a Javascript error is thrown and the font size of the selected cell does not change. If instead you type 16 and click away, the cell changes correctly. 16 is an option in the drop-down but 15 is not. Error message: RadSpreadsheetScripts.js:196 Uncaught TypeError: Cannot read property 'get_text' of null The font size combo box works correctly in the Kendo spreadsheet demo (both with the current and the 2017.1.124 Kendo version ). You can also press enter to commit your typed font size in the Kendo widget, but not in RadSpreadsheet. Steps to reproduce: 1. Open https://demos.telerik.com/aspnet-ajax/spreadsheet/examples/overview/defaultcs.aspx 2. Click inside the font -size dropdown 3. Type 15 and click outside the SpreadSheet Result: A JavaScript error is thrown.
I have two lines that was set to a certain height, Each time I save the sheet, those two lines expand by 8 pixels. Does anyone are reading those bug reports?
Problem with simple excel behavior. In excel when you type a string longer than the cell, text is not clipped and shows over other cells. Then, if you fill adjacent cell, text is then clipped. I've been able to mimic this behaviour using this css: .RadSpreadsheet .rssPane .k-spreadsheet-cell { overflow: visible !important; } But then, If you highlite those cells with background color the text is again clipped. The background color wipe the text. Attached is a small png to show the problem. Please fix this to work as excel. Users are complaining non stop. Thanks.