Questions on UI for Blazor Forum

1 answer

105 views

Filterrow buttons

Hi

Is it possible to hide these buttons?

Eric

Filter

Grid

answered on 07 Sep 2022

0 answers

1.2K+ views

First Login Page

Hi, I have a problem with first login page in Blazor NET 6, because there was changed _layout and _host pages.

In Core 3.1. it works https://www.youtube.com/watch?v=PgDEpkWbsew, but I don't know how can I do it in Net 6

Can you help me, please.

Thanks

Peter

General Discussions

asked on 06 Sep 2022

1 answer

401 views

DateRange Picker - End date issue

Why this happening after selecting the start date?

DateRangePicker

answered on 06 Sep 2022

1 answer

157 views

Allways new FilterCellTemplateContext instance

I have created custom row filtering.

TelerikDateRangePicker is used inside FilterCellTemplate.

Based on the examples from the article -> https://demos.telerik.com/blazor-ui/grid/custom-filter-row <- select start, end dates and clear button handlers was implemented.

But I found that for each handler (select start or end date) new instance of FilterCellTemplateContext has been used.

And when I try to get selected values in OnRead method from GridReadEventArgs -> Request.Filters, filters do not contain selected date range.

Could someone please explain why there are a lot of instances of FilterCellTemplateContext (more that one on each method call)?

How can I get selected date range values in OnRead methods from GridReadEventArgs?

Thanks!

Filter

Grid

answered on 05 Sep 2022

1 answer

130 views

[Solved] Blazor component Edit/Preview on website needs compilation error display

Hello,

the Edit/Preview box on the Blazor documentation is nice. Allows me to quickly try what the specific component or option does and allows. But, if I'm not mistaken, it does not display compilation errors anywhere and this makes the experience in case of an error really bad.

For example, if I go to the Blazor MultiSelect page and edit the first editor available under the "Creating MultiSelect" header. If I make no mistakes, pressing the Preview button compiles the code cleanly and starts the Blazor component with my edits. But, if I make a mistake, let's say near the bottom of the Edit box I accidentally add an extra d to Add like so "Countries.Addd("Albania");", then after pressing the Preview button a couple of things might happen(?)

If I had already successfully compiled some Blazor from your website, the Preview box will not update with the edits, but instead show the old compilation. and no errors anywhere. Can be very puzzling if the previous code was for.ex. from a different component alltogether
If I didn't have an earlier compilation, kind of nothing happens. The Preview box display stays empty and there are no errors anywhere.

So please add some kind of a popup with atleast an error saying "Hey, there's some problem with your code, we couldn't compile it, please take another look", or better yet, the actual error and line number if possible.

General Discussions

answered on 02 Sep 2022

1 answer

280 views

[Solved] TelerikGrid freezing browser on load

I've got a TelerikGrid that occasionally loads a very large amount of data and when this happens it will freeze the entire webpage. I was wondering if there is a way to load the grid asynchronously, to allow users to still be able to click other things, or if there is a way to indicate to the user that a loading is occurring. Below is the code for my TelerikGrid and even though I have the line `EnableLoaderContainer="@ShowLoading"` it does not indicate that the grid is loading.

<TelerikGrid 
                    Data="@model.DegradeTableRows" 
                    @ref="@Grid"
                    Width="100%"
                    Height="100%"
                    EnableLoaderContainer="@ShowLoading"
                    Groupable="true"
                    Pageable="false" 
                    Sortable="true"
                    FilterMode="@GridFilterMode.FilterMenu">
                    <GridColumns>
                        <GridColumn Field="unitNumb" Width="110px" FieldType="@typeof(int)" Title="Unit Number"/>
                        <GridColumn Field="grade" Width="100px" Title="Grade" FieldType="@typeof(string)" />
                        <GridColumn Field="length" Width="100px" FieldType="@typeof(string)" Title="Length"/>
                        @if (SizeColumnNames is not null && SizeColumnNames.Any())
                        {
                            foreach (var sizeColumnName in SizeColumnNames)
                            {
                                <GridColumn Width="100px" Field="@sizeColumnName" FieldType="@typeof(int)" Title="@sizeColumnName"/>
                            }    
                        }
                        <GridColumn Width="150px" Field="GrandTotal" FieldType="@typeof(decimal)" Title="Grand Total"/>
                    </GridColumns>
                </TelerikGrid>

