Completed
Last Updated: 21 Jan 2023 07:24 by ADMIN
Created by: Peter
Comments: 1
Category: UI for Blazor
Type: Bug Report
0

https://docs.telerik.com/blazor-ui/common-features/icons#fonticon-component

in the SvgIcon Component section, there is this sample code, needs to be updated.

<TelerikSvgIcon Icon="@SvgIcon.Calendar" />

<TelerikSvgIcon Icon="@SvgIcon.Audio"
                Size="@ThemeConstants.Icon.Size.Large"
                ThemeColor="@ThemeConstants.Icon.ThemeColor.Primary" />

Should be

ThemeConstants.SvgIcon or ThemeConstants.FontIcon
Peter
Completed
Last Updated: 15 Jan 2022 18:01 by ADMIN
Created by: Peter
Comments: 1
Category: UI for Blazor
Type: Bug Report
0

In https://docs.telerik.com/blazor-ui/components/grid/manual-operations?_ga=2.192647914.1753502014.1641929648-330381368.1614276734

in the code section of Get Information From the DataSourceRequest you are using a @function instead of an @code.  Still works, but so 2019.

The second issue, typo in https://github.com/telerik/blazor-ui/tree/master/grid/datasourcerequest-on-server readme, DataSourceRequet should be DataSourceRequest

Completed
Last Updated: 07 Apr 2020 17:46 by ADMIN

