Using blazor server with latest Telerik Blazor package (currently 4.1.0).

I created a very simple CustomDropDownList.razor file with the following:

@typeparam TItem
@typeparam TValue
@inherits TelerikDropDownList<TItem, TValue>

and attempted to use the new component in a page:

@page "/test"

<CustomDropDownList Data="testData" @bind-Value="value" />

@code {
    int? value = null;

    private List<Model> testData = new List<Model>()
    {
        new Model() { Id = 1, Text = "Item 1" },
        new Model() { Id = 2, Text = "Item 2" }
    };

    class Model
    {
        public int? Id { get; set; }
        public string Text { get; set; }
    }
}

I get the javascript error:

Cannot read properties of null (reading addEventListener)

I'm aware you have a page regarding this error, but it only suggests making sure telerik-blazor.js file is up to date. Mine is.

Now, if I define the same component in a .cs file instead of a .razor file, the scenario works fine:

public class CustomDropDownList<TItem, TValue> : TelerikDropDownList<TItem, TValue>
{
}

REPL with error (using .razor file): https://blazorrepl.telerik.com/GRaoFuvr00aqKiQq27
REPL that works (using .cs file): https://blazorrepl.telerik.com/wHkyFubg58jPmb8D40

So what is going on here?

Ultimately, I'm trying to inherit from TelerikDropDownList to encapsulate a reusable custom dropdown. I have done this with .cs files a number of times with no problem, but in this case I was wanting to define an ItemTemplate and it's much more practical to do .razor file - that's when I discovered this issue.

The background of the predefined dialog box appears transparent.

Hi,

Like Subject above, when I Debug code, my scrollbar change to default browser scrollbar (Image Scrollbar1.jpg)

When i press F12 to go to Developer mode, it changes to normal - Telerik scrollbars. Its shadow and it is hard to look little bit (Image Scrollbar2.jpg).

I dont know why its happen.  And it happended a couple days ago.

Browsers that I used to check: Edge, Firefox and Chrome and had same issue.

Thank you for your help.

I have a grid using paging and sorting features. When a user edit a record (I am using an edit form that show an edit form) and he changed the value from the sorted column, the item is no more visible in the current page since it moved in another page according to the sorting feature.

My question how can I find in which page my item is now on, and to programmatically select that page so my item will stay in the current view after edition.

Thanks

I'm currently working on a multiview calendar. However, I've come across an issue that confuses the user quite a bit. If I allow a selection that goes beyond the boundaries of a single month, then the overflow from the next or previous month is also selected and displayed. This results in the question:

"Is it possible to disable the display of overflow from the next or previous month?" In the template, I don't have any information in the context about which month the multiview is displaying, otherwise it would be easy to deactivate the context.

The question is, can the calendar be configured to simply not display overflow from other months?



For Display this is not a Problem, I override .k-other-month, so the overhang is not visible. But how to solve this in a Multiview Selection?