Grid

answered on 01 Sep 2022

1 answer

241 views

TelerikTabStrip returns ArgumentOutOfRangeException when changing first tab to invisible

Telerik Blazor version: 3.4.0, 3.5.0

I'm currently encountering a bug within Telerik Blazor with the TabStrip component. If the first Tab of the TabStrip's visibility is set to false, the component throws an exception:
ArgumentOutOfRangeException: Index was out of range. Must be non-negative and less than the size of the collection. (Parameter 'index')

With some debugging, I found what went wrong within Telerik's code. But first, the scenario:

Setup

Create a TelerikTabStrip with three TabStripTab components inside: A, B, C.

Scenario A

Tab A: Visible = false
Tab B: Visible = true
Tab C: Visible = true

Scenario B

Tab A: Visible = true
Tab B: Visible = false
Tab C: Visible = true

Result

Scenario B works fine. Scenario A does not. Why? Basically, it looks like this happens:

Tab => SetParameters() => VisibleChanged = true (because that parameter is set) => TabStrip.OnTabVisibiltyChanged => IsTabActive = true (because it's the first tab) => FindFocusable => this method has only one tab in the list (the first tab) and not the other two tabs because it's still early in the component lifecycle => FindIndex can't find a tab that is visible and not disabled => returns index -1 => this is out of range and throws an exception

Why scenario B works:

Tab A => SetParameters() => VisibleChanged = false (because the parameter is not changed to the default) => basically done
Tab B => SetParameters() => VisibleChanged = true (because we changed that) => TabStrip.OnTabVisibilityChanged => IsTabActive = false (not the first tab, so not active) => basically done

@page "/TabStripTest"

<PageTitle>Telerik tabs error</PageTitle>

<TelerikTabStrip @ref="_stripRef">
    <TabStripTab Title="A" Visible="true">
        Tab A
    </TabStripTab>

    <TabStripTab Title="B" Visible="false">
        Tab B
    </TabStripTab>

    <TabStripTab Title="C" Visible="true">
        Tab C
    </TabStripTab>
</TelerikTabStrip>

@code {
    private TelerikTabStrip _stripRef;
}

Full stacktrace:

System.ArgumentOutOfRangeException: Index was out of range. Must be non-negative and less than the size of the collection. (Parameter 'index')
   at Telerik.Blazor.Components.TelerikTabStrip.FocusActiveTab()
   at Telerik.Blazor.Components.TelerikTabStrip.set_CurrentActiveTabIndex(Int32 value)
   at Telerik.Blazor.Components.TelerikTabStrip.Telerik.Blazor.Components.TabStrip.ITabContainer.OnTabVisibleChanged(ITab tab)
   at Telerik.Blazor.Components.TabStripTab.OnParametersSetAsync()
   at Microsoft.AspNetCore.Components.ComponentBase.CallOnParametersSetAsync()
   at Microsoft.AspNetCore.Components.ComponentBase.RunInitAndSetParametersAsync()
   at Microsoft.AspNetCore.Components.Rendering.HtmlRenderer.HandleException(Exception exception)
   at Microsoft.AspNetCore.Components.RenderTree.Renderer.HandleExceptionViaErrorBoundary(Exception error, ComponentState errorSourceOrNull)
   at Microsoft.AspNetCore.Components.RenderTree.Renderer.AddToPendingTasks(Task task, ComponentState owningComponentState)
   at Microsoft.AspNetCore.Components.Rendering.ComponentState.SupplyCombinedParameters(ParameterView directAndCascadingParameters)
   at Microsoft.AspNetCore.Components.Rendering.ComponentState.SetDirectParameters(ParameterView parameters)
   at Microsoft.AspNetCore.Components.RenderTree.RenderTreeDiffBuilder.InitializeNewComponentFrame(DiffContext& diffContext, Int32 frameIndex)
   at Microsoft.AspNetCore.Components.RenderTree.RenderTreeDiffBuilder.InitializeNewSubtree(DiffContext& diffContext, Int32 frameIndex)
   at Microsoft.AspNetCore.Components.RenderTree.RenderTreeDiffBuilder.InsertNewFrame(DiffContext& diffContext, Int32 newFrameIndex)
   at Microsoft.AspNetCore.Components.RenderTree.RenderTreeDiffBuilder.InsertNewFrame(DiffContext& diffContext, Int32 newFrameIndex)
   at Microsoft.AspNetCore.Components.RenderTree.RenderTreeDiffBuilder.AppendDiffEntriesForRange(DiffContext& diffContext, Int32 oldStartIndex, Int32 oldEndIndexExcl, Int32 newStartIndex, Int32 newEndIndexExcl)
   at Microsoft.AspNetCore.Components.RenderTree.RenderTreeDiffBuilder.ComputeDiff(Renderer renderer, RenderBatchBuilder batchBuilder, Int32 componentId, ArrayRange`1 oldTree, ArrayRange`1 newTree)
   at Microsoft.AspNetCore.Components.Rendering.ComponentState.RenderIntoBatch(RenderBatchBuilder batchBuilder, RenderFragment renderFragment, Exception& renderFragmentException)
   at Microsoft.AspNetCore.Components.RenderTree.Renderer.ProcessRenderQueue()
--- End of stack trace from previous location ---
   at Microsoft.AspNetCore.Components.Rendering.HtmlRenderer.HandleException(Exception exception)
   at Microsoft.AspNetCore.Components.RenderTree.Renderer.ProcessRenderQueue()
   at Microsoft.AspNetCore.Components.RenderTree.Renderer.ProcessPendingRender()
   at Microsoft.AspNetCore.Components.RenderTree.Renderer.AddToRenderQueue(Int32 componentId, RenderFragment renderFragment)
   at Microsoft.AspNetCore.Components.ComponentBase.StateHasChanged()
   at Microsoft.AspNetCore.Components.ComponentBase.CallOnParametersSetAsync()
   at Microsoft.AspNetCore.Components.ComponentBase.RunInitAndSetParametersAsync()
   at Microsoft.AspNetCore.Components.Rendering.HtmlRenderer.HandleException(Exception exception)
   at Microsoft.AspNetCore.Components.RenderTree.Renderer.HandleExceptionViaErrorBoundary(Exception error, ComponentState errorSourceOrNull)
   at Microsoft.AspNetCore.Components.RenderTree.Renderer.AddToPendingTasks(Task task, ComponentState owningComponentState)
   at Microsoft.AspNetCore.Components.Rendering.ComponentState.SupplyCombinedParameters(ParameterView directAndCascadingParameters)
   at Microsoft.AspNetCore.Components.Rendering.ComponentState.SetDirectParameters(ParameterView parameters)
   at Microsoft.AspNetCore.Components.RenderTree.Renderer.RenderRootComponentAsync(Int32 componentId, ParameterView initialParameters)
   at Microsoft.AspNetCore.Components.Rendering.HtmlRenderer.CreateInitialRenderAsync(Type componentType, ParameterView initialParameters)
   at Microsoft.AspNetCore.Components.Rendering.HtmlRenderer.RenderComponentAsync(Type componentType, ParameterView initialParameters)
   at Microsoft.AspNetCore.Components.Rendering.RendererSynchronizationContext.<>c__11`1.<<InvokeAsync>b__11_0>d.MoveNext()
--- End of stack trace from previous location ---
   at Microsoft.AspNetCore.Mvc.ViewFeatures.StaticComponentRenderer.PrerenderComponentAsync(ParameterView parameters, HttpContext httpContext, Type componentType)
   at Microsoft.AspNetCore.Mvc.ViewFeatures.ComponentRenderer.PrerenderedServerComponentAsync(HttpContext context, ServerComponentInvocationSequence invocationId, Type type, ParameterView parametersCollection)
   at Microsoft.AspNetCore.Mvc.ViewFeatures.ComponentRenderer.RenderComponentAsync(ViewContext viewContext, Type componentType, RenderMode renderMode, Object parameters)
   at Microsoft.AspNetCore.Mvc.TagHelpers.ComponentTagHelper.ProcessAsync(TagHelperContext context, TagHelperOutput output)
   at Microsoft.AspNetCore.Razor.Runtime.TagHelpers.TagHelperRunner.<RunAsync>g__Awaited|0_0(Task task, TagHelperExecutionContext executionContext, Int32 i, Int32 count)
   at TelerikTabStripBug.Pages.Pages__Host.ExecuteAsync() in C:\Users\Thimo.Koolen\source\repos\TelerikTabStripBug\TelerikTabStripBug\Pages\_Host.cshtml:line 6
   at Microsoft.AspNetCore.Mvc.Razor.RazorView.RenderPageCoreAsync(IRazorPage page, ViewContext context)
   at Microsoft.AspNetCore.Mvc.Razor.RazorView.RenderPageAsync(IRazorPage page, ViewContext context, Boolean invokeViewStarts)
   at Microsoft.AspNetCore.Mvc.Razor.RazorView.RenderAsync(ViewContext context)
   at Microsoft.AspNetCore.Mvc.ViewFeatures.ViewExecutor.ExecuteAsync(ViewContext viewContext, String contentType, Nullable`1 statusCode)
   at Microsoft.AspNetCore.Mvc.ViewFeatures.ViewExecutor.ExecuteAsync(ViewContext viewContext, String contentType, Nullable`1 statusCode)
   at Microsoft.AspNetCore.Mvc.Infrastructure.ResourceInvoker.<InvokeNextResultFilterAsync>g__Awaited|30_0[TFilter,TFilterAsync](ResourceInvoker invoker, Task lastTask, State next, Scope scope, Object state, Boolean isCompleted)
   at Microsoft.AspNetCore.Mvc.Infrastructure.ResourceInvoker.Rethrow(ResultExecutedContextSealed context)
   at Microsoft.AspNetCore.Mvc.Infrastructure.ResourceInvoker.ResultNext[TFilter,TFilterAsync](State& next, Scope& scope, Object& state, Boolean& isCompleted)
   at Microsoft.AspNetCore.Mvc.Infrastructure.ResourceInvoker.InvokeResultFilters()
--- 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|6_0(Endpoint endpoint, Task requestTask, ILogger logger)
   at Microsoft.AspNetCore.Diagnostics.DeveloperExceptionPageMiddleware.Invoke(HttpContext context)

TabStrip

answered on 01 Sep 2022

0 answers

169 views

Workaround? Ability to set WorkDayStart/WorkDayEnd for individual days on the Scheduler in other views than single day.

Has anyone found a way to handle this without it being an official feature yet?

Scheduler

asked on 01 Sep 2022

1 answer

123 views

More packages to Install

Hi

Except of these 2 packages, are there any packages that are recommended to install?

Eric

General Discussions

answered on 01 Sep 2022

1 answer

523 views

Treeview parent/child relationship not working

I created a treeView but for some reason, the data children are not included in the drop-down but separate. How would I set this up to have the children fall under their parent?

@code {

IEnumerable<TreeItem> FlatData { get; set; }
IEnumerable<object> ExpandedItems { get; set; } = new List<TreeItem>();

private void CreateDeviceTreeList()
{
List<TreeItem> items = new List<TreeItem>();

int count = 0;
foreach(var a in devices.Items)
{
items.Add(new TreeItem(){
Id = count,
Parent = null,
Text = a.Name,
HasChildren = true
});
count++;
items.Add(new TreeItem(){
Id = count,
Parent = count-1,
Text = a.Group,
HasChildren = false
});
count++;
items.Add(new TreeItem(){
Id = count,
Parent = count-1,
Text = a.Sensor,
HasChildren = false
});
count++;
}
FlatData = items;
ExpandedItems = FlatData.Where(x => x.HasChildren == true).ToList();
StateHasChanged();

}

protected async override void OnInitialized()
{

CreateDeviceTreeList();

}

TreeView

answered on 01 Sep 2022