JsonConvert System.ArgumentNullException : 'Value cannot be null. Arg_ParamName_Name'

Question

Hi, I tried to do the tree view structure.
The code behind is

  public string TreeViewJSON { get; set; }  
  
        public void OnGet()  
        {  
            List<TreeViewNode> nodes = new List<TreeViewNode>();  
  
            //Loop and add the Parent Nodes.  
          foreach (FilePathP type in context.FilePathPs)  
          {  
                nodes.Add(new TreeViewNode { id = type.Id.ToString(), parent = "#",text = type.Name});  
  
          }  
  
            //Loop and add the Child Nodes.  
            foreach(FilePathP subtype in context.FilePathPs)  
            {  
                nodes.Add(new TreeViewNode { id = subtype.OrgLevel.ToString() + "-" + subtype.Id.ToString() ,  
                parent = subtype.OrgLevel.ToString(), text = subtype.Name});  
            }  
  
            // Serialize to JSON string.  
             this.TreeViewJSON = JsonConvert.SerializeObject(nodes);  
  
        }  
  
        public void OnPostSubmit(string selectedItems)  
        {  
            List<TreeViewNode> items = JsonConvert.DeserializeObject<List<TreeViewNode>>(selectedItems);  
        }  

The data come from the sql view

I received this message :
I don't understand why I received this message because the list not null.

Have you an idea about this message and how I can solve it?

one thing that is disturbing is that I have the node counter set to 68 and it displays null values from [68] to [127]

Answer 1

@Farid Uddin Kiron MSFT

The applicationDbContext

    public class ApplicationDbContext : DbContext  
    {  
        public ApplicationDbContext(DbContextOptions<ApplicationDbContext> options) : base(options)  
        { }  
  
        public DbSet<wSerie> wSeries { get; set; }  
        public DbSet<wPreliminaire> wPreliminaires { get; set; }  
        public DbSet<FileTableRoot> FileTableRoot { get; set; }  
        public DbSet<FileTableFilePath> FileTableFilePaths { get; set; }  
        public DbSet<FilePath> FilePaths { get; set; }  
        public DbSet<FilePathP> FilePathPs { get; set; }  
  
        protected override void OnModelCreating(ModelBuilder modelBuilder)  
        {  
            modelBuilder.Entity<wSerie>().HasNoKey().ToTable("wSerie", t => t.ExcludeFromMigrations());  
            modelBuilder.Entity<wPreliminaire>().HasNoKey().ToTable("wPreliminaire", t => t.ExcludeFromMigrations());  
            modelBuilder.Entity<FileTableRoot>().HasNoKey().ToTable("FileTableRoot", t => t.ExcludeFromMigrations());  
            modelBuilder.Entity<FileTableFilePath>().HasNoKey().ToTable("FileTableFilePath", t => t.ExcludeFromMigrations());  
            modelBuilder.Entity<FilePath>().HasNoKey().ToTable("FilePath", t => t.ExcludeFromMigrations());  
            modelBuilder.Entity<FilePathP>().HasNoKey().ToTable("FilePathP", t => t.ExcludeFromMigrations());  
            base.OnModelCreating(modelBuilder);  
        }  
    }  

The FilePathP is come from the sqlView with the definition.

In addition as seen on type.Name a getting the null value which causing the error.

The type.Name is not NULL the value is annulé and the Type = NULL because it's repository

I think I try to change foreach (FilePathP type in context.FilePathPs) by foreach (FilePathP genre in context.FilePathPs) ==> I tried it ; it does not change anything but it avoids the mistakes of interpretation

I added the break point to see TreeViewJSON the result seems OK at the line 11 the resultat is

Answer 2

If we look back at your previous posts, you changed the front-end API from the jQuery DataTable to the jQuery jstree. The jstree uses a hierarchical object model while the DataTable is tabular or flat. You'll must update the server side logic to work with the jstree object model. You've completed this type of exercise with the jQuery DataTable.

Secondly, you are dropping code on the forum where the logic does not make sense and you did not explain how you expect the code to work. All the community sees is confusing code.

As recommended many times in your previous posts, you must learn the APIs you select for your projects. Do not drop aimlessly designed code drop the code on the forum then expect the community to figure out what you're thinking. We cannot read your mind.

Anyway, you have a lot of refactoring to do since you've changed to a new API.

Edit: The jstree site has several examples. One is a file explorer. Your new design will use AJAX to fetch the directory nodes not a form post as your latest example.

https://www.jstree.com/demo/
https://www.jstree.com/demo_filebrowser/index.php

Answer 3

you changed the front-end API from the jQuery DataTable to the jQuery jstree

No, I didn't want change jQuery DataTable to the jQuery jstree.

I just want use jQuery jsTree to populate dropdown box with the directories and after that use the value of directories to parse in search bow to filter in DataTAble.
It's my logic! I guess this is not the best way to do it.

The problem remains why I have null values when in my Name column there are no null values

Anyway, you have a lot of refactoring to do since you've changed to a new API.

I didn't change the API

The jstree uses a hierarchical object model while the DataTable is tabular or flat

I guess you remember that I use the File Table and is structured as tree view.

Answer 4

I've put the break point and you can see that the value of selectedItems is null

After I check on devtools and the selectedItems it's not null

Have you an idea about it?

Answer 5

I'm baffled. The community has asked you several times to provide the value of selectedItems which is the main problem yet you do not share the value. Why?

Due to the nonsensical design, the best I can do is create a code sample that focuses on the submitting a JSON string stored in a hidden form field. Click the submit button to submit the form. Finally, deserialize the JSON string into a List<TreeViewNode>.

Model

    public class TreeViewNode  
    {  
        public string id { get; set; }  
        public string parent { get; set; }  
        public string text { get; set; }  
    }  

Code

using Microsoft.AspNetCore.Mvc;  
using Microsoft.AspNetCore.Mvc.RazorPages;  
using RazorPagesBasicDemo.Models;  
  
namespace RazorPagesBasicDemo.Pages  
{  
    public class SimpleSerializationModel : PageModel  
    {  
        public void OnGet()  
        {  
            Nodes = new List<TreeViewNode>()  
            {  
                new TreeViewNode()  
                {  
                    id = "1",  
                    parent = "",  
                    text = "Root"  
                },  
                new TreeViewNode()  
                {  
                    id = "2",  
                    parent = "Root",  
                    text = "Folder1"  
                },  
            };  
        }  
  
        public void OnPost(string selectedItems)  
        {  
            Nodes = System.Text.Json.JsonSerializer.Deserialize<List<TreeViewNode>>(selectedItems);             
        }  
  
  
        [BindProperty]  
        public List<TreeViewNode>? Nodes { get; set; }  
    }  

Markup

@page   
@model RazorPagesBasicDemo.Pages.SimpleSerializationModel  
@{  
}  
  
<div class="container">  
    <form method="post">  
        <input type="hidden" name="selectedItems" id="selectedItems" />  
        <input type="submit" value="Submit" asp-page-handler="Submit" />  
    </form>  
</div>  

Script

    var json = @Html.Raw(System.Text.Json.JsonSerializer.Serialize(Model.Nodes));  
    document.getElementById("selectedItems").value = JSON.stringify(json);  
    console.log(json);  

Paylaod

selectedItems: [{"id":"1","parent":"","text":"Root"},{"id":"2","parent":"Root","text":"Folder1"}]  

Keep in mind, this design will not solve your programming problem.