Completed
Last Updated: 20 Mar 2023 15:26 by ADMIN
Release 4.2.0 (26/04/2023)
Created by: n/a
Comments: 0
Category: Scheduler
Type: Bug Report
1
By design, the appointments should be resized and repositioned upon browser resize. As of UI for Blazor 3.7., the appointments are not properly scaled upon browser resize.
Unplanned
Last Updated: 20 Mar 2023 14:40 by Robert
Created by: Robert
Comments: 0
Category: Grid
Type: Bug Report
1

Triggering Edit in a Grid bound to a DataTable and with edit mode set to Popup throws an unhandled exception. This started to occur in 4.1.0 - the same code runs fine on 4.0.1

To reproduce:

  1. run https://blazorrepl.telerik.com/cduHQkPS34V0enTc50 (note this is the DataTable demo, but with changed edit mode)
  2. trigger edit mode
  3. observe the unhandled exception
Unplanned
Last Updated: 20 Mar 2023 13:52 by Matthias
Unplanned
Last Updated: 20 Mar 2023 10:54 by Michael

Imagine a Grid with two editable columns, which are separated by a few non-editable ones. In the standard use case, tabbing from the first editable column should jump over the non-editable columns, and the user should end up in the second editable column.

However, if the Grid uses virtual columns and the second editable column is not rendered, tab-to-edit will stop working.

Completed
Last Updated: 20 Mar 2023 10:17 by ADMIN
Created by: Roman
Comments: 2
Category: UI for Blazor
Type: Bug Report
1

OnRowRender in version 4 style is applied through one line.

 

@* Conditional styling/formatting for rows (including locked/frozen columns). *@

<style>
    /*the following selectors target the locked/frozen columns*/
    /*===*/
    .k-grid .k-master-row.myCustomRowFormatting .k-grid-content-sticky,
    .k-grid .k-master-row.myCustomRowFormatting.k-alt .k-grid-content-sticky
    /*===*/
    {
        background-color: inherit;
    }

    .k-grid tr.myCustomRowFormatting:hover {
        background-color: red !important;
    }

    .k-grid tr.myCustomRowFormatting {
        background-color: #90EE90;
    }
</style>

<TelerikGrid Data="@MyData"
             Height="446px"
             Pageable="true"
             Width="450px"
             OnRowRender="@OnRowRenderHandler">
    <GridColumns>
        <GridColumn Field="@(nameof(SampleData.Id))" Width="120px" Locked="true" />
        <GridColumn Field="@(nameof(SampleData.Name))" Width="200px" Title="Employee Name" />
        <GridColumn Field="@(nameof(SampleData.Team))" Width="200px" Title="Team" />
    </GridColumns>
</TelerikGrid>

@code {
    void OnRowRenderHandler(GridRowRenderEventArgs args)
    {
        var item = args.Item as SampleData;

        //conditional applying Class
        if (true)
        {
            args.Class = "myCustomRowFormatting";
        }
    }

    public IEnumerable<SampleData> MyData = Enumerable.Range(1, 30).Select(x => new SampleData
    {
        Id = x,
        Name = "name " + x,
        Team = "team " + x % 5
    });

    public class SampleData
    {
        public int Id { get; set; }
        public string Name { get; set; }
        public string Team { get; set; }
    }
}
Pending Review
Last Updated: 17 Mar 2023 16:58 by James

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>

Planned
Last Updated: 17 Mar 2023 13:22 by ADMIN
In a Grid with multiple columns and InCell editing, rapid tab (quick tab key presses) eventually "jumps" the focus out of the Grid, leaves behind a cell open for editing and instead focuses another UI element on the page.
Unplanned
Last Updated: 16 Mar 2023 18:26 by Daniel
When creating an appointment, the Start and End editors should display the date (and time) of the slot the user clicked on.
Completed
Last Updated: 16 Mar 2023 14:50 by ADMIN

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?

Duplicated
Last Updated: 15 Mar 2023 21:13 by ADMIN

After the update

we're having this issue when trying to build our project.

The needed nuget package it's already added and even adding the Telerik.DataSource as a package that's not needed in theory we're not able to build.

Error CS0012 The type 'CompositeFilterDescriptor' is defined in an assembly that is not referenced. You must add a reference to assembly 'Telerik.DataSource, Version=2.1.3.0, Culture=neutral, PublicKeyToken=29ac1a93ec063d92'.

 

 


Completed
Last Updated: 15 Mar 2023 08:31 by ADMIN
Release 4.1.0 (15/03/2023)

Here is a TelerikForm with a FormItem (1) for a boolean field. Another FormItem (2) should render, depending on the boolean field (1). This does not work with a TelerikForm, but works with a standard EditForm.

