Telerik Forums
UI for Blazor Forum
1 answer
305 views

Hi,

I'm trying to bind the tree list to a list of Dictionary<string. object> objects, where the TreeListColumn.Field equals the key in the Dictionary for that row. This works fine for displaying the data in the tree. However, when I try to set the sorting state by specifying a column name to sort by, I get the following error inside Telerik:

Error: System.ArgumentException: Invalid property or field - 'Name' for type: DynamicEntityBase
   at Telerik.DataSource.Expressions.MemberAccessTokenExtensions.CreateMemberAccessExpression(IMemberAccessToken token, Expression instance)
   at Telerik.DataSource.Expressions.ExpressionFactory.MakeMemberAccess(Expression instance, String memberName)
   at Telerik.DataSource.Expressions.ExpressionFactory.MakeMemberAccess(Expression instance, String memberName, Boolean liftMemberAccessToNull)
   at Telerik.DataSource.Expressions.PropertyAccessExpressionBuilder.CreateMemberAccessExpression()
   at Telerik.DataSource.Expressions.MemberAccessExpressionBuilderBase.CreateLambdaExpression()
   at Telerik.DataSource.SortDescriptorCollectionExpressionBuilder.Sort()
   at Telerik.DataSource.Extensions.QueryableExtensions.Sort(IQueryable source, IEnumerable`1 sortDescriptors)
   at Telerik.Blazor.Data.TelerikTreeListDataSource`1.SortItems(IEnumerable`1 tree)
   at Telerik.Blazor.Data.TelerikTreeListDataSource`1.SortItems(IEnumerable`1 tree)
   at Telerik.Blazor.Data.TelerikTreeListDataSource`1.SortItems(IEnumerable`1 tree)
   at Telerik.Blazor.Data.TelerikTreeListDataSource`1.SortItems(IEnumerable`1 tree)
   at Telerik.Blazor.Data.TelerikTreeListDataSource`1.SortTree()
   at Telerik.Blazor.Data.TelerikTreeListDataSource`1.InitData(IEnumerable`1 sourceData)
   at Telerik.Blazor.Data.TelerikTreeListDataSource`1.ProcessData(IEnumerable data)
   at Telerik.Blazor.Components.Common.DataBoundComponent`1.ProcessDataInternal()
   at Telerik.Blazor.Components.Common.DataBoundComponent`1.OnParametersSetAsync()
   at Telerik.Blazor.Components.TelerikTreeList`1.OnParametersSetAsync()
   at Microsoft.AspNetCore.Components.ComponentBase.CallStateHasChangedOnAsyncCompletion(Task task)

 

Is there a work around for this, or can sorting by done by some other method? We want to use a Dictionary since we are dynamically creating the data to bind to instead of hard-coding a specific POCO for each page.

Dimo
Telerik team
 answered on 09 Jun 2022
5 answers
1.7K+ views

Hello,

I want to remove white space in drop down values in blazor. Please see the image below.

Could please suggest on this

 

 

 

Nadezhda Tacheva
Telerik team
 answered on 09 Jun 2022
1 answer
1.0K+ views

Blazor DEEP LINKING Support:  -  seeking suggestions or interest.

I have discovered that Blazor "Deep Linking" is something with not much .NET API support and community code blogs.

ShortComing: 
This solution does not use the LocationChanged Event. Blazors NavigationManager LocationChanged Event is not friendly enough to support deep linking URL's that are not managed under a Blazor "Circuit".  eg an initial request by clicking a browser history/favorite link. 
KeyNote
So far, the findings indicate that the LocationChanged Event will not fire for this type of initial web request with subsequent requests managed in a Blazor "Circuit". It's too late because the first request was not caught by the LocationChanged  Event. 


Obtained GOAL:

Supports detailed "deep linking" to Restore Navigation UI Components and also restore workflow state for a page defined in the URL route. 

This is a Blazor Server implementation to support Blazor "Deep Linking". 
The code base has been refined, good comments and well ordered.; looking production ready. 
Blazor Server was chosen to reduce the security attack surface. The application using this type solution is not ultra high bandwidth so adding a few extra micro-seconds (or even a milli-second) of code runtime is not an issue. 

>>> Before scaling out adding application page-specific content, now seeking alternatives, insight and suggestions (yeah, should have asked sooner) 
               >>> Ideally, I should have created a few block diagrams and code fragments to help visualize. (perhaps support files can be added if further interest.)


Primary Application Components: 
The MainLayout Component supports four primary Blazor Components:
 1) "Module List":    in the upper title area, a TelerikBreadcrumb Component showing a list of "Module Items" to click on.
 2) "Module Item":   a TelerikTreeView Component containing a navigational hierarchical list of TreeItems located along the left side of the page. Each TreeItem contains url route segments to a Blazor Page Component. Each item contains properties for customization.
 3) "NavBreadcrumb":   a TelerikBreadcrumb Component showing the clicked selectedTreeView item, and its parent items.  Located just above the Module Item on the left side MainLayout Component. 
 4) "Page": the Page Component in the selected TreeItem from the selected ModuleItem.   KeyNote: in this solution, a page may be under multiple module list and module items.  Thus the format of the URL route as defined below. 

