Reproduction with Data parameter
https://blazorrepl.telerik.com/GJYPlrEW485dZtjX55
Reproduction with OnRead
I made a Blazor REPL reproduction: https://blazorrepl.telerik.com/mcuCGpYr4223mhWY49. Run and observe the person label is overlapping the dropdown.
How to reproduce:
<TelerikFloatingLabel Text="Person">
<TelerikComboBox
TItem="@Person" TValue="@int"
ScrollMode="@DropDownScrollMode.Virtual"
OnRead="@GetRemoteData"
ValueMapper="@GetModelFromValue"
ItemHeight="30"
PageSize="20"
TextField="@nameof(Person.Name)"
ValueField="@nameof(Person.Id)"
@bind-Value="@SelectedValue"
Filterable="true" FilterOperator="@StringFilterOperator.Contains">
<ComboBoxSettings>
<ComboBoxPopupSettings Height="200px" />
</ComboBoxSettings>
</TelerikComboBox>
</TelerikFloatingLabel>I have been having issues adding the month view to a Telerik Blazor scheduler component, when there is grouping. It gives a null reference error any time I try to switch to the month view. I also tried it using the available demo for grouping in Telerik REPL, the only difference I found between my code and the demo was that I had used the ItemsPerSlot parameter. I added this to the demo, and was able to reproduce the error I was seeing, and I have attached the console output from the REPL demo. I believe there is either a bug with the ItemsPerSlot being used in conjunction with grouping on a scheduler component, or some instruction missing from how to set it up properly to prevent this null reference issue.
Changed code:
<SchedulerMonthView ItemsPerSlot="5"></SchedulerMonthView>
Demo used:
Blazor Scheduler (Event Calendar) Demos - Grouping | Telerik UI for Blazor
The ability to choose which options to appear in the ContextMenu.
=====
TELERIK EDIT: In the meantime, here is how to hide context menu items with CSS:
/* Hide the Rename item in the FileManager context menu */
.k-context-menu:has(.k-svg-i-download) .k-menu-item:nth-of-type(1) {
display: none;
}
/* Hide the Delete item in the FileManager context menu */
.k-context-menu:has(.k-svg-i-download) .k-menu-item:nth-of-type(3) {
display: none;
}Here is a complete example: https://blazorrepl.telerik.com/cpPkuBEq408A36p010
When the ComboBox is bound with the OnRead event, after filtering and pressing the Tab key the highlighted item that matches the user input is not selected. If the ComboBox is bound through the Data parameter, the highlighted item is selected as expected.
The ComboBox is blurred and the BMW item is not selected.
The ComboBox is blurred and the BMW item is selected.
All
No response
The NOW button in the TimePicker's TimeView sets the time value, according to the server's time zone. Instead, it should use the client-side (user) time zone.
===
Telerik edit:
In the meantime, you can subscribe to the TimePicker's ValueChanged event and detect when the user clicks on Now. In such cases, the event handler will receive the current server time with a small margin of error, that depends on the latency.
<TelerikTimePicker Value="@TimePickerValue"
ValueChanged="@( (DateTime? d) => TimePickerValueChanged(d) )">
</TelerikTimePicker>
@code {
private DateTime? TimePickerValue { get; set; }
private void TimePickerValueChanged(DateTime? newValue)
{
if (newValue.HasValue && newValue - DateTime.Now < new TimeSpan(0, 0, 1))
{
// Retrieve and set the correct user's local time. The dummy code below is just for testing.
TimePickerValue = DateTime.Now.AddMinutes(2);
}
else
{
TimePickerValue = newValue;
}
}
}
Currently, I'm using your Calendar component for a vacation request feature. It works decently for picking dates in that I can use CTRL and Shift to select many dates. I'm currently making the page responsive but the mobile user experience lacks because there is no way to select more than one date.
The ideal user experience would be to be able to single click (or tap from mobile) to select a date and be able to do that on as many dates as preferred (to select many). Clicking/tapping again would deselect the date. That would be better in both the desktop and mobile versions and more intuitive for a user (as no one has initially assumed CTRL and Shift work - I have had to train them).
I'm trying to use the Blazor editor but the "Insert Image" function is very basic. Previously using Webforms & Core the insert image in the editor presented the user with a file management and image upload popup. Is this functionality available with the Blazor component?
=====ADMIN EDIT=====
Possible alternative:
When the Grid is grouped and aggregate functions are enabled, paging performance degrades significantly because grouping and aggregate calculations are executed on every page change. This results in noticeable delays and UI stutter, especially in WebAssembly applications and larger datasets.
This enhancement optimizes page navigation for grouped Grid scenarios with aggregates by avoiding repeated processing when the underlying data has not changed, resulting in substantially faster paging performance while preserving existing functionality and first-load behavior.
The only scenario that works is to set the initial Zoom to a numeric value and have an open file by default.
The TreeView OnItemContextMenu event should fire only for the clicked item, but it fires for its parents too. The issue started occurring in version 13.0.0.
Test page
https://www.telerik.com/blazor-ui/documentation/components/treeview/events#example
(bug report only)
1. Run this example: https://blazorrepl.telerik.com/cUaBGOOZ34pkp6wB57
2. Inspect the MultiSelect’s input.
3. Click within the component’s input area, to open its popup.
The issue is also reproducible in the other dropdown components: https://blazorrepl.telerik.com/GUurGmvw32oPqGYu03
(optional)
When the dropdown opens, an aria-controls attribute is applied to the MultiSelect’s input. Its value does not match any existing DOM element.
The value of the aria-controls attribute should point at an existing element (e.g., the popup’s list element: https://www.telerik.com/blazor-ui/documentation/components/multiselect/accessibility/wai-aria-support#multiselect-wrapping-element ). But in this case the MultiSelect is not bound to data and a list element is not rendered in the popup.
I would like to see icon support for the switch control. See the attached screen shot for the use case.
Hi,
I would like checkbox support including the check all checkbox on the multiselect component like: https://docs.telerik.com/devtools/aspnet-ajax/controls/combobox/functionality/checkbox-support
The url below shows how to create custom checkboxes in the multiselect component but adding a check all checkbox in the headertemplate does not update the multiselect popup
UI for Blazor version 5.0 improved the FileSelect Stream performance by removing legacy code that meant to support older .NET versions.
However, the Stream performance is still worse and the component works slower, compared to the standard Blazor InputFile.
An input with type="password" should not have a default role. See:
w3c/html-aria#422
https://w3c.github.io/html-aria/#dfn-no-corresponding-role
Inspect the rendering of the password input in this demo: https://demos.telerik.com/blazor-ui/textbox/password
The element renders a role="textbox" attribute.
The element does not render a role="textbox" attribute.
All
No response
If the GridScrollMode.Virtual is enabled for the Grid, and the NoDataTemplate exceeds the height of the Grid container, a user can infinitely scroll inside the table even when there is no data and the template is displaying.
===ADMIN EDIT===
A possible workaround is to apply "overflow-y: hidden;" when the NoDataTemplate is shown: REPL link.
I am using a Blazor Telerik Grid and implementing a custom TelerikCheckBoxListFilter inside a FilterMenuTemplate.
When a user opens the "Name" filter menu and types a name quickly into the search/filter box, some of the text is removed automatically.
For example, if I type "1234567890" as input, without any delay - some of the letters will be cleared and it is showing as "1246890" in the filter search box. It could be because it is searching in real time, but the user input I am typing is not carried over correctly. See the attached screenshot taken from Telerik Demo site for the above said example.
Below is the column definition I am currently using:
<GridColumn Field="@nameof(Tenant.TenantName)" Title="Name" Width="*" FilterMenuType="@FilterMenuType.CheckBoxList">
<FilterMenuTemplate Context="context">
<TelerikCheckBoxListFilter Data="@Model.DistinctTenantNameList"
Field="@(nameof(FilterTenantName.TenantName))"
@bind-FilterDescriptor="@context.FilterDescriptor">
</TelerikCheckBoxListFilter>
</FilterMenuTemplate>
</GridColumn>
Hallo,
i want to Render PDF Files with the PDF Viewer Component.
The Data of the PDF is already fetched from the API when the PDF-Viewer starts Rendering the Loading animation appears and freezes.
After a few Seconds the PDF will be Rendered.
The size of the PDF File is about 5MB.
=====
TELERIK EDIT: Here is a possible workaround - replace the built-in PDF Viewer LoaderContainer with another one with a different animation Type.
<div class="pdfviewer-wrapper">
<TelerikPdfViewer Height="600px" />
@* With a Loading... label *@
<TelerikLoaderContainer Class="pdf-loader-container"
OverlayThemeColor="@ThemeConstants.Loader.ThemeColor.Light"
Size="@ThemeConstants.Loader.Size.Large"
Visible="true" />
@* Without a Loading... label *@
@*<TelerikLoaderContainer Class="pdf-loader-container"
OverlayThemeColor="@ThemeConstants.Loader.ThemeColor.Light"
Visible="true">
<Template>
<TelerikLoader Size="@ThemeConstants.Loader.Size.Large"
Type="@LoaderType.Pulsing" />
</Template>
</TelerikLoaderContainer>*@
</div>
<style>
.pdfviewer-wrapper {
position: relative;
}
.pdf-loader-container,
.k-pdf-viewer .k-loader-container {
visibility: hidden;
}
.k-pdf-viewer:has(.k-loader-container:not([style*="none"])) + .pdf-loader-container {
visibility: visible;
}
</style>
@code {
private byte[]? PdfViewerData { get; set; }
}