I have a page with a Gantt chart and a Button. The button navigates to another page in the app (NavigationManager.NavigateTo()). When I click the button an exception is thrown:
Exception trace: Error: Microsoft.JSInterop.JSException: An exception occurred executing JS interop: The JSON value could not be converted to System.Double. Path: $ | LineNumber: 0 | BytePositionInLine: 4.. See InnerException for more details. ---> System.Text.Json.JsonException: The JSON value could not be converted to System.Double. Path: $ | LineNumber: 0 | BytePositionInLine: 4.
---> System.InvalidOperationException: Cannot get the value of a token type 'Null' as a number.
When I updated to the latest version I noticed that the FormItems in AuthorizedViews were moved to the bottom of the form, Quick example:
<TelerikForm>
<FormItems>
<AuthorizeView>
<Authorized>
<FormItem Field="First"/>
</Authorized>
</AuthorizeView>
<FormItem Field="Second"/>
</FormItems>
</TelerikForm>
will end up like
<TelerikForm>
<FormItems>
<FormItem Field="Second"/>
<FormItem Field="First"/>
</FormItems>
</TelerikForm>
The problem is reproducible in your demo section: https://demos.telerik.com/blazor-ui/colorpicker/overview
I attached two short video clips showing the problem and the screenshots below.
Image 1: Open the Color Picker by clicking on it with the mouse. The picker dialog opens.
Image 2: Click with the mouse in the green area. You see a minor change in the RGBA fields, but no change in the color canvas.
Image 3: By clicking in the G field e.g. and changing the number with the down key from 46 to 45, the slider moves back to the blue area of it.
It seems to happen only with the first click onto the slider. With the second click and more it works like it should.
Best regards,
Hannes
Hi,
I noticed that using left or right arrow to position yourself between typed text does not work anymore in the GridSearchBox. Neither does SHIFT+left for selecting parts of typed text. Home or End key is also not working.
In previous versions this was still possible.
Can be estabished on the demo pages as well:
https://demos.telerik.com/blazor-ui/grid/searchbox
Thanks,
Tom
https://blazorrepl.telerik.com/cdkTuxEg30UJXWug36
When trying to expand the drop downs, some of them do not expand.
It is impossible to give a scenario that always behaves the same, but if
you keep expending the drop downs sooner or later some will stop working.
Checking a checkbox of a on demand-loaded child then collapsing and reopening its parent makes the checkbox disappear. However, it is still checked in the CheckedItems collection, but just not in the UI. See this REPL example. Steps...
1. Expand a top level item
2. Check its child checkbox
3. Collapse the top level item
4. Expand it again
Result: checkbox gone (in the UI)
When the Week view of the Scheduler is selected the label of the DatePicker is incorrect. The displayed range in the label covers an extra day. e.g. in the Week view the range spans 7 days (the label show range of 8 days)
The problem can also be observed when the MultiDay view is selected - the displayed range includes one additional day.
Hi
When you focus on the DatePicker input element the cursor is at the end of the input instead of the start.
Here is an example
https://blazorrepl.telerik.com/ccOtaTOZ59tdXv1J10
Any help would be appreciated
Regards
Stewart
Sorry to bother you, but we found a problem when using the FileManager control. When you are in a directory hierarchy Home > Dir1 > DirA > DirX > DirY and you want to navigate to the parent directory say DirX using the breadcrumb, clicking on DirX, FileManager sends you to the root directory. I hope you can help me.
If there are a lot of child folders, the Breadcrumb navigation does not work correctly. The current directory does not respond to the selected one.
Hi,
Just a bug I have found. I have found something similar before with the DateTime format of a category axis.
Please note the single lowercase 't' in the below appears to be being interpreted by the compiler as 'time' identifier (AM or PM). In this case, it is printing on the chart label as 'a'.
<ChartValueAxes>
<ChartValueAxis AxisCrossingValue="@AxisCrossingValue">
<ChartValueAxisLabels Format="@("{0}" + " a b c d e f g h i j k l m n o p q r s t u v w x y z")"></ChartValueAxisLabels>
</ChartValueAxis>
</ChartValueAxes>
I have a requirement to be able to select multiple values. I have filtering enabled, but I only want the user to be able to select valid values and not enter custom data. My approach would be to clear any invalid data when the control loses focus. I want the MultiSelect input to be cleared when it looses focus (similar to the ComboBox behavior).
=========================
ADMIN EDIT
=========================
In the meantime, such behavior could be achieved with a JavaScript function called through the JS Interop.
@inject IJSRuntime JsInterop
<TelerikMultiSelect Filterable="true" Data="@Countries"
@bind-Value="@Values"
Placeholder="Enter Balkan country, e.g., Bulgaria"
Width="350px" ClearButton="true"
AutoClose="false" OnBlur="@OnBlurHandler">
</TelerikMultiSelect>
@if (Values.Count > 0)
{
<ul>
@foreach (var item in Values)
{
<li>@item</li>
}
</ul>
}
@code {
List<string> Countries { get; set; } = new List<string>();
List<string> Values { get; set; } = new List<string>();
async Task OnBlurHandler()
{
await JsInterop.InvokeVoidAsync("clearMultiselectInput");
}
protected override void OnInitialized()
{
Countries.Add("Albania");
Countries.Add("Bosnia & Herzegovina");
Countries.Add("Bulgaria");
Countries.Add("Croatia");
Countries.Add("Kosovo");
Countries.Add("North Macedonia");
Countries.Add("Montenegro");
Countries.Add("Serbia");
Countries.Add("Slovenia");
base.OnInitialized();
}
}
You can include the following script tag in your index page or place the function in a separate JavaScript file in your project. This function will clear all instances of the Multiselect inputs, so you don't have to specify separate selectors for each of them. If you only want to work with one instance, you can use another approach.
<script>
function clearMultiselectInput() {
var inputs = document.querySelectorAll(".k-multiselect .k-input-values input");
inputs.forEach(e => e.value = "")
}
</script>
Hello,
I have a TelerikTreeView with about 2000 items bound to an ObservableCollection (Data). I use SelectedItems, SelectedItemsChanged, SelectionMode multitple and @bind-ExpandedItems.
When my users manually expand the nodes of the treeview, everything is fine and the operation of the treeview works smoothly. Loading UI components based on user selection takes less than 50ms.
As soon as I set the "ExpandedItems" collection from code (according to your treeview demo), the whole treeview operation becomes painfully slow with waiting times of 2 to 4 SECONDS for selection and expansion. Already expanding from code takes several seconds.
As soon as I reset the ExpandedItems from code and collapse the complete tree, the treeview is usable again without delays.
<TelerikCheckBox @bind-Value="@ExportAllPages" />
Hi
Trying to update to the latest version but in output in GitHub Actions it shows:
The type 'DataSourceRequest' is defined in an assembly that is not referenced. You must add a reference to assembly 'Telerik.DataSource, Version=2.1.3.0
However in my csproj I am referencing <PackageReference Include="Telerik.DataSource" Version="2.1.3" />
Any ideas?
When selecting an item with the Enter key, the value is not displayed in the input field.
ReproductionThe item is selected, but its value is not displayed inside the input field.
===
The issue is also reproducible with the MultiColumnComboBox component.
Keyboard support is only working properly when the ChipList is bound to a List<ChipModel>. If you try one of your other demos of the chiplist the following will occur:
I would expect that the Left Arrow will navigate to the previous chip in the list. (As a side note, I would recommend having the the Down Arrow and Up Arrow mimic Right and Left since a screen reader user won't necessarily know that the chiplist is horizontal.)
An example of the problem can be found in this demo:
https://blazorrepl.telerik.com/wdEQFzbC495I2bCP51
Here is a sample where I converted the returned list to List<ChipModel> and bound to that:
https://blazorrepl.telerik.com/cRYwFJvM52yemqN404
In that example, the Left Arrow functions normally.
Here is a REPL test page. If the user navigates forwards and backwards via the Wizard buttons, the TreeView checkboxes persist their state. If the user navigates via the Stepper, the checkbox state is not retained.
The issue is triggered by the TabStrip.
A possible workaround is to prevent Stepper clicks with CSS:
.k-tabstrip .k-wizard .k-stepper .k-step {
pointer-events: none;
}
Hello,
If I disable a Menu item at runtime, it prohibits access to child items via the mouse, but still opens the child group of items if I use the keyboard navigation.
Here is a test page with a workaround included (which is to recreate the Menu).
<TelerikButton OnClick="@DisableItem">Disable Services item</TelerikButton>
<TelerikButton OnClick="@EnableItem">Enable Services item</TelerikButton>
@if (ShowMenu)
{
<TelerikMenu Data="@MenuItems" />
}
@code {
List<MenuItem> MenuItems { get; set; }
bool ShowMenu { get; set; } = true;
async Task DisableItem()
{
MenuItems.Find(x => x.Text == "Services").Disabled = true;
MenuItems = new List<MenuItem>(MenuItems);
// workaround start
ShowMenu = false;
await Task.Delay(1);
ShowMenu = true;
// workaround end
}
async Task EnableItem()
{
MenuItems.Find(x => x.Text == "Services").Disabled = false;
MenuItems = new List<MenuItem>(MenuItems);
}
protected override void OnInitialized()
{
MenuItems = new List<MenuItem>()
{
new MenuItem()
{
Text = "Company",
Items = new List<MenuItem>()
{
new MenuItem()
{
Text = "Overview"
},
new MenuItem()
{
Text = "Events"
}
}
},
new MenuItem()
{
Text = "Services",
Items = new List<MenuItem>()
{
new MenuItem()
{
Text = "Consulting"
},
new MenuItem()
{
Text = "Education"
}
}
}
};
base.OnInitialized();
}
public class MenuItem
{
public string Text { get; set; }
public bool Disabled { get; set; }
public List<MenuItem> Items { get; set; }
}
}