I have a grid with horizontal scroll, row filter, and invisible no data template (done via css class) as requirement.

Note: if i use NoDataTemplate element as follow, it create an empty row

<NoDataTemplate>
        <div></div>
    </NoDataTemplate>

but i need no rows if the result is empty, so i managed via css with:

.hide-no-data-template .k-grid-norecords {
    display: none;
}
<TelerikGrid ... Class="hide-no-data-template"></TelerikGrid>

If i filter a column with the scrollbar shifted and the result produce at least one row, i show correcly the result

Now, if i change the filter obtaining no row result the grid is correcly empty and horizontal scrollbar disappear

Now, if i restore the previous filter, obtaining at least one row, the result is correct, but horizontal scrollbar is positioned at start position, and column data does not match column filters

you can reply the issue with this code: https://blazorrepl.telerik.com/mHYKGhPy15rgDbLM16

Related issues:

https://www.telerik.com/forums/grid-filter-value-resulting-in-no-rows-removes-horizontal-scroll-bar

https://feedback.telerik.com/blazor/1451961-grid-horizontal-scroll-is-disabled-when-no-data-items-are-rendered?_ga=2.196089516.1410422363.1687873194-1919299615.1685452956&_gl=1*1f4kvho*_ga*MTkxOTI5OTYxNS4xNjg1NDUyOTU2*_ga_9JSNBCSF54*MTY4Nzg3MzE5NC4xNC4xLjE2ODc4NzU0MjkuNC4wLjA.

Hi,

I want to not close contextmenu when I click item(OnClick event).

I also want the hierarchical window to keep open.

Is there any solution?

Thanks.

Hi, 

I need to change the standard text of "Drag a column header and drop it here to group by that column". How can I change the Title of this?
Thanks in advance!

Best Regards

Paul

Hi, one of my clients' automation team demands that each actionable element has it's own custom ID which they provide to us.

So on our custom components (or any HTML element) we just add, eg:

<div automation-id="some-important-div">...</div>

However, when we consume Telerik Blazor UI components we're struggling to fullfill this requirement.

Is there any way to add an arbitrary HTML attribute to inner components like this without having to re-implement each composable piece with our own template?

We're fine with the look and feel of components, so it feels like an overkill to have to re-do everything (for example, the calendar's header with clickable date, arrows and "today" elements, and then the date cells for each view) just to add this ID without changing the styles or structure.

The Resizable attribute o TelerikGrid is very useful, but it would be better if the last column's width could stretch to fit its container, whenever we resize other columns that make the former move from its previous position, like shown in the picture.

Is there a way to that automatic resize of the last column?

I want to create a table with TelerikGrid whose border corners are rounded (border-radius: 8px). However, I noticed that the corners are under the table's sharp corners as exemplified in the files below. My TelerikGrid is as follows:

<span>
<TelerikGrid Data=@GridData>
    <GridColumns>
        <GridColumn Width="5%" />
        <GridColumn Field="@nameof(...)"/>
        <GridColumn Field="@nameof(...)" />
        <GridColumn Field="@nameof(...)" />
        <GridColumn Field="@nameof(...)" />
        <GridColumn Field="@nameof(...)" />
    </GridColumns>
</TelerikGrid>
</span>

and its css rules in the corresponding razor.css (wrapped the telerik component within a span tag so as to use the ::deep selector):

::deep .k-grid{
    width: 100%;
    height: 100%;
    border: 1px solid #6495Ed4D;
    border-radius: 8px;
    opacity: 1;
}

I have a grid with a headertemplate who raise a contextmenu to popup and allow to select a date.

See for example: https://blazorrepl.telerik.com/QxkKbZPH059REjJ030

Now, if i open the datepicker and click on the arrows (for select previous or next month) the context menu automatically close.

Select a day or change the month or year in the datepicker does not cause this issue.

I would like to allow user to click on previous/next month arrow without the contextmenu closed.

Any suggestion?

Thanks

I feel like I'm missing something really simple here.  I want to display an icon with a menu item.  I'm following this example https://docs.telerik.com/blazor-ui/components/menu/icons and want to add the FontIcon.Menu. In the code below, I added the icon to the top level menu item. 

@layout TelerikLayout
@inherits LayoutComponentBase
@using Telerik.FontIcons;

<PageTitle>HR Taxonomy Change Management</PageTitle>

<div class="container">
    <div class="border">
        <div class="title">
            Taxonomy Change Management
        </div>
        <div class="login">
            <LoginDisplay />
        </div>
        <div style="height: 80px;">
            <TelerikMenu IconField="@(nameof(MenuItem.Icon))" Data="MenuItems" Orientation=@MenuOrientation.Horizontal></TelerikMenu>
        </div>
    </div>
    <div>
        <article class="content px-4">
            @Body
        </article>
    </div>
</div>

@code{
    public List<MenuItem> MenuItems { get; set; } = new List<MenuItem>();

    public class MenuItem
    {
        public string Text { get; set; }
        public bool Disabled { get; set; }
        public object Icon { get; set; }
        public IEnumerable<MenuItem> Items { get; set; }
    }

    protected override void OnInitialized()
    {
        MenuItems = new List<MenuItem>()
        {
            new MenuItem()
            {
                Text="None",
                Icon="@FontIcon.Menu",
                Items = new List<MenuItem>()
                {
                    new MenuItem {Text = "Home" },
                    new MenuItem {Text = "New Request"},
                    new MenuItem {Text = "Admin"}
                }
            }
        };

        base.OnInitialized();
    }
}

<style>
    #demo-runner {
    height: 400px;
    }
</style>