The workaround for a TelerikForm is to use a FormItem Template with a TelerikCheckBox. This is demonstrated below as well.

<EditForm Model="@_data">
    <label>Condition 1 (InputCheckbox):</label>
    <InputCheckbox @bind-Value="@_data.Value1" />
    <br />
    @if (_data.Value1)
    {
        <label>Result 2</label>
        <InputCheckbox DisplayName="Result 2:" @bind-Value="@_data.Value2"></InputCheckbox>
    }
</EditForm>

<h1>TelerikForm</h1>

<TelerikForm Model="@_data">
    <FormItems>
        <FormItem LabelText="Condition 1 (FormItem):" Field="@nameof(_data.Value1)"></FormItem>
        <FormItem>
            <Template>
                <label for="x">Condition 1 (TelerikCheckBox):</label>
                <br />
                <TelerikCheckBox Id="x" @bind-Value="_data.Value1" />
            </Template>
        </FormItem>
        @if (_data.Value1)
        {
            <FormItem LabelText="Result 2:" Field="@nameof(_data.Value2)"></FormItem>
        }
    </FormItems>
</TelerikForm>

@code {
    private ExampleDto _data { get; set; } = new ExampleDto();

    public class ExampleDto
    {
        public string TextValue { get; set; }
        public bool Value1 { get; set; }
        public bool Value2 { get; set; }
    }
}

Duplicated
Last Updated: 14 Mar 2023 18:01 by ADMIN

Title: WCAG 4.1.2: Ensures elements with ARIA roles have all required ARIA attributes (.k-splitbar)
Tags: Accessibility, WCAG 4.1.2, aria-required-attr

