Hi

I'm using the TelerikMenu component with multiple nested levels of menu items. When moving the cursor from inside a nested level, to a parent level that is not in the currently selected path, the menu disappears. 

View this example on REPL: https://blazorrepl.telerik.com/mIvFOglY481u2hRG05

When moving the cursor from "Item A1 - 1" to "Item A2", the menu disappears.

Because I have a large menu with multiple levels, it would improve user experience to keep the menu visible as long as the cursor hovers it. Is there any way to make this happen?

Best regards

Bram

How can I get the start and end dates that are displayed in the current view?  I understand that there is a date changed event, but that doesn't give me the entire date range of what is currently being displayed.  I'd like to use that date range to then re-query the database and only pull back the events for that specific range.  I currently can't find a way to get that information.

I'm trying to read from an existing Excel file that the user will upload via FileSelect.   When it gets to the last line trying to set the workbook variable:

workbook = formatProvider.Import(selectedFile.Stream, TimeSpan.FromSeconds(30));

...I get the error, "'System.NotImplementedException' in Telerik.Zip.dll: 'Synchronous actions on the file stream is not supported by the Blazor framework in Blazor Server-side apps due to the SignalR communication between the client and the host. Use the 'ReadAsync' method instead.'"

If I try to copy the stream first like this:

await selectedFile.Stream.CopyToAsync(ms);

It never gets past that line and there is no error.

Here is my stripped code:

@page "/uploadtest"
@using Microsoft.EntityFrameworkCore
@using IGPOSCore.Models
@using Microsoft.IdentityModel.Tokens
@using Telerik.Blazor.Components
@using Telerik.Blazor.Components.FileSelect
@using System.ComponentModel
@using Telerik.Windows.Documents.Spreadsheet.FormatProviders
@using Telerik.Windows.Documents.Spreadsheet.FormatProviders.OpenXml.Xlsx
@using Telerik.Windows.Documents.Spreadsheet.Model

<TelerikFileSelect @ref="fileSelect" OnSelect="@OnFileSelected" Multiple=false />
    <TelerikButton OnClick="@(() => LoadExcelFile())" >
        Upload
    </TelerikButton>

@code {
    private TelerikFileSelect? fileSelect { get; set; }
    private FileSelectFileInfo? selectedFile { get; set; }
    private Workbook? workbook { get; set; }

    private async Task OnFileSelected(FileSelectEventArgs args)
    {
        if (args.Files != null && args.Files.Any())
        {
            selectedFile = args.Files.First();
        }
    }

    public async Task LoadExcelFile()
    {
        Guid submissionId = Guid.NewGuid();

        if (selectedFile != null)
        {
            Console.WriteLine($"Processing file: {selectedFile.Name} - {selectedFile.Size} bytes");

            IWorkbookFormatProvider formatProvider = new XlsxFormatProvider();
            @* var ms = new MemoryStream();
            await selectedFile.Stream.CopyToAsync(ms);
            workbook = formatProvider.Import(ms, TimeSpan.FromSeconds(30)); *@
            workbook = formatProvider.Import(selectedFile.Stream, TimeSpan.FromSeconds(30));
            
        }
    }
}

When using the Data Grid with row virtualization we set a pagesize large enough so with normal usage you almost never see the rows loading when scrolling downwards. However when scrolling upwards rows always need to be loaded. The pagesize only affects the items loaded downwards.

From a user experience this is counterintuitive because the rows are visible when first opening the grid, but after scrolling down and back up the rows now need to be loaded again.

Is there a way to have items preloaded in both directions so we always get a smooth user experience?

Any ideas on how to make the width of the column on the timeline smaller?   

I can make the text smaller by updating this css.

 .k-gantt .k-table-td

However, I cannot figure out the right combination to adjust for column widths on the time line side.

On my page I have:

<TelerikCheckBox Id="chkBxIncludeChildren"
                 @bind-Value="@chkBxIncludeChildren_isSelected"
                 Title="Check me off to include this in the data!"                                                
                 Class="tooltip-target"
                 OnChange="@chkBxIncludeChildren_OnClick" />

and I put the following at the bottom of the page:

.k-checkbox {
    /* Make the border a little darker than the default */
    border-color: rgba(0, 0, 0, 0.4) !important;
}

The checkboxes box appears just as i want it.

But I now want that for my whole project. This is were I am having an issue my entry in the app.css seems to be ignored and I am not sure why.

App.css:

<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />

    <base href="@MyNavigationManager.BaseUri" />

    <link rel="stylesheet" href="bootstrap/bootstrap.min.css" />

    <link rel="stylesheet" href="MarginAnalysis.styles.css" />
    <link rel="icon" type="image/png" href="favicon.png" />
    <HeadOutlet @rendermode="InteractiveServer" />

    @* Telerik Stuff *@
    <script src="_content/Telerik.UI.for.Blazor/js/telerik-blazor.js"></script>
    <link rel="stylesheet" href="_content/Telerik.UI.for.Blazor/css/kendo-theme-default/all.css" />
    @* Needed for the Telerik 5.0.0 icons! *@
    <link href="https://blazor.cdn.telerik.com/blazor/5.0.0/kendo-font-icons/font-icons.css" rel="stylesheet" type="text/css" />


    <link rel="stylesheet" href="app.css" />
</head>

I put the App.ccs at the end. As far as I understand it that should make it work above teleriks theme css.

What am I missing?

Thanks

Deasun.

We were using the TelerikTreeList with

SelectionMode="TreeListSelectionMode.Single"
SelectedItems="@SelectedItems"

with a ContextMenu. On Rightclick we wanted to open the ContextMenu but also set the row as Selected.

If a row is selected and we rightclick on another one both will be selected. We don;t know exactly why and did not expect two rows to ever be selected after setting the SelectionMode to single.

this is the code we use for selecting on right click.

private async Task OnContextMenu(TreeListRowClickEventArgs args)
{
    SelectedItems = [(TItem)args.Item];
    await InvokeAsync(StateHasChanged);

Do you have any idea how to fix it?

Grid EditMode = InCell.

Grid SelectionMode="GridSelectionMode.Single"

SelectedItems="mySelectedItems"

I have a command button in one of my Grid columns.

I have OnRowClick handler for the Grid.

I have GridCommandColum with GridCommandButton and a OnClick command handler.

The grid populates with data, no row currently selected.  User clicks on the GridCommandButton and that event gets fired BEFORE the OnRowClick event.  Logically this is not correct as the button is contained within the parent which is the Grid, so the OnRowClick should fire first before the OnClick for command button ... I have no way to work around this issue?

UPDATE: correction, the OnRowClick event doesn't fire at all if I click on a GridCommandButton.