Questions on UI for Blazor Forum

1 answer

471 views

I am getting this error when hosting on our application. It does not appear to happen locally.

We are using the new .Net 8 autorender functionality and this seems to happen only in a virtual environment. I can give more context if needed.

General Discussions

answered on 21 Mar 2024

0 answers

206 views

Cannot type in latest VS 2022 razor editor due to snippets

I find with the latest Telerik extension enabled, I cannot type anything ( even plain text, with no html tags ) in the non-code section of a razor component ( .razor file ) due to excessive snippet activations ( they don't just list, they insert when spacing to the next word ). I have played with the VS Options for both csharp and razor editor advanced settings and nothing seems to work. There are several new settings related to snippets, but the Telerik extension doesn't seem to honor them. For example, there is one that requires a double tab to select a snippet. Instead, tab, space, etc select the first one in the list, meaning I am constantly fighting to remove the inserted snippet on literally every other word. Snippets behave as expected if I disable the Telerik extension and restart VS. And it does it in both the latest Preview and non-Preview versions of Visual Studio ( installed side by side on same machine ).

I feel like this may be more related to recent .net 8 era razor editor changes in VS, some of which is experimental, as well as a "new" razor editor. ( i have not tested in the legacy razor editor because i don't want to use the legacy razor editor in general ). I've searched in various ways here and haven't found anyone reporting the same issue, so I'm not sure if it's just me, or if I'm the first to report it. I don't have any other code helpers or extensions installed.

Thank you for your time and consideration. I'm happy to jump on a teams call with anyone who might want to see it happening, although it should be easy to replicate on latest VS 2022.

General Discussions

updated question on 20 Mar 2024

1 answer

179 views

Don't show marker on Line Chart data point hover

I have a chart with two line series, one showing current values, and the other as a reference line.

On the reference line I don't want any adornment or interaction, so I have made the markers invisible.

However, the data points still appear if you hover over where they would be.

Is there a property to prevent that?

At the moment I'm just setting their size to zero to make them as least noticeable as possible

Charts

Styling

answered on 20 Mar 2024

4 answers

7.6K+ views

How do I right-align a GridColumn content?

How do I right-align grid column values? I tried the Template with a span but it does not seem to work and it also adds another element.

This does not work:

                <GridColumn Field="Amount">
                    <Template>
                        <span style="text-align:right">
                            @((context as BO).Amount.ToString("C"))
                        </span>
                    </Template>
                </GridColumn>

Thanks.

Joel

Grid

updated answer on 19 Mar 2024

0 answers

107 views

Can I use AutoFitAllColumnsAsync() on Grid on and razor.cs that has this structure

I implemented the AutoFitAllColumnsAsync() on the CustomGrid, but the column don't resize

Please see structure below

<CustomGrid @ref="@Grid"
             OnRead="@OnGridRead"
             TItem="@Product"
             Pageable="true"
             Sortable="true"
             Resizable="true"
             FilterMode="GridFilterMode.FilterRow">
    <GridColumns>
<CascadingValue Value="grid.GetDistinctColumnFilterValues">

        <CustomGridColumn Field="@nameof(Product.Name)" Title="Product Name" />
        <CustomGridColumn Field="@nameof(Product.Price)" />
        <CustomGridColumn Field="@nameof(Product.ReleaseDate)" Title="Release Date" />
        <CustomGridColumn Field="@nameof(Product.Active)" />
    
<CascadingValue>
</GridColumns>

</CustomGrid>

Grid

asked on 19 Mar 2024

2 answers

234 views

Grid, using OnRead with Filter raises exception Serverside in ToDataSourceResult(request)

The exception is only raised when applying a filter , sorting up and down works ok. Using "contains" filter.

If I remember correctly, this worked before and I did not change my code AFAIK.

Controller side looks like this:

        [HttpPost]
        [SwaggerResponse(StatusCodes.Status200OK)]
        [SwaggerResponse(StatusCodes.Status404NotFound)]
        [Route(ApiUrlConstants.DataSourceRequestSubUrl)]
        public IActionResult DataSourceRequest(string projectIdentifier, [FromBody] DataSourceRequest request)
        {
            if (!TryGetProject(projectIdentifier, out var project))
                return this.NotFoundResult(nameof(projectIdentifier), projectIdentifier);
            var collection = GetCollection(project).Select(MapItemTypeToDto);
            var resultData = collection.ToDataSourceResult(request);
            return Ok(resultData);
        }

WebUI/Client side OnRead event looks like this (the request is sent to server without any further changes):

        private async Task ReadItems(GridReadEventArgs args)
        {
            var dataSourceResult = CollectionClient?.HasValidPath ?? false
                ? await CollectionClient.DataSourceRequestAsync(args.Request)
                : new();
            args.Data = dataSourceResult?.Data;
            args.Total = dataSourceResult?.Total ?? 0;
        }

which raises an exception in my API server , log looking like this:

fail: Microsoft.AspNetCore.Diagnostics.DeveloperExceptionPageMiddleware[1]
      An unhandled exception has occurred while executing the request.
      System.ArgumentException: Provided expression should have string type (Parameter 'stringExpression')
         at Telerik.DataSource.Expressions.ExpressionFactory.LiftStringExpressionToEmpty(Expression stringExpression)
         at Telerik.DataSource.Expressions.FilterOperatorExtensions.GenerateToLowerCall(Expression stringExpression, Boolean liftMemberAccess)
         at Telerik.DataSource.Expressions.FilterOperatorExtensions.GenerateCaseInsensitiveStringMethodCall(MethodInfo methodInfo, Expression left, Expression right, Boolean liftMemberAccess)
         at Telerik.DataSource.Expressions.FilterOperatorExtensions.GenerateContains(Expression left, Expression right, Boolean liftMemberAccess)
         at Telerik.DataSource.Expressions.FilterOperatorExtensions.CreateExpression(FilterOperator filterOperator, Expression left, Expression right, Boolean liftMemberAccess)
         at Telerik.DataSource.Expressions.FilterDescriptorExpressionBuilder.CreateBodyExpression()
         at Telerik.DataSource.FilterDescriptor.CreateFilterExpression(ParameterExpression parameterExpression)
         at Telerik.DataSource.FilterDescriptorBase.CreateFilterExpression(Expression instance)
         at Telerik.DataSource.Expressions.FilterDescriptorCollectionExpressionBuilder.CreateBodyExpression()
         at Telerik.DataSource.CompositeFilterDescriptor.CreateFilterExpression(ParameterExpression parameterExpression)
         at Telerik.DataSource.FilterDescriptorBase.CreateFilterExpression(Expression instance)
         at Telerik.DataSource.Expressions.FilterDescriptorCollectionExpressionBuilder.CreateBodyExpression()
         at Telerik.DataSource.Expressions.FilterExpressionBuilder.CreateFilterExpression()
         at Telerik.DataSource.Extensions.QueryableExtensions.Where(IQueryable source, IEnumerable`1 filterDescriptors)
         at Telerik.DataSource.Extensions.QueryableExtensions.CreateDataSourceResult[TModel,TResult](IQueryable queryable, DataSourceRequest request, Func`2 selector)
         at Telerik.DataSource.Extensions.QueryableExtensions.ToDataSourceResult(IQueryable queryable, DataSourceRequest request)
         at Telerik.DataSource.Extensions.QueryableExtensions.ToDataSourceResult(IEnumerable enumerable, DataSourceRequest request)
         at SNG.LccNion.API.Controllers.ProjectSubCollectionBaseController`2.DataSourceRequest(String projectIdentifier, DataSourceRequest request) in S:\Sources\LCCNion\Source\SNG.LccNion.API\Controllers\ProjectSubCollectionBaseController.cs:line 85
         at lambda_method21(Closure, Object, Object[])
         at Microsoft.AspNetCore.Mvc.Infrastructure.ControllerActionInvoker.InvokeActionMethodAsync()
         at Microsoft.AspNetCore.Mvc.Infrastructure.ControllerActionInvoker.Next(State& next, Scope& scope, Object& state, Boolean& isCompleted)
         at Microsoft.AspNetCore.Mvc.Infrastructure.ControllerActionInvoker.InvokeNextActionFilterAsync()
      --- End of stack trace from previous location ---
         at Microsoft.AspNetCore.Mvc.Infrastructure.ControllerActionInvoker.Rethrow(ActionExecutedContextSealed context)
         at Microsoft.AspNetCore.Mvc.Infrastructure.ControllerActionInvoker.Next(State& next, Scope& scope, Object& state, Boolean& isCompleted)
         at Microsoft.AspNetCore.Mvc.Infrastructure.ControllerActionInvoker.InvokeInnerFilterAsync()
      --- End of stack trace from previous location ---
         at Microsoft.AspNetCore.Mvc.Infrastructure.ResourceInvoker.<InvokeNextResourceFilter>g__Awaited|25_0(ResourceInvoker invoker, Task lastTask, State next, Scope scope, Object state, Boolean isCompleted)
         at Microsoft.AspNetCore.Mvc.Infrastructure.ResourceInvoker.Rethrow(ResourceExecutedContextSealed context)
         at Microsoft.AspNetCore.Mvc.Infrastructure.ResourceInvoker.Next(State& next, Scope& scope, Object& state, Boolean& isCompleted)
         at Microsoft.AspNetCore.Mvc.Infrastructure.ResourceInvoker.InvokeFilterPipelineAsync()
      --- End of stack trace from previous location ---
         at Microsoft.AspNetCore.Mvc.Infrastructure.ResourceInvoker.<InvokeAsync>g__Logged|17_1(ResourceInvoker invoker)
         at Microsoft.AspNetCore.Mvc.Infrastructure.ResourceInvoker.<InvokeAsync>g__Logged|17_1(ResourceInvoker invoker)
         at Microsoft.AspNetCore.Routing.EndpointMiddleware.<Invoke>g__AwaitRequestTask|7_0(Endpoint endpoint, Task requestTask, ILogger logger)
         at SNG.LccNion.API.JWTAuth.JwtMiddleware.Invoke(HttpContext context, IEnumerable`1 authenticationServices) in S:\Sources\LCCNion\Source\SNG.LccNion.API\StartupConfigs\JWTAuth\JWTMiddleware.cs:line 60
         at Microsoft.AspNetCore.Authorization.AuthorizationMiddleware.Invoke(HttpContext context)
         at Microsoft.AspNetCore.Authentication.AuthenticationMiddleware.Invoke(HttpContext context)
         at Microsoft.AspNetCore.Session.SessionMiddleware.Invoke(HttpContext context)
         at Microsoft.AspNetCore.Session.SessionMiddleware.Invoke(HttpContext context)
         at Microsoft.AspNetCore.Localization.RequestLocalizationMiddleware.Invoke(HttpContext context)
         at Microsoft.AspNetCore.Diagnostics.DeveloperExceptionPageMiddlewareImpl.Invoke(HttpContext context)

Wich does not really help finding out was the problem is. Sorting on any column works ok. It just seems filtering is broken somehow.

Also tried other filter options: "Equals" (no results, no error, even though it should match something), "StartsWith" same error

Pretty sure I am doing something wrong, - but what? BTW I have the same trouble using a dropdownlistbox with an OnRead handlerevent.

Some version info:

Telerik.DataSource v3.0.1
Telerik.UI.for.Blazor 5.1.1
VS 2022, .NET8

TIA,

Hans

DropDownList

Grid

answered on 19 Mar 2024

1 answer

175 views

Localization on all Telerik component with Blazor

I implemented the Localization on my project, and I got almost all of them. But the Column Menus and some drop downs aren't translating.

How can I achieve that?

Implementation

Program.cs

            // register a custom localizer for the Telerik components, after registering the Telerik services
            builder.Services.AddSingleton<ITelerikStringLocalizer, TelerikLocalizer>();
            builder.Services.AddLocalization();

TelerikLocalizer.cs

public class TelerikLocalizer : ITelerikStringLocalizer
{
    private readonly IStringLocalizer<Resources> globalLocalizer;

    public TelerikLocalizer(IStringLocalizer<Resources> globalLocalizer)
    {
        this.globalLocalizer = globalLocalizer;
    }

    public string this[string name] => GetStringFromResource(name);

    public string GetStringFromResource(string key)
    {
        var localString = Resources.ResourceManager.GetString(key, Resources.Culture);
        if (string.IsNullOrWhiteSpace(localString))
        {
            return globalLocalizer.GetString(key);
        }
        return localString;
    }
}

I have a list of about 19 languages

Source: https://github.com/telerik/blazor-ui/tree/master/common/localization

Grid

answered on 19 Mar 2024

1 answer

89 views

Blazor Scheduler incorrectly defaults to date min value when creating new schedule

I'm trying to figure out why when creating a new appointment in the blazor scheduler the popup window has start and end dates as min values instead of the date/time relating to the user click - is this a known issue?

Try creating a new appointment here and look at the dates in the popup here - Blazor Scheduler (Event Calendar) Demos - Overview | Telerik UI for Blazor - am I missing something, this can't be by design..?

Scheduler

answered on 18 Mar 2024

1 answer

1.2K+ views

Scroll to Bottom

Is there a way to programmatically force the grid to scroll to the bottom. I am using the grid to display history, so when they add a new item, i was to force the grid to the last row so show the last item they added.

GridLayout