URL Route Schema: 
The following is the overall Route Template scheme for the website solution: 
     / ModuleListName / ModuleItemName PageName / optionalRouteParam1 / optionalRouteParam2 ? value1=xxx & value2=yyy

In each Page Component, the @Page Directive Is Not used. Instead, @attribute [Route("route template")] is used in all page type components. This allows the use of string constants.  @Page only allows string literals.

Here are two example route templates in one of the Page Components:   (each page may contain multiple routes)
   @attribute [Route($"/{ModuleListName.Tenant}/{ModuleItemName.ClientAdmin}/{PageItem.UserGrid}/{PageAction.Manage}")]
   @attribute [Route($"/{ModuleListName.Tenant}/{ModuleItemName.UserAdmin}/{PageItem.UserGrid}/{PageAction.Search}")]

Naming Constants and Dictionary:
In the above example, four static classes with multiple static string constants are used to define all navigation type lists and items, and the routing/query string values:
  The four static classes are: 
    ModuleList    -   A list of possible Module lists to display in the MainLayout Title Area. (each contains a list of "ModuleItems")
    ModuleItem   -  An item in each of the above Module Lists
    PageItem       -  The actual Page Component Name  (pageitems use "nameof(pagecomponent)" to assign a page item value.
    PageAction   -  Optional route fragments

Key Point: using string constants in a centrally located file subdirectory allows global renaming. And, allows using friendlier names in the source code while using more-so cryptic names in the built public url routes. 
* it does come with a bit of overhead managing names and assigned values but IMO worth the organizational effort; especially after the solution grows with many pages and complex list/item navigation. Maintaining this type information can be handled by even non-coders with app/solution familiarity.

 

App Specific Component Base Class:
A base class that inherits "ComponentBase" is used by all page components instead of ComponentBase. This is where incoming URL requests are handled. This class contains a number of methods and state management that are in common to all pages. 

Route Manager Class:  

There are "ModuleList" and ModuleItem" definition files that are essentially dictionary's to look up a name to .NET Type then activate the type to an instance. 
The "RouteManager" class contains URL Encoding and URL Decoding methods.

Route Manager - URL Encoding:
When a user clicks on a ModuleItem TreeItem selection, the tree item information is passed to a URL Encoding method to build a "deep link". Also, application specific query string parameters are appended. 

Route Manager - URL Decoding:
The incoming request route segments are parsed and mapped to the above blazor components:  ModuleList, ModuleItem, PageItem.
If a route change is detected, then events are fired to notify the MainLayout Component to update the affected component contents.

SessionStateManger Service Class:
Implemented is a comprehensive more-so generic type session manager class. It handles app-specific requirements. 
Retaining login and navigation to all "module's". ie the feature set and supporting pages. 
The solution also contains other supporting code.

>>> Overall, there is a lot going on to manage everything thus creating a working API for all page component content developers to code around as an de-facto standard. 


DEEP LINKING:

Using the above, the blazor solution supports detailed deep linking to fully restore state; restoring the four primary components listed above. Plus, optional route fragments and query string values to further define state for a given page component. 


*** I hope I have described the architecture clearly enough to grasp and visualize the implementation.***

I'd appreciate relevant input to affect the outcome of the implementation. 

Daniel
Top achievements
Rank 1
Iron
 answered on 06 Jun 2022
2 answers
642 views

Hi, i would like to hide the row showed when the grid has no data.

I tried set an empty NoDataTemplate as you can show in this sample, but there is still an empty row in the grid.

https://blazorrepl.telerik.com/mwOKORks03LqmocU06

My actual workaround is using css:

<TelerikGrid Class="hide-no-data-template">...</TelerikGrid>

.hide-no-data-template .k-grid-norecords {
    display: none;
}

or set the diplay attribute via JSInterop for specific cases.

I think when NoDataTemplate is empty you should not show an empty row but simply hide the template row.

Can be solved?

 

Claudio
Top achievements
Rank 2
Bronze
Bronze
Iron
 answered on 06 Jun 2022
1 answer
327 views

If i set the TextAlign property on GridColumn it work well for read Template, but not for EditorTemplate.

It's a bug?

There is a workaround?

Thanks

Svetoslav Dimitrov
Telerik team
 answered on 06 Jun 2022
0 answers
306 views

Hi,

Have been focusing on some backend stuff and missed a couple released of Telerik Blazor. Have gone through docs for the missed releases but can't see anything to assist me -

 

After updating to latest, it seems to have broken my ability to export properly.

I am using OnRead and returning the data via the args myself from the database. When I export a CSV or Excel file for a grid which has data in it, I get the headers for each column but I get no data.

Another method I am using elsewhere, though I haven't taken much time to look at it just yet, is using GridRef.Data, where GridRef is an @ref to my Grid, and this also appears to be broken and not be getting any data, yet the grid is showing data clearly in it returned via the OnRead.

Is there something I need to have changed with one of the recent updates?

Pingu
Top achievements
Rank 1
Iron
Iron
 asked on 06 Jun 2022
1 answer
130 views

Hi,

I have a question which is how to  show a field which is one field of child object inside object in blazor grid popup edit interface . Thanks

 

JM
Top achievements
Rank 1
Iron
 answered on 05 Jun 2022
1 answer
182 views

Hi,

I got the following error (in 10805 line of all.css file) while updating @progress/kendo-theme-bootstrap@4.43.0 to @progress/kendo-theme-bootstrap@5.4.1 .

Debug in all.scss:

What should i do to solve this problem?

Teya
Telerik team
 answered on 03 Jun 2022
0 answers
179 views
I have a parent component with a TelerikWindow. The parent component has a bool value that is used via @bind-Visible (two-way binding) to show or hide the TelerikWindow. Once the window was visible (i.e. the bound parameter is set to true), a call to StateHasChanged() causes the window to become visible for a short moment (< 1 sec). 

Since I am using two-way binding at this point, I would expect that hiding the window in both the parent and TelerikWindow components would cause the visibility value to be set to false, so that when StateHasChanged() is called, the window will not become visible again, even for a brief moment.


Martin
Top achievements
Rank 1
 asked on 03 Jun 2022
1 answer
179 views

Hello,

Is there any way to load data for a the DropDownList when the Dropdown gets opened, instead of when it gets initialized.

I've looked over examples and docs and also tried a workaround with virtualization, but even that loads the first page on intialization.

I  have a UI with multiple DropDownList instances on the page that might not be interacted with, and I'd like to defer loading the data until the user actually interacts with them. 

Thank you!

Nadezhda Tacheva
Telerik team
 answered on 03 Jun 2022
Narrow your results
Selected tags
Tags
+? more
Top users last month
Rob
Top achievements
Rank 3
Iron
Iron
Iron
Atul
Top achievements
Rank 1
Iron
Iron
Iron
Alexander
Top achievements
Rank 1
Veteran
Iron
Serkan
Top achievements
Rank 1
Iron
Shawn
Top achievements
Rank 1
Iron
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
Rob
Top achievements
Rank 3
Iron
Iron
Iron
Atul
Top achievements
Rank 1
Iron
Iron
Iron
Alexander
Top achievements
Rank 1
Veteran
Iron
Serkan
Top achievements
Rank 1
Iron
Shawn
Top achievements
Rank 1
Iron
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?