According to the doc (https://docs.telerik.com/blazor-ui/components/grid/columns/width), 

"When all column widths are explicitly set and the cumulative column width is greater than the available Grid width, a horizontal scrollbar appears and all set column widths are respected."

I have a grid with a width of 1500px and a cumulative column width of 1750 pixels:

    <TelerikGrid Data="@datos"
                 Class="ns-grid-fitxatges"
                 PageSize="10"
                 Pageable="true"
                 Sortable="true"
                 Width="1500px"
                 Height="60vh">
        <GridColumns>
            <GridColumn Field="@nameof(LlistaFitxatgesDto.CodiInternActivitat)" Title="Codi Intern" Width="150px" />
            <GridColumn Field="@nameof(LlistaFitxatgesDto.CodiExternActivitat)" Title="Codi Extern" Width="250px" />
            <GridColumn Field="@nameof(LlistaFitxatgesDto.Activitat)" Width="300px" />
            <GridColumn Field="@nameof(LlistaFitxatgesDto.HoraFitxatge)" Title="@Loc["Fitxatge"]" Width="150px">
                <Template>
                    @{
                        var hora = (context as LlistaFitxatgesDto).HoraFitxatge.DateTime;
                        <span>@hora.ToString("dd/MM/yyyy HH:mm:ss")</span>
                    }
                </Template>
            </GridColumn>
            <GridColumn Field="@nameof(LlistaFitxatgesDto.Sessio)" Title="@Loc["SessiĆ³"]" Width="180px" />
            <GridColumn Field="@nameof(LlistaFitxatgesDto.Sentit)" Title="@Loc["Sentit"]" Width="80px" />
            <GridColumn Field="@nameof(LlistaFitxatgesDto.TipusDocument)" Title="@Loc["DOC"]" Width="70px" />
            <GridColumn Field="@nameof(LlistaFitxatgesDto.DocParticipant)" Title="@Loc["Document"]" Width="90px" />
            <GridColumn Field="@nameof(LlistaFitxatgesDto.Nom)" Title="@Loc["Nom"]" Width="90px" />
            <GridColumn Field="@nameof(LlistaFitxatgesDto.Cognom1)" Title="@Loc["Cognom1"]" Width="90px" />
            <GridColumn Field="@nameof(LlistaFitxatgesDto.Cognom2)" Title="@Loc["Cognom2"]" Width="90px" />
            <GridColumn Field="@nameof(LlistaFitxatgesDto.Metode)" Title="@Loc["Metode"]" Width="80px" />
            <GridColumn Field="@nameof(LlistaFitxatgesDto.RutaXml)" Title="XML" Width="60px">
                <Template>
                    @{
                        var ruta = (context as LlistaFitxatgesDto).RutaXml;
                        <a href="@ruta">XML</a>
                    }
                </Template>
            </GridColumn>
            <GridColumn Field="@nameof(LlistaFitxatgesDto.Terminal)" Title="Terminal" Width="70px" />
        </GridColumns>
    </TelerikGrid>

The horizontal scroll bar appears all right, but the column widths are not respected. As shown in the image, the columns on the right are squeezed 

 

Any clues?

Thanks in advance

 

Completed
Last Updated: 27 Jan 2022 13:11 by ADMIN
Created by: James
Comments: 1
Category: UI for Blazor
Type: Feature Request
0

Is it possible to add to the carousel a thumbnail scrollable navigation below the "page/image"?  I'm thinking this would be a nice addition, which would allow independent scrolling from that of the current page and also be clickable in the same way that the dots are in order to jump to the selected page.

----------ADMIN EDIT----------

The knowledge base article is now live - "Carousel Thumbnail Scrollable Navigation".

Thanks,

James

Completed
Last Updated: 01 Jun 2023 13:07 by ADMIN
Created by: Jerome
Comments: 1
Category: UI for Blazor
Type: Feature Request
0
Since the animation containers just get appended inside <body>, instead of the page it was placed in, it becomes difficult to style a specific animation container.  The templates are nice, but in the case of DropDownList, I have no way to style the <ul> of the dropdown list.  It would be nice if we could assign the associated animation container a class or id.
Completed
Last Updated: 12 Mar 2022 19:44 by ADMIN
Created by: Rémy
Comments: 2
Category: UI for Blazor
Type: Feature Request
0
Hello, 
I'm using telerik UI for blazor and encoutering a problem. I'm displaying into line charts data (sometimes aggregated), I'd like to trigger an event when clicking on a specific point on the line, is that possible with ChartSeries ? I saw that onSeriesClicked works well for all other types of chart (Bar,Pie,etc.) But when displaying a Line chart nothing is triggered... 
Could anyone help me ? 
Completed
Last Updated: 09 Aug 2020 12:49 by ADMIN
Created by: Adam
Comments: 3
Category: UI for Blazor
Type: Feature Request
0

Overview

As a developer user, I need to add a Markdown Editor control to my Blazor UI application so that I can capture and display markdown-compliant text input.

Acceptance criteria

  • The editor control supports rich WYSIWYG editing with support for standard markdown styling including: headers, emphasis, lists, images, links, blockquotes and inline code.
  • The editor control supports raw markdown editing mode, as well as WYSIWYG (preview) mode.
  • The editor control supports raw markdown output and HTML output.

Bonus criteria

  • A paired Markdown Display control supports presentation of markdown as HTML (so that developers can store markdown in a database, for example, and convert to HTML on the client for display.
Completed
Last Updated: 21 Dec 2021 17:38 by ADMIN
Created by: Daniel
Comments: 4
Category: UI for Blazor
Type: Feature Request
0
It would be great if we can have bindable readonly time slots, Where are optionally no appointments are possible. 
This is useful for breaks (no appointments at lunch time) or holidays.
Completed
Last Updated: 17 Nov 2023 10:14 by ADMIN
Created by: Peter
Comments: 1
Category: UI for Blazor
Type: Bug Report
0

https://docs.telerik.com/blazor-ui/common-features/icons#icon-nuget-packages

When you click "Preview" under Using TelerikFontIcon, the preview is blank, even if I scroll to the top, still nothing.

 

Completed
Last Updated: 24 Oct 2021 19:53 by ADMIN

 

The demos and examples for storing and retrieving GRID state uses the JavaScript localStorage.setItem and localStorage.getItem that work great.  As part of .NET 5 there's a Microsoft equivalent for accessing Local Storage using Microsoft.AspNetCore.Components.Server.ProtectedBrowserStorage.  I've found the behavior of these demos and examples will not work by simply replacing the JavaScript with .NET equivalents.  My experience is getting Circuit Handler exceptions that make these example not work.  

Although not a requirement since there's a JavaScript solution for local storage, I would like to recommend that since you partner closely with .NET team at Microsoft.  That your GRID development team test and provide examples with the Microsoft .NET 5 out-of-the-box local storage solution and resolve any incompatibilities for developers not wanting to use 1st party local storage solutions embedded within Microsoft Blazor.

 

----
ADMIN EDIT

I made a sample test and things seemed to work for me, so I made a public example, you can find it in this pull request until it gets merged. I'm also attaching it to this post, but for anyone seeing this after a time - the public repository linked above is a better place to look for this in case more updates and information have been added since the time of writing this.

---

Completed
Last Updated: 31 May 2023 08:56 by ADMIN
Created by: Peter
Comments: 2
Category: UI for Blazor
Type: Feature Request
0

Can you update the templates that come with Telerik Blazor?

For example, you are using an EditForm control instead of the telerik Blazor Form control.

There is an expression, eat your own dog food.  I often spin up template projects to play with new features or tweak existing ones.  Be nice take full advantage of current state of blazor components and provide samples that people can use as a learning tool or launching point. 

Peter

Completed
Last Updated: 30 Mar 2021 11:57 by Philip
Created by: Philip
Comments: 2
Category: UI for Blazor
Type: Feature Request
0

Hello

 

I noticed the DateRangePicker "OnChange" fires "on blur".

Confirmed by the docs;

https://docs.telerik.com/blazor-ui/components/daterangepicker/events#onchange

 

Is it possible to expose OnInput even for a "react style" onchange event?

https://linguinecode.com/post/onblur-vs-onchange-react-text-inputs

 

I think the StartValueChanged and EndValueChanged events have the same behaviour so unbinding might not be a solution..?

 

Attached is a use case where it is confusing because the events are not in sync... You'll see the grid data changes (data bound), but OnChange after you click out.

Completed
Last Updated: 10 Oct 2023 13:07 by ADMIN
Created by: Peter
Comments: 1
Category: UI for Blazor
Type: Bug Report
0

https://docs.telerik.com/blazor-ui/knowledge-base/inputs-validation-child-component

Number of typos where "Fied" should be "Field".  

1 minute fix, just looks bad.  4x in MyCustomComponent and in MainComponent. 

Peter


Completed
Last Updated: 02 Jan 2022 11:39 by ADMIN
Include row and column index & Field info in GridCellRenderEventArgs & row index in GridRowRenderEventArgs so that context can be used to look up ancillary information.
Completed
Last Updated: 14 Jun 2021 13:01 by ADMIN
Created by: Chris
Comments: 1
Category: UI for Blazor
Type: Feature Request
0

It would be nice to switch the color schemes used by the telerik Blazor components on-the-fly in an application (i.e. switch from light mode to dark mode). I realize you have a JS approach to this problem, however that requires maintaining multiple stylesheets and custom javascript, which we are trying to avoid in a Blazor project. I like the approach used by MudBlazor where basically all css colors are variables that can be easily switched at runtime without any javascript:

https://mudblazor.com/wasm/customization/theming/overview

Completed
Last Updated: 29 Jun 2021 20:06 by ADMIN
Created by: Steffen
Comments: 1
Category: UI for Blazor
Type: Feature Request
0

Hi,

we are having a hard time to come up with a general application layout (menu/navigation).

We found PanelBar, Menu and Drawer... are there any other controls related to menu & navigation?

A more UX oriented documentation (and not only for the technical components individually) would be nice e.g. like they do it here: Overview | Clarity Design System

 

Kind regards

Steffen

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

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; }
    }
}
Completed
Last Updated: 26 May 2021 14:51 by ADMIN

