Hi,
since jQuery has Telerik styles via SASS, is it SASS also available for Blazor? If so, is there direct support for XAML mixins and syntax changes for MAUI clients? Since we want to build Razor pages and WASM for MAUI client with existing Telerik theme which would make consistent appearance within existing jQuery applications ...

Kind regards.

Is it possible to change the component's default language without resorting to localization. As of now, I don't really need to customize my app for a specific region and I want to force it to be exclusively in a specific language, in this case Portuguese. By following the tutorial in Blazor Localization - Telerik UI for Blazor I arrive to an annoying problem where dateTime validation triggers format exceptions due to regional formatting of dates.

Hello,

Am trying to toggle the drawer component from a separate razor file.

I have two razor files in the following directories:

\Components\Layout\SiteHeader\SiteHeader.razor

\Components\Pages\Home.razor

If Home.razor contains the default Drawer code:

@* This example shows the basic configuration of the Drawer and how to expand or collapse a Drawer with a click of a button. *@

<TelerikButton OnClick="@(() => DrawerRef.ToggleAsync())"
               Icon="@SvgIcon.Menu">
    Toggle drawer
</TelerikButton>

<TelerikDrawer Data="@Data" Mode="@DrawerMode.Push"
               @ref="@DrawerRef">
    <DrawerContent>lorem ipsum</DrawerContent>
</TelerikDrawer>

@code {
    Telerik.Blazor.Components.TelerikDrawer<DrawerItem> DrawerRef { get; set; }

    IEnumerable<DrawerItem> Data { get; set; } =
        new List<DrawerItem>
            {
            new DrawerItem { Text = "Counter", Icon = SvgIcon.Plus },
            new DrawerItem { Text = "FetchData", Icon = SvgIcon.GridLayout },
            };

    public class DrawerItem
    {
        public string Text { get; set; }
        public ISvgIcon Icon { get; set; }
    }
}

If however I waned to move only the button portion to the SiteHeader.razor file

<TelerikButton OnClick="@(() => DrawerRef.ToggleAsync())"
               Icon="@SvgIcon.Menu">
    Toggle drawer
</TelerikButton>

How can I get access to the 

DrawerRef

So that I can toggle from  SiteHeader.razor 

Is this possible?

Thanks

Any help be appreciated

Thanks

I have an issue with the DropDownList and Data Annotations.

I have created a REPL instance that demonstrates the problem https://blazorrepl.telerik.com/GyamPdlf37LXpPAW36

Select the last item in the tree 7.Garden and change the value in the drop down list to Unsupported.

The drop down list shows a red border.

Select item 6.Garden from the tree. (Any item in the tree other than 1 will do)

I expect the drop down to not have the red border, yet is does.

The text box does not show the same behaviour.

Select 7.Garden

Edit the email address to start with unsupported

The text box has the red border

Select any other item in the tree, they will not have the red border.

TBH I'm not sure if this is a Telerik/DropDownList issue or I'm doing something wrong.

The REPL example replicates an issue in a larger piece of code that is more complex with regards to the validation which is why there are no data annotations on properties and the binding are not simple.

Regards

I'm trying to open a popup from a button in a grid cell.  The button work and opens the popup, but it opens in the top left corner of the screen, rather than anchored to the button.  I would love to get it to the right of the icon, with a little space in between.

In my grid column, I've added a button to open the popup

<GridColumn Field="L1" Title="Level 1" FieldType="@typeof(string)">
    <Template>
                @{
                    var item = (TaxonomyGrid)context;
                }
                @item.L1
                <TelerikButton OnClick="@(() => PopupRef.Popup_OpenAsync())" Class="popup-target" Icon="@SvgIcon.User" Title="The name of the owner" />
    </Template>
    <FilterMenuTemplate>
        <div>
            <TelerikMultiSelect Width="300px" AutoClose=false Data="@L1List" TextField="Name" ValueField="TaxonomyId" OnChange="@(() => FilterGrid(1, SelectedL1Ids))" @bind-Value=@SelectedL1Ids > </TelerikMultiSelect>
        </div>
    </FilterMenuTemplate>
    <FilterMenuButtonsTemplate />
</GridColumn>

The popup itself is pretty generic and is added to the page after the grid.

<TelerikPopup
    @ref="@PopupRef"
    AnchorSelector=".popup-target">
    I am a Telerik Popup.
</TelerikPopup>

My other issue is I have none of the placement properties such as AnchorHorizontalAlign and AnchorVerticalAlign. If I try and add them to the TelerikPopup tag, it tells me it doesn't exist.

It's got to be something really simple, yes?  Help me please.

Update: I added the popup to the column template

        <GridColumn Field="L2" Title="Level 2" FieldType="@typeof(string)">
            <Template>
                @{
                    var item = (TaxonomyGrid)context;
                }
                @item.L2
                @{
                    if (item.L2OwnerId != null)
                    {
                        <TelerikButton OnClick="@(() => PopupRef.Popup_OpenAsync())" Class="popup popup-target" Icon="@SvgIcon.User" Title="The name of the owner" />
                        <TelerikPopup Class="popup" @ref="@PopupRef"
                                        MinHeight="500px"
                                        MinWidth="300px"
                                        AnchorSelector=".popup-target">
                            <span>@item.L2OwnerName</span>
                            <span>@item.L2OwnerEmail</span>
                        </TelerikPopup>
                    }
                }
            </Template>
            <FilterMenuTemplate>
                <div>
                    <TelerikMultiSelect Width="300px" AutoClose=false Data="@L2List" TextField="Name" ValueField="TaxonomyId" OnChange="@( () => FilterGrid(2, SelectedL2Ids))" @bind-Value=@SelectedL2Ids> </TelerikMultiSelect>
                </div>
            </FilterMenuTemplate>
            <FilterMenuButtonsTemplate />
        </GridColumn>

Now, I click on the first row with an icon and the tooltip works as expected.  However, if I click on a subsequent row the tooltip appears in the wrong place.  I assume this is related to the fact I can't set the horizontal/vertical relationship with the anchor because the properties are availble?

Update #2   I fixed part of the anchor problem.  I created a method to open the popup and I found some properties there that let me set the anchor alignment, plus I removed the min-height and set the max-height.

        
public void Openpopup()
        {
            PopupRef.AnchorAlign.HorizontalAlign = PopupHorizontalAlign.Right;
            PopupRef.AnchorAlign.VerticalAlign = PopupVerticalAlign.Top;
            PopupRef.Popup_OpenAsync();
        }

Now if I click down the column the popup is positioned correctly, however (LOL) if I click on the 6th row down, then click on the first row the popup appears with the 6th row. ugh.

I have this code:

    <TelerikDatePicker @bind-Value="@Value" Width="400px" Format="dd/MM/yyyy">
    </TelerikDatePicker>

this results in this:

Why is it not the format dd/MM/yyyy as I specified?

Hi, 

 I couldn't find OnAdd event for Blazor Listview component CRUD operations(like the one available for Grid) .

I would like to initialize certain properties of the model when 'Add' button is clicked, is there any other workaround? 

Thanks,

Deepa