We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. (Last updated on: June 24, 2019).
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

What types are allowed in DataSource?

Thread ID:

Created:

Updated:

Platform:

Replies:

150981 Jan 27,2020 07:35 AM UTC Feb 7,2020 04:03 AM UTC Blazor 3
loading
Tags: TreeView
Simon
Asked On January 27, 2020 07:35 AM UTC

I'm using DynamicData from ReactiveUI and transformed a list into a tree and output a `ReadOnlyObservableCollection` which is used as `DataSource`. The `EjsTreeView` mapping is applied but doesn't show the text nor the arrows but renders the first root children (totally empty but `<li>`'s are visible). When I try to use `NodeTemplate` I get nulls on `@context`.

How complex can a type be in the `DataSource`?

FileTree.razor
```
<EjsTreeView TValue="FileInfoViewModel">
<TreeViewFieldsSettings TValue="FileInfoViewModel"
DataSource="@FileInfoViewModels"
Id="Key"
Text="Name"
Child="@("Children")"
Selected="Selected"
Expanded="Expanded">
</TreeViewFieldsSettings>
</EjsTreeView>
@
code
{
public ReadOnlyObservableCollection<FileInfoViewModel> FileInfoViewModels;

private readonly CompositeDisposable cleanup = new CompositeDisposable();

protected override void OnInitialized()
{
base.OnInitialized();

var tree = FileSystemService.FileInfoTree;
tree.Bind(out FileInfoViewModels)
.DisposeMany()
.Subscribe()
.DisposeWith(cleanup);
}

public void Dispose()
{
cleanup.Dispose();
}
}
```

FileInfoViewModel.cs
```
public class FileInfoViewModel : ReactiveObject, IDisposable
{
private readonly CompositeDisposable cleanup = new CompositeDisposable();

public string Key { get; }
public string Name => FileInfo.Name;
public Optional<FileInfoViewModel> Parent { get; }
public VirtualFileInfo FileInfo { get; }

[Reactive]
public bool Expanded { get; set; }
[Reactive]
public bool Selected { get; set; }

private ReadOnlyObservableCollection<FileInfoViewModel> children;
public ReadOnlyObservableCollection<FileInfoViewModel> Children => children;

internal FileInfoViewModel(Node<VirtualFileInfo, string> node, FileInfoViewModel parent = null)
{
Key = node.Key;
Parent = parent;
FileInfo = node.Item;

var childrenLoader = new Lazy<IDisposable>(() =>
node.Children
.Connect()
.Transform(e => new FileInfoViewModel(e, this))
.Bind(out children)
.DisposeMany()
.Subscribe());

var shouldExpand = node.IsRoot
? Observable.Return(true)
: Parent.Value.WhenAnyValue(x => x.Expanded);

shouldExpand
.Where(isExpanded => isExpanded)
.Take(1)
.Subscribe(_ => childrenLoader.Value.DisposeWith(cleanup))
.DisposeWith(cleanup);
}

public void Dispose()
{
cleanup.Dispose();
}
}
```

FileSystemService (partial)
```
public IObservableCache<VirtualFileInfo, string> FileInfos => fileInfoSourceCache.AsObservableCache();

public IObservable<IChangeSet<FileInfoViewModel, string>> FileInfoTree =>
FileInfos
.Connect()
.TransformToTree(fileInfo => Path.GetDirectoryName(fileInfo.VirtualPath),
Observable.Return<Func<Node<VirtualFileInfo, string>, bool>>(node => node.IsRoot))
.Transform(node => new FileInfoViewModel(node));
```

If you are asking why I don't use the `FileManager` because I don't want the `FileManager` communicate with Ajax and it cannot accept local datas.


Shameer Ali Baig Sulaiman Ali Baig [Syncfusion]
Replied On January 28, 2020 11:53 AM UTC

Hi Simon, 
 
Greetings from Syncfusion support. 
 
We have checked your attached code snippet. We suspect that the reported issue might have occurred due to the TreeView fields are not properly mapped in your application. Can you please ensure the data source contains the proper TreeView fields (Key, Name, Children, Selected, Expanded)?  
 
We have prepared a simple TreeView sample using observable collection. 
 
 
If the issue still persists in your end. Then, share additional details regarding your requirement?  
 
 
1.                Code snippet for returning data source structure. 
 
2.                If possible, reproduce the issue in attached sample. 
This information would help us to understand your requirement and to provide the prompt solution. 
 
Please let us know, if you need any further assistance. 
 
Regards, 
Shameer Ali Baig S. 


Simon
Replied On February 5, 2020 09:44 PM UTC

Figured out that all data applied to Items="@..." are de-/serialized as json and passing between javascript and blazor. That's why my models was showing as nulls because it was not a valid model for json serializers.
Please consider it on the documentations that all types are passing to Ejs{component} has to be like DTO types that can be de-/serialized as json.

Shameer Ali Baig Sulaiman Ali Baig [Syncfusion]
Replied On February 7, 2020 04:03 AM UTC

Hi Simon, 
  
We are validating your query with high priority. We will update the further validation details in one business day on 7th February 2020. 
  
We appreciate your patience until, then. 
  
Regards, 
Shameer Ali Baig S. 


CONFIRMATION

This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

Please sign in to access our forum

This page will automatically be redirected to the sign-in page in 10 seconds.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon

Live Chat Icon For mobile
Live Chat Icon