Issue: Ensures elements with ARIA roles have all required ARIA attributes (aria-required-attr - https://accessibilityinsights.io/info-examples/web/aria-required-attr)

Target application: xxx

Element path: .k-splitbar

Snippet: <div tabindex="0" role="separator" class="k-splitbar k-splitbar-vertical k-splitbar-draggable-vertical">

How to fix: 
Fix any of the following:
  Required ARIA attribute not present: aria-valuenow

Environment: Microsoft Edge version 111.0.1661.41

====

This accessibility issue was found using Accessibility Insights for Web 2.37.3 (axe-core 4.6.3), a tool that helps find and fix accessibility issues. Get more information & download this tool at http://aka.ms/AccessibilityInsights.

 

=================== code ===============================

    <TelerikTabStrip TabPosition="Telerik.Blazor.TabPosition.Top" @ref="@TabStrip" Height="100%">
        @{
            foreach (var console in ViewModel.AvailableConsoles)
            {
                <TabStripTab Title="@console.Title" Disabled="@console.Disabled">
                    <div style="height:100%">
                        @RenderContent(console)
                    </div>
                 </TabStripTab>
            }
        }
    </TelerikTabStrip>
Pending Review
Last Updated: 14 Mar 2023 17:34 by Leon

Title: WCAG 1.3.1: Ensures elements with an ARIA role that require child roles contain them (#\39 374a450-079d-4586-b823-d6bc7723505f)
Tags: Accessibility, WCAG 1.3.1, aria-required-children

Issue: Ensures elements with an ARIA role that require child roles contain them (aria-required-children - https://accessibilityinsights.io/info-examples/web/aria-required-children)

Target application: Hermes Home - https://localhost/TrafficLoss

Element path: #\39 374a450-079d-4586-b823-d6bc7723505f

Snippet: <div class="k-grid-aria-root" id="9374a450-079d-4586-b823-d6bc7723505f" role="grid" aria-label="Data table">

How to fix: 
Fix any of the following:
  Element has children which are not allowed (see related nodes)
  Element has no aria-busy="true" attribute

Environment: Microsoft Edge version 111.0.1661.41

====

This accessibility issue was found using Accessibility Insights for Web 2.37.3 (axe-core 4.6.3), a tool that helps find and fix accessibility issues. Get more information & download this tool at http://aka.ms/AccessibilityInsights.

 

============================  code =============================

                           <TelerikGrid Data="@ViewModel.RDLInformation" TItem="TLSummary"
                                                        Pageable="true" 
                                                        Sortable="true" 
                                                        Groupable="false"
                                                        FilterMode="Telerik.Blazor.GridFilterMode.FilterRow"
                                                        Resizable="true" 
                                                        Reorderable="true"
                                                        Height = "100%">

....

                            </TelerikGrid>

Completed
Last Updated: 14 Mar 2023 12:09 by ADMIN

Hello,

I seem to have stubled upon a strange bug in TelerikGrid. We have wrapped a TelerikGrid and the Columns are also wrapped to allow special actions.
The bug is present in "raw-telerik-code" as well.

We have an edge case where we have a TelerikGrid and some of its columns should be Locked (Stickied/Frozen) as a default behaviour.
But depending on user interaction we want to change the state. We cannot use a property for each column that we want to be Locked/Unlocked as it should be handled by the GridState.

When the Column is using default behaviour (not Templated), it works as intended. But as soon as you use a <Template> for the Column, the Locked state cannot be changed from the default/supplied value.

TLDR: Programmatically changing the Locked state of a column where the cell is templated will not change the locked state.

I have prepared two REPL examples. One for 3.7.0 as it is what we currently are using, and one for 4.0.1 as to prove that it still exists in the current itteration.

3.7.0
https://blazorrepl.telerik.com/cHEHurlI06olUsJ410


4.0.1
https://blazorrepl.telerik.com/cdYRuBvo07aB6BGY39

 

With best regards

Planned
Last Updated: 14 Mar 2023 08:31 by ADMIN
Scheduled for 4.2.0 (26/04/2023)
Created by: Oscar
Comments: 0
Category: MultiSelect
Type: Bug Report
4
I would like to avoid that the component cleans the filter user input when an item is clicked and auto-close is set to false.

So, imagine I want to select every item which contains letter 'S'. I type 'S' then when I click on the first item containing 'S', the 'S' in the input is removed and all the items are shown. So I need to type S again and again 1 time for each Item I want to select.

I attach a gif showing the behavior.
Planned
Last Updated: 14 Mar 2023 07:18 by ADMIN
Scheduled for 4.2.0 (26/04/2023)

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>

 

 

In Development
Last Updated: 14 Mar 2023 05:21 by ADMIN
Scheduled for 4.2.0 (26/04/2023)

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.

Planned
Last Updated: 13 Mar 2023 17:13 by ADMIN
Scheduled for 4.2.0 (26/04/2023)

If the application expands TreeView items programmatically, and then the user tries to select multiple items, an exception will occur.

The issue is a regression that occurred in version 3.0.0. A possible workaround is to Rebind() the TreeView with a small delay after programmatic item expansion.

<TelerikTreeView @ref="@TreeViewRef"
                 Data="@FlatData"
                 @bind-ExpandedItems="@ExpandedItems"
                 SelectionMode="@TreeViewSelectionMode.Multiple"
                 SelectedItems="@SelectedItems"
                 SelectedItemsChanged="@((IEnumerable<object> items) => SelectedItemsHandler(items))" />

<TelerikButton OnClick="@ExpandAll">Expand All</TelerikButton>
<TelerikButton OnClick="@CollapseAll">Collapse All</TelerikButton>

@code {
    public TelerikTreeView TreeViewRef { get; set; }
    public IEnumerable<TreeItem> FlatData { get; set; }
    public IEnumerable<object> SelectedItems { get; set; } = new List<object>();
    public IEnumerable<object> ExpandedItems { get; set; } = new List<object>();

    async Task ExpandAll()
    {
        ExpandedItems = FlatData.Where(x => x.HasChildren == true);

        await Task.Delay(1);
        TreeViewRef.Rebind();
    }

    void CollapseAll()
    {
        ExpandedItems = new List<object>();
        SelectedItems = new List<object>();
    }

    void SelectedItemsHandler(IEnumerable<object> items)
    {
        SelectedItems = items;
    }
    protected override async void OnInitialized()
    {
        FlatData = LoadFlat();
    }

    int TreeLevels { get; set; } = 3;
    int ItemsPerLevel { get; set; } = 3;
    int IdCounter { get; set; } = 1;
    List<TreeItem> LoadFlat()
    {
        List<TreeItem> items = new List<TreeItem>();
        PopulateTreeItems(items, null, 1);
        return items;
    }
    void PopulateTreeItems(List<TreeItem> items, int? parentId, int level)
    {
        for (int i = 1; i <= ItemsPerLevel; i++)
        {
            var itemId = IdCounter++;
            items.Add(new TreeItem()
            {
                Id = itemId,
                Text = $"Level {level} Item {i} Id {itemId}",
                ParentId = parentId,
                HasChildren = level < TreeLevels
            });
            if (level < TreeLevels)
            {
                PopulateTreeItems(items, itemId, level + 1);
            }
        }
    }

    public class TreeItem
    {
        public int Id { get; set; }
        public string Text { get; set; }
        public int? ParentId { get; set; }
        public bool HasChildren { get; set; }
    }
}


Planned
Last Updated: 13 Mar 2023 14:13 by ADMIN
Scheduled for 4.2.0 (26/04/2023)

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;
}

Planned
Last Updated: 13 Mar 2023 13:57 by ADMIN
Scheduled for 4.2.0 (26/04/2023)
If the treeview is in a component within the `@Body` and so gets disposed on navigation, there are errors in a WebAssembly app.
1 2 3 4 5 6