Once a user has clicked an appointment to select it, I'd like the ability to clear this selection. For example, if you show one set of appointments, then click a radio button on the page to switch to a different set of appointments, I'd like to clear the selection so that no appointment is selected. The way it works now, the component appears to store the index of the selected appointment and then re-apply that when it's rendered with new appointments.
More context here: https://www.telerik.com/forums/how-to-clear-the-selected-slot-in-the-scheduler
The DropDownList is supposed to open the popup element when Alt-Down is pressed. This doesn't work if the page itself scrolls. Pressing alt-down scrolls the page instead. This is on macOS Safari and Chrome on a MacBook.
https://demos.telerik.com/blazor-ui/dropdownlist/keyboard-navigation
The Editor converts new lines in the HTML content to empty paragraphs if the Value is set after the component is initialized and rendered.
Here is a test page with the possible workarounds. The app can either display the Editor after its Value becomes available, or strip the new lines before setting the component Value.
Bug report
Reproduction of the problem
(bug report only)
Reproducible in the demos: https://demos.telerik.com/blazor-ui/dropdowntree/overview
- Click somewhere in the component to open its dropdown
Current behavior
(optional)
For a brief moment the filter input in the dropdown appears focused, but then the focus moves to the first item in the list. If the user clicks the “down arrow” icon to open the dropdown, the filter input is focused as expected.
Expected/desired behavior
The filter input is focused regardless where in the component the user clicks.
Environment
- Kendo/Telerik version: 14.0.0
- Browser: [all ]
Steps to reproduce
Reproducible with UI for Blazor, as well as UI for ASP.NET Core (PDF.js and DPL processing)
- Open the attached file in the PDFViewer.
Actual Behavior
The content is visualized distorted, large parts of it are missing, layout is messed up.
Expected Behavior
The document content is visualized properly, as it is with: https://mozilla.github.io/pdf.js/web/viewer.html
(Also applies to AutoComplete, DropDownList, MultiSelect, MultiColumnComboBox).
When using Height="auto" in the popup settings and filtering with a dropdown above the component, the dropdown detaches from the main component.
<ComboBoxPopupSettings Height="auto"></ComboBoxPopupSettings>https://blazorrepl.telerik.com/cKkSQGFO50ovCpr829
A possible workaround is to use a MaxHeight that is less than half the browser viewport.
<ComboBoxPopupSettings Height="auto" MaxHeight="45vh"></ComboBoxPopupSettings>
Bug report
Reproduction of the problem
The Diagram's JS handle-creation logic (_createHandles) throws an exception whenever a connection has both Points.Enabled = true and Drag/Remove enabled at the same time.
- Run this REPL example: https://blazorrepl.telerik.com/mAaDQlPk22WdK2jH57
- Click a connection
Current behavior
A js exception is thrown: Uncaught TypeError: can't access property "radius", e.midpoint is undefined
Expected/desired behavior
No exception is thrown.
Workaround:
Do not set the Points property in the DiagramConnectionEditableDescriptor:
*Points = new DiagramConnectionEditablePointsDescriptor
*
Editable = new DiagramConnectionEditableDescriptor
{
Enabled = true,
Drag = true,
Remove = false
}
If using declarative shapes, remove:
<DiagramConnectionEditablePoints Enabled="true" />
from the connections.
Environment
- Kendo/Telerik version: 15.0.1
- Browser: [all]
Version: 14.0.0
Description:
Behavior of TabStripTab is inconsistent when working with Mouse vs Keyboard driven workflow. The OnStateChanged event documentation states it fires "on any change to the active tab, tab visibility, pinning, or order." In practice, this only holds true for mouse-click tab activation. Keyboard-driven tab activation (arrow keys, Home, End) changes the active tab and raises ActiveTabIdChanged , but never raises OnStateChanged .
This creates an inconsistency for anyone using the documented state-persistence pattern ( OnStateInit / OnStateChanged ) to save and restore the TabStrip's state: tabs selected via keyboard navigation render correctly, but are silently never persisted, since the app only listens to OnStateChanged . On the next reload/restore, the selection reverts to the last mouse-selected tab.
Root cause (from the TabStrip source):
• Click path — ActivateTab(TabStripTab tab) :
await SetActiveTabAsync(tab); // raises ActiveTabIdChanged
InvokeOnStateChanged(); // raises OnStateChanged
• Keyboard path — HandleActiveTabIdNavigationAsync(...) :
await SetActiveTabAsync(nextActiveTab); // raises ActiveTabIdChanged only — InvokeOnStateChanged() is never called
Steps to reproduce:
1. Add a TelerikTabStrip with OnStateChanged bound to a handler that logs/persists the received TabStripState .
2. Add 3+ TabStripTab s.
3. Click into the tab header area to focus it, then use the arrow keys (or Home/End) to move between tabs.
4. Observe: the active tab panel changes visually, but the OnStateChanged handler is never invoked.
5. Now click a tab header directly — OnStateChanged fires as expected.
Expected: OnStateChanged should fire for every active-tab change, regardless of whether it was triggered by mouse click or keyboard navigation, matching the documented behavior.
Actual: OnStateChanged only fires for mouse-click tab activation; keyboard navigation only raises ActiveTabIdChanged .
Workaround used: Also bind ActiveTabIdChanged and merge the received tab id into the previously-captured/persisted state object (rather than relying on OnStateChanged alone).
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; }
}
When the user presses ESC to exit edit mode from an EditorTemplate with a ComboBox / MultiColumnComboBox / MultiSelect, the cell value is cleared and this change persists in subsequent editing. The original data item value is cleared too, although this is not immediately obvious.
The issue occurs in version 14.1.0 and WebAssembly apps are more likely to suffer from it.
To optimize performance, I built a custom component that allows the user to choose which aggregates should be calculated. This component ensures that <GridAggregate> tags are inserted into <GridAggregates> via a foreach loop.
This works without any issues, at least when the selection is made for the first time.
However, if a selection is made in which the column of a new aggregate appears before an already selected aggregate, errors occur in the grid. AggregateResults now contains duplicates of an existing aggregate, and the new aggregates are missing.
Test project available in ticket 1718830.
Even if setting ReadOnly="true", tables in the Editor can be resized...
This only happens in Iframe mode!
<TelerikEditor Height="300px" @bind-Value="@Value" EditMode="Telerik.Blazor.EditorEditMode.Iframe" ReadOnly="true">
</TelerikEditor>
@code {
public string Value { get; set; } =
@"
<table>
<tbody>
<tr>
<td>
Some text
</td>
</tr>
<tr style=""height: 24px"">
</tr>
<tr>
<td>
Some text
</td>
</tr>
</tbody>
</table>
";
}