Search code examples
blazorblazor-client-sideblazor-webassemblyblazorise

Blazorise DataGrid not Rendering Properly


I am unable to get the Blazorise data grid to render properly. I have included the bits in the gist, the json gets loaded, but not rendered in the grid. Here is the gist:

https://gist.github.com/bbqchickenrobot/9af26063108beb4acb75e9a9dc5b4ae0


Solution

  • I test your code and completed the missed ones and the data is displayed properly in the dataGrid.

    The issue is your json data is in camelCase and you use PascalCase in the model. Modify your class model as given below:

    using System;
    using System.ComponentModel.DataAnnotations;
    using System.Text.Json.Serialization;
    
    namespace Workflows.Blazo.Models
    {
        public class ApplicantViewModel
        {
            [Key]
             [JsonPropertyName("id")]
            public Guid Id { get; set; }
            [JsonPropertyName("firstname")]
            public string Firstname { get; set; }
              [JsonPropertyName("middlename")]
            public string Middlename { get; set; }
             [JsonPropertyName("lastname")]
            public string Lastname { get; set; }
            public DateTime? Dob { get; set; }
             [JsonPropertyName("emailAddress")]
            public string EmailAddress { get; set; }
            public string PhoneNumber { get; set; }
            public string EmployeeNumber { get; set; }
             [JsonPropertyName("offerDate")]
            public DateTime? OfferDate { get; set; }
             [JsonPropertyName("department")]
            public string department { get; set; }
             [JsonPropertyName("classificaiton")]
            public string Classificaiton { get; set; }
             [JsonPropertyName("createdDate")]
            public DateTime? CreatedDate { get; set; }
             [JsonPropertyName("modifiedDate")]
            public DateTime? ModifiedDate { get; set; }
    
          
        }
    }
    

    I removed ReadData="@OnReadData" based on the considerations here otherwise you have to do all the loading, filtering and sorting of the data.

    Here a snapshot of the gridview: enter image description here