There doesn't seem to be a way to deselect the selected row either by clicking on a selected row again or by two-way-binding and setting it to an empty list.

 

This would be pretty handy as currently the only way that makes sense for me is to make no use of selection mode at all.

Completed
Last Updated: 13 Jul 2022 12:47 by ADMIN
Created by: Marc Simkin
Comments: 1
Category: UI for Blazor
Type: Feature Request
0

Pretty simple. With each release the product examples in the Github repo should be updated.

For example, I am looking at the drawer -> sidenav example. Before I can even run the example, I now need to go through all the code to make the updates from 2.14.1 to 3.4.0.  Some of the changes that I have to make are:

  • TelerikButton no longer supports the Primary attribute
  • Drawer content needs now needs to be in a <DrawerContent> element not <Content>

I should not have to make these updates to look at an example, especially when it is referenced from a forum posting.

I should just be able to compile and run the example.

Completed
Last Updated: 03 Feb 2021 17:22 by ADMIN

I would like to pass a defined piece of data in when I add a new row in a hierarchical Blazor grid.  in the example below, I have a hierarchy of Agency > District > School.  When I add a new school within a district, I would like to pass the District ID so that the user does not have to select it or type it in. 

I have a district ID column in the schools grid, but (a) it would be better if the user did not see this and (b) when I click "Add school" that field is always passed as empty.  Is there any way to pass the 

