I have a grid that is inline editable
My problem is when the drop down appears it looks like this
Some of the items wrap around to two rows. I would like the drop down to expand to fit the width of the text.
I looked in Chrome and I see the item is in an unnamed div that starts with this
<div class="k-animation-container"
I have tried the following in my .css to override the width of the container
.k-animation-container { width: auto; }
and that doesn't seem to have any effect.
Is there a way to change the width of the drop down when it appears without changing the width of the containing column in the grid?
Hi everyone,
I'm using the Telerik UI for ASP.NET Core Editor to add my content from a Word file, but I'm encountering an issue. When I copy content from the Word file and paste it into the editor, additional CSS classes are being added to the tags.
For example: I copied paragraph from Word File and its looking like this (Class of MsoNormal and other style properties are added)
<p class="MsoNormal" style="margin:0pt 0pt 0.0001pt;font-family:Calibri;font-size:medium;">Drivida Marketplace provides a comprehensive guide to school owners with tools to manage their educational institutions effectively.</p>
<p class="MsoNormal" style="margin:0pt 0pt 0.0001pt;font-family:Calibri;font-size:medium;"> </p>
<p class="MsoNormal" style="margin:0pt 0pt 0.0001pt;font-family:Calibri;font-size:medium;">This comprehensive guide aims to provide school owners with a clear understanding of the suite of tools available within the platform, enabling them to manage their educational institution effectively. Here's what you can do with the School Portal:</p>
<p class="MsoNormal" style="margin:0pt 0pt 0.0001pt;font-family:Calibri;font-size:medium;"> </p>
<p class="MsoNormal" style="margin:0pt 0pt 0.0001pt;font-family:Calibri;font-size:medium;"> </p>
Is there any way to Remove these Class and other properties from Telerik Editor HTML Code?
Can anyone help me resolve this issue?
I am also attaching sample Word File
Thank you!
Hello guys,
is it possible to define a conditional formatting on a whole column? E.g. if you want to set the background of a cell to yellow if the value is greater than 0 (see screenshot, column 'Fehlend').
In my case it's even more difficult because my whole datasource is coming from the server.
@(Html.Kendo().Spreadsheet()
.Name("bestandsliste")
.Columns(3)
.HtmlAttributes(new { style = "width:100%" })
.Sheets(x =>
{
x.Add()
.Name("Bestandsliste")
.Columns(y =>
{
y.Add().Width(400);
y.Add().Width(120);
y.Add().Width(120);
y.Add().Width(120);
})
.DataSource<Fahnenbestand>(y => y
.Custom()
.Sort(z => z.Add(a => a.Fahnenkategorie))
.Transport(z => z.Read("spreadsheet_onRead"))
)
.FrozenRows(1)
.Rows(y =>
{
y.Add().Height(30).Cells(z =>
{
z.Add().FontSize(20).TextAlign(SpreadsheetTextAlign.Center);
z.Add().FontSize(20).TextAlign(SpreadsheetTextAlign.Center);
z.Add().FontSize(20).TextAlign(SpreadsheetTextAlign.Center);
z.Add().FontSize(20).TextAlign(SpreadsheetTextAlign.Center);
});
});
})
.Sheetsbar(false)
.Toolbar(false)
)
function spreadsheet_onRead(options) {
$.ajax({
url: `@ViewData[ViewDataVariables.UrlWebApi]/FlagCategory/GetOverviewAllFlagsAsSpreadsheet`,
headers: { 'Authorization': '@token' },
success: function (result) {
var sheet = kendoSpreadSheetBestandsliste.activeSheet();
sheet.resize(result.Total + 5, 3);
options.success(result.Data);
},
error: function (result) {
options.error(result);
}
});
}
I already check the css of the cells. Indeed I can simply set the background color of the cells of a specific column by a condition via jquery (like "if value greater 0, set background yellow"), but the cells carry very little informations. It's not possible to prove if the cell I'm currently looking is belonging to correct column. It would be easy if there would be an attribute like aria-labeledby="COLUMNHEADERCELL" but that's not the case.
<div class="k-spreadsheet-cell" style="[..]"><div class="k-vertical-align-bottom">1</div></div>
Maybe there is a solution to get all cells of one column via the api of my spreadsheet object? Looking forward to hearing from you.
Best regards,
Daniel
Is there a way to refresh an Asp.Net Core PivotGri?
i.e.: I have a PivotGrid open. I know that there are changes to the underlying tables and I want to see the changes in the PivotGrid without having to close it and then re-open it.
Using Asp.Net Core 6, C# and Telerik 2323.1.307
Thanks
Hello,
We are exporting data to Excel server-using something similar to:
https://docs.telerik.com/aspnet-core/html-helpers/data-management/grid/export/server-export
How do we set the column to autowidth=true or to adjust the width of the column to the size of the content?
Thanks
Hey guys,
I'm currently working newly with the kendo spreadsheet. Default amount of rows is 200 and I can define it programatically, I know.
My spreadsheet has a datasource. Is there a smart solution to handle the count of rows by it's datasource? So if the datasource has 400 elements, that my spreadsheet increase the rows?
Best Regards,
Daniel
@(Html.Kendo().Spreadsheet()
.Name("bestandsliste")
.HtmlAttributes(new { style = "width:100%" })
.Sheets(x =>
{
x.Add()
.Name("Bestandsliste")
.DataSource<Fahnenbestand>(y => y
.Custom()
.Transport(z => z.Read("spreadsheet_onRead"))
);
})
.Sheetsbar(false)
.Toolbar(false)
)
function spreadsheet_onRead(options) {
$.ajax({
url: `@ViewData[ViewDataVariables.UrlWebApi]/FlagCategory/GetOverviewAllFlagsAsSpreadsheet`,
headers: { 'Authorization': '@token' },
success: function (result) {
console.log(options);
console.log(options.rows);
options.success(result.Data);
},
error: function (result) {
options.error(result);
}
});
}
expanding a column in a data grid was working fine in the previous version but not in version 5.12.0.
when I click on the + sign to expand it's showing the -sign (like it's expanded) but it's not triggering any event to show the hidden content.
How do you set, and get back the selected value of an dropdownlist-item set through local data binding? Here you can see that I have a list of judges, and a list of court dates for each judge, I would like to be able to set, and get back the id of each court date in the PostBack in razor pages. How do I do so?
<kendo-dropdowntree name="dropdowntree" auto-width="true" >
Have a similar scenario as below (taken from example)
https://docs.telerik.com/aspnet-core/html-helpers/data-management/grid/faq
However, in my case, the "additionalData" method is trying to read the values from a Kendo DropDownlist, that has its own .Read method and it appears the Grid is trying to load via its Read method before the dropdown has finished loading via the controller method it calls. How can I ensure the grids .Data method has all its vallues available before its .Read method is called. The Dropdown's read method doesnt return in time before it returns its JSON object with one of its values is null and this causes the grid .Read method to take way too long.
// Omitted for brevity.
.DataSource(dataSource => dataSource.Ajax()
.Read(read => read
.Action("Read", "Home")
.Data("additionalData")
)
)
// Omitted for brevity.
<script>
function additionalData() {
return {
userID: 42,
search: $("#search").val()
};
}
</script>