1. Home
  2. Forum
  3. ASP.NET Core - EJ 2
  4. Grid does not display data

Grid does not display data

Good day,
on the page I want to use the parent Grid, the sub-grid with detailed information is displayed when selecting a line for the user.

Sub-Grid is embedded in Tab.

The problem is that data is not displayed in the sub-grid.
As can be seen in the attached picture, detailed data is loaded correctly.

Where could be a mistake?
screen

Well thank you.

Attachment: Grid_b457c528.zip

5 Replies
VA Venkatesh Ayothi Raman Syncfusion Team September 3, 2018 04:57 AM UTC

Hi Patrik, 

Thanks for using Syncfusion products. 

We suspect that you are facing serialization problem. To render the Grid data, column’s field names and the property name in the data source should be same. After that Grid will be rendered with data. Due to serialization problem, your field name’s casing is changed and so there is a mismatch in the column’s field and datasource’s property names, this is why you don’t have data in Grid.  

To overcome this serialization problem, we suggest you to add the JsonOutputFormatter options under the Startup.cs file. JsonOutputFormatter is a TextOutputFormatter for JSON content. Please refer the sample below, 

Index.cshtml 
 
    <ejs-grid id="Grid1" allowPaging="true"> 
        <e-data-manager url="/api/Orders/" adaptor="WebApiAdaptor" crossDomain="true"></e-data-manager>  //Remove offline property 
        ... 
   </ejs-grid> 

Startup.cs 

public void ConfigureServices(IServiceCollection services) 
        { 
            // Add framework services. 
            services.AddMvc().AddJsonOptions(options => 
            { 
                options.SerializerSettings.ContractResolver = new Newtonsoft.Json.Serialization.DefaultContractResolver(); 
            }); 
        } 

Please get back to us if you need further assistance. 


Regards, 
Venkatesh Ayothiraman. 


PV Patrik Volka replied to Venkatesh Ayothi Raman September 4, 2018 04:28 PM UTC

Hi Patrik, 

Thanks for using Syncfusion products. 

We suspect that you are facing serialization problem. To render the Grid data, column’s field names and the property name in the data source should be same. After that Grid will be rendered with data. Due to serialization problem, your field name’s casing is changed and so there is a mismatch in the column’s field and datasource’s property names, this is why you don’t have data in Grid.  

To overcome this serialization problem, we suggest you to add the JsonOutputFormatter options under the Startup.cs file. JsonOutputFormatter is a TextOutputFormatter for JSON content. Please refer the sample below, 

Index.cshtml 
 
    <ejs-grid id="Grid1" allowPaging="true"> 
        <e-data-manager url="/api/Orders/" adaptor="WebApiAdaptor" crossDomain="true"></e-data-manager>  //Remove offline property 
        ... 
   </ejs-grid> 

Startup.cs 

public void ConfigureServices(IServiceCollection services) 
        { 
            // Add framework services. 
            services.AddMvc().AddJsonOptions(options => 
            { 
                options.SerializerSettings.ContractResolver = new Newtonsoft.Json.Serialization.DefaultContractResolver(); 
            }); 
        } 

Please get back to us if you need further assistance. 


Regards, 
Venkatesh Ayothiraman. 


Thanks for the help, the details are displayed in detail grid, but I encountered another problem.

Detail Grid does not display data by query, it displays all records from the entity.
I have a query to view specific records as follows:

function selectRow(args) {
        var tab1Grid = document.getElementById('tranAccessGrid').ej2_instances[0];
        if (args.data !== undefined) {
            new ej.data.DataManager({
                url: '/api/acctranslation/',
                adaptor: new ej.data.WebApiAdaptor(),
                crossDomain: true
            }).executeQuery(new ej.data.Query().where('ParentAccessoryID', 'equal', args.data.ID).take(3)).then((e) => {
                tab1Grid.dataSource = e.result;
                tab1Grid.refresh();
                document.getElementById('tabDiv').style.display = 'block';
                alert(args.data.ID);
            });
        }
    }

VA Venkatesh Ayothi Raman Syncfusion Team September 5, 2018 09:29 AM UTC

Hi Patrik, 

We have analyzed your query and code example you have shared with us. We suspect that the cause of the issue is that you haven’t handled the filtering query at the server side. We suggest you handle the query at server side to overcome your problem. Please refer the code example below, 
 
[Index.cshtml] 
 
<script> 
    function selectRow(args) { 
        ... 
       if (args.data !== undefined) { 
            new ej.data.DataManager({ 
               url: '/api/Orders/', 
                adaptor: new ej.data.WebApiAdaptor() 
            }).executeQuery(new ej.data.Query().where('ParentAccessoryID', 'equal', args.data.OrderID).take(3)).then((e) => { 
                ... 
           }); 
        } 
    } 
</script> 
 
[OrdersController.cs] 
 
        public object Get() 
        { 
            var queryString = Request.Query; 
            var data = OrdersDetails.GetAllRecords().ToList(); 
            ... 
           string filter = queryString["$filter"];  //filtering 
            if (filter != null) 
            { 
                var newfiltersplits = filter; 
                var filtersplits = newfiltersplits.Split('(', ')', ' '); 
                var filterfield = filtersplits[0]; 
                var filtervalue = filtersplits[2]; 
                switch (filterfield) 
                { 
                    case "ParentAccessoryID": 
 
                        data = (from cust in data 
                                where cust.ParentAccessoryID.ToString() == filtervalue.ToString() 
                                select cust).ToList(); 
                        break; 
                } 
            } 
            return take != 0 ? new { Items = data.Skip(skip).Take(take).ToList(), Count = data.Count() } : new { Items = data, Count = data.Count() }; 
       } 
 

We have also created a sample based on this requirement. Please download the sample from the link below, 
 
Please get back to us if you need further assistance. 

Regards, 
Venkatesh Ayothiraman. 


PV Patrik Volka September 5, 2018 01:43 PM UTC

Thank you, it works flawlessly

VA Venkatesh Ayothi Raman Syncfusion Team September 6, 2018 03:43 AM UTC

Hi Patrik, 

Thanks for the feedback. 

We are very happy to hear that your requirement is achieved.  

Regards, 
Venkatesh Ayothiraman. 


Loader.
Up arrow icon