districtSchools.Dist.DISTRICT_ID

variable when I add a row?


<TelerikGrid Data="@Agencies" Sortable="true" Reorderable="true" OnUpdate="@UpdateHandlerAgency">
                <DetailTemplate Context="granteeAgency">
                    @{
                        var leadAgency = granteeAgency as Agency;
                        <TelerikGrid Data="leadAgency.Districts" OnUpdate="@UpdateHandlerDistrict" OnRowRender="@OnRowRenderHandlerDistrict">
                            <GridColumns>
                                <GridColumn Field="@(nameof(District.Dist.DistrictName))" Editable="false">
                                    <Template>
                                        @((context as District).Dist.DistrictName.ToString())
                                    </Template>
                                </GridColumn>
                                <GridColumn Field="@(nameof(District.DistAlloc))">
                                    <Template>
                                        @((context as District).DistAlloc.ToString("C"))
                                    </Template>
                                </GridColumn>
                                <GridCommandColumn>
                                    <GridCommandButton Command="Edit" Icon="edit">Edit</GridCommandButton>
                                    <GridCommandButton Command="Save" Icon="save" ShowInEdit="true">Update</GridCommandButton>
                                    <GridCommandButton Command="Cancel" Icon="cancel" ShowInEdit="true">Cancel</GridCommandButton>
                                </GridCommandColumn>
                            </GridColumns>
                            <DetailTemplate Context="districtSchools">
                                    <TelerikGrid Data="districtSchools.Schools" OnCreate="@CreateHandlerSchool" OnDelete="@DeleteHandlerSchool" OnUpdate="@UpdateHandlerSchool" OnRowRender="@OnRowRenderHandlerSchool">
                                        <GridToolBar>
                                            <GridCommandButton Command="Add" Icon="add">Add School</GridCommandButton>
                                        </GridToolBar>
                                        <GridColumns>
                                            <GridColumn Field="@(nameof(School.SchoolName))">
                                                <Template>
                                                    @((context as School).SchoolName.ToString())
                                                </Template>
                                            </GridColumn>
                                            <GridColumn Field="@(nameof(School.SchoolAlloc))">
                                                <Template>
                                                    @((context as School).SchoolAlloc.ToString("C"))
                                                </Template>
                                            </GridColumn>
                                            <GridColumn Field="" Visible="true">
                                                <Template>
                                                    @districtSchools.Dist.DISTRICT_ID
                                                </Template>
                                                <EditorTemplate>
                                                    @districtSchools.Dist.DISTRICT_ID
                                                </EditorTemplate>
                                            </GridColumn>
                                            <GridCommandColumn>
                                                <GridCommandButton Command="Edit" Icon="edit">Edit</GridCommandButton>
                                                <GridCommandButton Command="Save" Icon="save" ShowInEdit="true">Update</GridCommandButton>
                                                <GridCommandButton Command="Delete" Icon="delete">Delete</GridCommandButton>
                                                <GridCommandButton Command="Cancel" Icon="cancel" ShowInEdit="true">Cancel</GridCommandButton>
                                            </GridCommandColumn>
                                        </GridColumns>
                                    </TelerikGrid>
                            </DetailTemplate>
                        </TelerikGrid>
                    }
                </DetailTemplate>
                <GridColumns>
                    <GridColumn Field="@(nameof(Agency.AgencyName))" Editable="false">
                        <Template>
                            @((context as Agency).AgencyName.ToString())
                        </Template>
                    </GridColumn>
                    <GridColumn Field="@(nameof(Agency.AgencyAlloc))">
                        <Template>
                            @((context as Agency).AgencyAlloc.ToString("C"))
                        </Template>
                    </GridColumn>
                    <GridCommandColumn>
                        <GridCommandButton Command="Edit" Icon="edit">Edit</GridCommandButton>
                        <GridCommandButton Command="Save" Icon="save" ShowInEdit="true">Update</GridCommandButton>
                        <GridCommandButton Command="Cancel" Icon="cancel" ShowInEdit="true">Cancel</GridCommandButton>
                    </GridCommandColumn>
                </GridColumns>
            </TelerikGrid>