The AutoComplete component does not update the category grouping header, even when the data within that group has been removed. As a result, the outdated group header remains visible until you scroll down to another group, at which point the first group header refreshes and disappears as expected.
Repro: REPL link.
Hi Support,
I have an issue with the DragToSelect feature of a Telerik grid in Blazor when this grid is inside a TelerikWindow.
Summary
When a TelerikGrid configured with GridSelectionSettings DragToSelect="true" is rendered inside the <WindowContent> of a <TelerikWindow>, the drag-to-select (rubber-band) behavior is not working properly — the user can only select cells/rows via individual clicks.
Single-click selection continues to work in both cases. The issue is specific to the drag gesture.
Steps to reproduce
Create a page with a TelerikWindow set to Visible="true".
Inside <WindowContent>, place a TelerikGrid with:
SelectionMode="@GridSelectionMode.Multiple"
SelectedCells / SelectedCellsChanged bound
<GridSettings><GridSelectionSettings SelectionType="@GridSelectionType.Cell" DragToSelect="true" /></GridSettings>
Open the window and try to select multiple cells by pressing the mouse button on a cell and dragging over neighboring cells.
Expected behavior
A rubber-band selection rectangle appears and all cells the pointer passes over become selected — same as when the identical grid is placed on a regular page (outside a modal window).
Actual behavior
Drag selection occur rarely. Only the single cell under the initial mousedown gets selected. The rubber-band rectangle rarely appears, and SelectedCellsChanged fires with a single descriptor instead of the full drag range.
Minimal repro (REPL-ready)
<TelerikWindow Visible="true" Width="800px" Height="500px">
<WindowTitle>Repro</WindowTitle>
<WindowContent>
<TelerikGrid Data="@Data" TItem="SampleItem"
SelectionMode="@GridSelectionMode.Multiple"
SelectedCells="@SelectedCells"
SelectedCellsChanged="@((IEnumerable<GridSelectedCellDescriptor> c) => SelectedCells = c)">
<GridSettings>
<GridSelectionSettings SelectionType="@GridSelectionType.Cell" DragToSelect="true" />
</GridSettings>
<GridColumns>
<GridColumn Field="@nameof(SampleItem.Id)" />
<GridColumn Field="@nameof(SampleItem.Name)" />
</GridColumns>
</TelerikGrid>
</WindowContent>
</TelerikWindow>
@code {
public record SampleItem(int Id, string Name);
private List<SampleItem> Data = Enumerable.Range(1, 20).Select(i => new SampleItem(i, $"Item {i}")).ToList();
private IEnumerable<GridSelectedCellDescriptor> SelectedCells = Enumerable.Empty<GridSelectedCellDescriptor>();
}
Now my questions :
- Is this a known limitation of DragToSelect when the grid is inside a modal TelerikWindow?
- Is there an officially supported workaround (CSS pointer-events tweak on .k-overlay, event capture override, grid setting, etc.)?
- If it is a bug, could you open a public issue we can track?
Many thanks you in advance.
Franck Boisdé
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
Support multiple users editing the same content in an editor.
This would be similar to the editor in something like confluence or online Word.
Regards
(bug report only)
Regression introduced in 13.0.0.
1. Run this example: https://blazorrepl.telerik.com/wUuSGClv00orFeRm59
(optional)
The Size, Rounded, FillMode parameters are ignored.
The parameter values should apply and change the appearance of the SearchBox.
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:
I would like the following behavior in the date picker. Perhaps it can be achieved with a parameter similar to the one in UI for ASP.NET AJAX - the FocusedDate property (something like RadDatePicker1.FocusedDate = DateTime.Today.AddDays(30);).
The current behaviour is:
* if date is set, show month of set date
*else show month of current date (today)
Desired behaviour:
* if date is set, show month of set date
* else if min date's month is greater than current date month then show month of min date
* else show month of current date
Here is a code snippet to illustrate the issue:
Open the picker - it will start in the month with today's date, but I want it to start at the min date - one month later
<TelerikDatePicker @bind-Value="@theDate" Min="@minDate" Max="@maxDate"></TelerikDatePicker>
@code {
DateTime theDate = DateTime.Now;
DateTime minDate = DateTime.Now.AddDays(60);
DateTime maxDate = DateTime.Now.AddDays(230);
}===
I am testing with a Blazor WASM Standalone app that uses Telerik UI for Blazor. I have a sample page with a button on click of which a predefined dialog (for example, alert) is shown. If you make some change on the page and hot reload is enabled, the button click no longer opens the predefined dialog. The dialog is shown only if I navigate to a different page.
The Set button should not be enabled when you change the month from the button in the popup, until the user selects a date too.
===
TELERIK EDIT:
If the user clicks Set without selecting a date, the component will assume DateTime.MinValue. You can set the current DateTime or clear the Value by using the DateTimePicker OnChange or ValueChanged event:
<TelerikDateTimePicker @bind-Value="@DateTimePickerValue"
OnChange="@DateTimePickerValueChanged"
Width="300px">
</TelerikDateTimePicker>
@code {
private DateTime? DateTimePickerValue { get; set; }
private void DateTimePickerValueChanged(object currentValue)
{
if (DateTimePickerValue.HasValue && DateTimePickerValue.Value == DateTime.MinValue)
{
// Set current DateTime
DateTimePickerValue = DateTime.Now;
// OR
// Clear the value
//DateTimePickerValue = default;
}
}
}
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
I would like to see icon support for the switch control. See the attached screen shot for the use case.
With Blazor server, clicking the NOW button (obviously) sets the time to the time on the server since that's where the code is running. Is there a way to trap the NOW button click or somehow give it an offset or define the value that NOW means so NOW will mean the time that the user is sitting in?
---
TELERIK EDIT
In the meantime, here are a few possible workarounds:
1. Use the DateTimePicker's ValueChanged event to detect new values that are very close or match the server's current DateTime. In such cases, you can assume that the user has clicked on TODAY / NOW, and set the local user time as a component value.
Server Time on UI Refresh: @DateTime.Now.ToLongTimeString()
<br />
User Local Time on Page Load: @LocalTime?.ToLongTimeString()
<br />
User Local Time Offset: @LocalOffset
<br />
<br />
<TelerikDateTimePicker Value="@PickerValue"
ValueChanged="@( (DateTime? newValue) => PickerValueChanged(newValue) )"
ValueExpression="@( () => LocalTime )"
Format="yyyy-MMM-dd HH:mm:ss"
Width="240px" />
<!-- Move JS code to a separate JS file in production -->
<script suppress-error="BL9992">
function getLocalTime() {
var d = new Date();
return d.getTimezoneOffset();
}
</script>
@code {
private DateTime? PickerValue { get; set; }
private DateTime? LocalTime { get; set; }
private int LocalOffset { get; set; }
private void PickerValueChanged(DateTime? newValue)
{
DateTime serverNow = DateTime.Now;
DateTime utcNow = DateTime.UtcNow;
TimeSpan nowTolerance = new TimeSpan(0, 0, 10);
if (newValue - serverNow < nowTolerance)
{
PickerValue = utcNow.AddMinutes(-LocalOffset);
}
else
{
PickerValue = newValue;
}
}
protected override async Task OnAfterRenderAsync(bool firstRender)
{
if (firstRender)
{
LocalOffset = await js.InvokeAsync<int>("getLocalTime");
LocalTime = DateTime.UtcNow.AddMinutes(-LocalOffset);
StateHasChanged();
}
await base.OnAfterRenderAsync(firstRender);
}
}
2. Use the DatePicker's HeaderTemplate with a custom TODAY / NOW button.
3. Hide the NOW button with CSS:
<style>
.no-now-button .k-time-now {
display: none;
}
</style>
<TelerikDateTimePicker @bind-Value="@PickerValue"
Format="yyyy-MMM-dd HH:mm:ss"
PopupClass="no-now-button"
Width="240px" />
@code {
private DateTime? PickerValue { get; set; }
}
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>
In TelerikSelectBase that the DropDownList inherits, the FieldIdentifier is set only in the OnInitializedAsync method and therefore the FieldIdentitier is never updated. This can cause issues with validation as seen in this example: https://blazorrepl.telerik.com/GyamPdlf37LXpPAW36.
To reproduce:
For reference, in the TelerikInputBase, the FieldIdentifier is set in the SetParameterAsync and thus it is accordingly updated. See the TextBox behavior in the above sample.
The NumericTextBox does not render the new Value that is set in ValueChanged if this new value is different than the event argument. Instead, the component clears the textbox, even though the component Value parameter is correct.
https://blazorrepl.telerik.com/wzaAHYas221go9xd48
The problem occurs only if there is an existing value and the user removes it with Backspace.