The latest version has broken one of our projects due to;
So we deliberately used both events which worked quite well (but is now disallowed);
<TelerikGrid Data="@SheetList"
@ref="_grid"
SelectionMode="@GridSelectionMode.Multiple"
@bind-SelectedItems="@SelectedSheets"
EditMode="GridEditMode.Inline"
OnRowContextMenu="@OnContextMenu"
OnRowClick="@OnRowClick"
OnAdd="OnAddHandler"
OnEdit="@OnEditHandler"
OnUpdate="OnUpdateHandler"
OnCreate="OnCreateHandler"
OnDelete="OnDeleteHandler"
OnRead="@(IsFromHierarchy ? null : OnReadItemsAsync)"
This pattern enabled us to create components that did EITHER server-side pagination, or if it was send a data list as a parameter from a parent component, then it would use that instead (and turn off server pagination).
What would now be the recommended pattern for this scenario? Or do we need to duplicate the whole grid in the component (which isnt ideal).
We upgraded to the latest Telerik Blazor components (8.1.1).
I think there's a bug in the TabStrip when setting the index of the ActiveTabIndex or @bind-ActiveTabIndex.
The page will scroll to the active tab automatically.
Here's a link to the Repl - https://blazorrepl.telerik.com/GfaTEmbR45zQSzEq44
If you remove @bind-ActiveTabIndex="@ActiveTabIndex" from the TelerikTabStrip then the page load normally.
Thanks,
Cesar
Currently the bubble sizes in the Chart are determined automatically, according to an internal algorithm.
Please add parameters for setting specific min and max bubble sizes by the application.
We are experiencing an issue where the ExportToPdfAsync() method on TelerikGrid is returning Excel data (XLSX format) instead of PDF data. This is causing MIME type errors when trying to process the exported data as a PDF.
===ADMIN EDIT===
Workaround
In the meantime, a possible workaround would be to use the document processing library (make sure the correct packages are installed for it) and import the xlsx file to a workbook, and then export the workbook to PDF. Here is an improvised example that demonstrates this by saving the file in your wwwroot folder as a pdf.
@inject IWebHostEnvironment HostingEnvironment
<TelerikGrid Data="@svcItemList" Height="75svh" Resizable="true" Sortable="true" Pageable="true" PageSize="15" FilterMode="@GridFilterMode.FilterMenu" SelectionMode="@GridSelectionMode.Multiple" SelectedItems="@SelectedSvcItems" @ref="@SvcItemGrid" SelectedItemsChanged="@( (IEnumerable<ArCustomersServiceItemInfo> sel) => OnRowSelect(sel) )">
<GridToolBarTemplate>
<TelerikButton OnClick="@GenerateReport">Generate PDF</TelerikButton>
</GridToolBarTemplate>
<GridExport>
<GridPdfExport AllPages="true" PageOrientation="GridPdfExportPageOrientation.Landscape" PaperSize="GridPdfExportPaperSize.A3" />
</GridExport>
<GridColumns>
<GridCheckboxColumn CheckBoxOnlySelection="true"></GridCheckboxColumn>
<GridColumn Field="SerialNumber">
<HeaderTemplate><b>SerialNumber</b></HeaderTemplate>
</GridColumn>
<GridColumn Field="Manufacturer">
<HeaderTemplate><b>Manufacturer</b></HeaderTemplate>
</GridColumn>
<GridColumn Field="EquipmentModelNumber">
<HeaderTemplate><b>Model</b></HeaderTemplate>
</GridColumn>
<GridColumn Field="TagDescription">
<HeaderTemplate><b>Description</b></HeaderTemplate>
</GridColumn>
<GridColumn Field="TagID">
<HeaderTemplate><b>TagID</b></HeaderTemplate>
</GridColumn>
<GridColumn Field="Quantity">
<HeaderTemplate><b>Quantity</b></HeaderTemplate>
</GridColumn>
</GridColumns>
</TelerikGrid>
@code {
private async Task GenerateReport()
{
isLoading = true;
var pdfStream = await SvcItemGrid.ExportToPdfAsync();
// The stream is actually XLSX, so convert it to PDF
using var ms = new MemoryStream(pdfStream.ToArray());
// Import XLSX to Workbook
var xlsxProvider = new Telerik.Windows.Documents.Spreadsheet.FormatProviders.OpenXml.Xlsx.XlsxFormatProvider();
var workbook = xlsxProvider.Import(ms);
// Export Workbook to PDF
var rootPath = HostingEnvironment.WebRootPath;
var saveLocation = Path.Combine(rootPath, "test.pdf");
var pdfProvider = new Telerik.Windows.Documents.Spreadsheet.FormatProviders.Pdf.PdfFormatProvider();
using (var fileStream = new FileStream(saveLocation, FileMode.Create))
{
pdfProvider.Export(workbook, fileStream);
}
}
public class ArCustomersServiceItemInfo
{
public string SiteID { get; set; }
public string CompanyCode { get; set; }
public string ARSubledgerCode { get; set; }
public string CustomerCode { get; set; }
public string LineNumber { get; set; }
public string LineNumberUnique { get; set; }
public string TagID { get; set; }
public string TagDescription { get; set; }
public string Manufacturer { get; set; }
public string EquipmentModelNumber { get; set; }
public string SerialNumber { get; set; }
public string UnitType { get; set; }
public string Location { get; set; }
public DateTime? InstallationDate { get; set; }
public int? WarrantyPeriod1 { get; set; }
public DateTime? ExpiryDate1 { get; set; }
public int? WarrantyPeriod2 { get; set; }
public DateTime? ExpiryDate2 { get; set; }
public int? WarrantyPeriod3 { get; set; }
public DateTime? ExpiryDate3 { get; set; }
public string Status { get; set; }
public string Area { get; set; }
public string Installer { get; set; }
public int? Quantity { get; set; }
public DateTime? LastModified { get; set; }
public string Comments { get; set; }
}
private List<ArCustomersServiceItemInfo> svcItemList = new()
{
new ArCustomersServiceItemInfo { SiteID = "ZGJC-QAADV", CompanyCode = "UN", ARSubledgerCode = "A/R", CustomerCode = "1", LineNumber = "00035", LineNumberUnique = "00035", TagID = "ID20240620L", TagDescription = "desctr", Manufacturer = "MAN20240620L45", EquipmentModelNumber = "MOD20240620L45", SerialNumber = "SER20240620L45", UnitType = "", Location = "", InstallationDate = null, WarrantyPeriod1 = 0, ExpiryDate1 = null, WarrantyPeriod2 = 0, ExpiryDate2 = null, WarrantyPeriod3 = 0, ExpiryDate3 = null },
new ArCustomersServiceItemInfo { SiteID = "ZGJC-QAADV", CompanyCode = "UN", ARSubledgerCode = "A/R", CustomerCode = "1", LineNumber = "00034", LineNumberUnique = "00034", TagID = "ID20240620A", TagDescription = "Description", Manufacturer = "MAN20240620A", EquipmentModelNumber = "MOD20240620A", SerialNumber = "SER20240620A", UnitType = "", Location = "LOC2024062", InstallationDate = null, WarrantyPeriod1 = 0, ExpiryDate1 = null, WarrantyPeriod2 = 0, ExpiryDate2 = null, WarrantyPeriod3 = 0, ExpiryDate3 = null },
new ArCustomersServiceItemInfo { SiteID = "ZGJC-QAADV", CompanyCode = "UN", ARSubledgerCode = "A/R", CustomerCode = "1", LineNumber = "00033", LineNumberUnique = "00033", TagID = "test", TagDescription = "descripcion", Manufacturer = "MAN20240617A", EquipmentModelNumber = "MOD20240617A", SerialNumber = "SER20240617A", UnitType = "", Location = "LOC2024061", InstallationDate = null, WarrantyPeriod1 = 0, ExpiryDate1 = null, WarrantyPeriod2 = 0, ExpiryDate2 = null, WarrantyPeriod3 = 0, ExpiryDate3 = null }
};
private TelerikGrid<ArCustomersServiceItemInfo> SvcItemGrid;
private List<ArCustomersServiceItemInfo> SelectedSvcItems = new();
private string base64Pdf = string.Empty;
private string email = string.Empty;
private string subject = "Service Item PDF Report";
private string emailStatus = string.Empty;
private bool isLoading = false;
private void OnRowSelect(IEnumerable<ArCustomersServiceItemInfo> selected)
{
SelectedSvcItems = selected.ToList();
}
}
Regression introduced in version 10.0.0.
The OnStateChanged event fires 4 times
The OnStateChanged event fires 2 times (see https://www.telerik.com/blazor-ui/documentation/components/grid/state#onstatechanged).
All
9.1.0
Hello,
it seems that something is missing to get it working in "SpeecToTextButton".
how to reproduce:
it flickers for a while(at system taskbar, there is also indication of recording) but nothing is "recorded/transcribed".
Is there any additional setup at clientside?
The default color of the chips is currently set to the base color, and this color cannot be changed. To allow customization, consider adding a ThemeColor parameter, similar to what is available in the Chip component.
=======
TELERIK EDIT:
In the meantime, you can consider CSS-based workarounds. The following example shows a more dynamic approach to the task.
<h3>Telerik CSS Variables</h3>
<TelerikChipList Data="@ChipListDataVariables">
<ItemTemplate>
<span class="@context.ColorClass">
<TelerikSvgIcon Icon="@context.Icon" />
@context.Text
</span>
</ItemTemplate>
</TelerikChipList>
<h3>Colors</h3>
<TelerikChipList Data="@ChipListDataColors">
<ItemTemplate>
<span class="c-@context.ColorClass">
<TelerikSvgIcon Icon="@context.Icon" />
@context.Text
</span>
</ItemTemplate>
</TelerikChipList>
<style>
@foreach (ChipModel chip in ChipListDataVariables)
{
<text> .k-chip:has(.@chip.ColorClass) { background-color: var(--kendo-color-@chip.ColorClass); color: var(--kendo-color-on-@chip.ColorClass); } </text>
}
@foreach (ChipModel chip in ChipListDataColors)
{
<text> .k-chip:has(.c-@chip.ColorClass) { background-color: @chip.ColorClass; color: white; } </text>
}
</style>
@code {
private List<ChipModel> ChipListDataVariables { get; set; } = new List<ChipModel>() {
new ChipModel()
{
Text = "Excel",
Icon = SvgIcon.FileExcel,
ColorClass = "base"
},
new ChipModel()
{
Text = "Audio",
Icon = SvgIcon.FileAudio,
Removable = true,
ColorClass = "primary"
},
new ChipModel()
{
Text = "Video",
Icon = SvgIcon.FileVideo,
ColorClass = "info"
},
new ChipModel()
{
Text = "Image",
Icon = SvgIcon.FileImage,
ColorClass = "success"
}
};
private List<ChipModel> ChipListDataColors { get; set; } = new List<ChipModel>() {
new ChipModel()
{
Text = "Excel",
Icon = SvgIcon.FileExcel,
ColorClass = "gray"
},
new ChipModel()
{
Text = "Audio",
Icon = SvgIcon.FileAudio,
Removable = true,
ColorClass = "red"
},
new ChipModel()
{
Text = "Video",
Icon = SvgIcon.FileVideo,
ColorClass = "blue"
},
new ChipModel()
{
Text = "Image",
Icon = SvgIcon.FileImage,
ColorClass = "green"
}
};
public class ChipModel
{
public string Text { get; set; } = string.Empty;
public ISvgIcon? Icon { get; set; }
public bool Disabled { get; set; }
public bool Removable { get; set; }
public string ColorClass { get; set; } = string.Empty;
}
}
namespace Telerik.Blazor.Components.Common;
TelerikGrid<T>
{
public virtual void Rebind()
{
ProcessDataAsync();
}
}
Rebind() doesnt use async/await, but ProcessDataAsync() does, which leads to race conditions.
Using the TelerikTabSrip, If the first tab is not visible when rendered, the tab content for all tabs doesnt render.
Replicated here https://blazorrepl.telerik.com/cpEWGOPk22VW8be254
If you change the code to make the first tab visible, all is well.
You can make other tabs invisible, and all is well.
Appointment editing does not work on Chrome for mobile (Android).
Run the following demo in the Chrome for mobile browser, on a mobile device with Android : https://demos.telerik.com/blazor-ui/scheduler/appointment-editing
The popup editor does not show up.
The popup editor shows up.
Chrome
No response
Currently, the marker tooltip can be shown only when hovering the marker. I want to show the tooltip when the user clicks the marker.
Example use case:
I've included clickable elements in the tooltip. The tooltip is hidden as soon as the mouse leaves the marker and the user cannot interact with the tooltip elements.
I'm looking for what you have in WPF as we migrate ourselves over to Blazor - https://www.telerik.com/products/wpf/conversational-ui.aspx
---
ADMIN EDIT
For the time being, you can consider using the Kendo Chat widget as described in this sample project.
---
Would like to be able to change / recall State of expanded / collapsed items in FileManager, similar to how we can with the Grid component using Groups.
We would also like the ability to set the Splitter collapsed on initial load to hide the tree.
On refreshing data from the database, the entire File Manager reverts to all items collapsed, which will be annoying for end users.
State management could also deal with the default view (Details vs Icons) as requested elsewhere for this component.
Similar to the WPF grid I would like the option to require the user hold shift to sort by multiple columns, otherwise the grid would sort by only a single column.
https://docs.telerik.com/devtools/wpf/controls/radgridview/sorting/multiple-column-sorting