data dont show in grid

[ebi torabi]

in hosted core blazor data is taken from the database but in the grid. Of course, in your example , the data is displayed, but the next two example will not be displayed.

@page "/"

@inject HttpClient Http

@using Syncfusion.EJ2.Blazor

@using Syncfusion.EJ2.Blazor.Grids

<h1>Hello, world!</h1>

Welcome to your new app.

<EjsGrid ID="Grid" Allowpaging="true">

    <EjsDataManager Url="https://ej2services.syncfusion.com/production/web-services/api/Orders" Adaptor="Adaptors.WebApiAdaptor"></EjsDataManager>

    <GridColumns>

        <GridColumn Field="OrderID" HeaderText="Order ID" IsPrimaryKey="true" TextAlign="@TextAlign.Right" Width="120"></GridColumn>

        <GridColumn Field="CustomerID" HeaderText="Customer Name" Width="150"></GridColumn>

        <GridColumn Field="OrderDate)" HeaderText=" Order Date" Format="yMd" Type="date" TextAlign="@TextAlign.Right" Width="130"></GridColumn>

        <GridColumn Field="Freight" HeaderText="Freight" Visible="false" Format="C2" TextAlign="@TextAlign.Right" Width="120"></GridColumn>

        <GridColumn Field="ShipCountry" HeaderText="Ship Country" Width="150"></GridColumn>

    </GridColumns>

</EjsGrid>

<SurveyPrompt Title="How is Blazor working for you?" />

<p>jbgjhjhjhikjijhik</p>

<EjsGrid ID="Grid1" Allowpaging="true" @ref="@grid" >

    <EjsDataManager Url="/api/TemperamentPropertiesCategory1" Adaptor="Adaptors.WebApiAdaptor"></EjsDataManager>

    <GridColumns>

        <GridColumn Field="TemperamentPropertyCategoryId" HeaderText="Order ID" IsPrimaryKey="true" TextAlign="@TextAlign.Right" Width="120"></GridColumn>

        <GridColumn Field="TemperamentPropertyCategoryName" HeaderText="Customer Name" Width="150"></GridColumn>

    </GridColumns>

</EjsGrid>

<EjsGrid ID="Grid2" Allowpaging="true" >

    <EjsDataManager Json="@temperlist" Adaptor="Adaptors.JsonAdaptor"></EjsDataManager>

    <GridColumns>

        <GridColumn Field=@nameof(HerbalTeas.HerbalTeaId ) HeaderText="Order ID" IsPrimaryKey="true" TextAlign="@TextAlign.Right" Width="120"></GridColumn>

        <GridColumn Field=@nameof(HerbalTeas.HerbalTeaName) HeaderText="Customer Name" Width="150"></GridColumn>

    </GridColumns>

</EjsGrid>

@code {

    EjsGrid grid;

    HerbalTeas[] temperlist;

    protected override async Task OnInitAsync()

    {

       

        temperlist = await Http.GetJsonAsync<HerbalTeas[]>("api/HerbalTeas/GetAll");

    }

}

---------------------------------------------------------------------------------------------------------------------------

[controller]

using System;

using System.Collections.Generic;

using System.Linq;

using System.Threading.Tasks;

using Microsoft.AspNetCore.Http;

using Microsoft.AspNetCore.Mvc;

using Microsoft.Extensions.Primitives;

using Newsha.Server.DataAccess.UnitOfWork;

using Newsha.Shared.Models;

namespace Newsha.Server.Controllers

{

    [Route("api/[controller]")]

    [ApiController]

    public class TemperamentPropertiesCategory1Controller : ControllerBase

    {

        private UnitOfWork _UW = new UnitOfWork();

        [HttpGet]

        public object Get()

        {

            IEnumerable<TemperamentPropertiesCategory> data = _UW.TemperamentPropertiesCategory.FindAll(); ;

            var count = data.Count();

            var queryString = Request.Query;

            if (queryString.Keys.Contains("$inlinecount"))

            {

                StringValues Skip;

                StringValues Take;

                int skip = (queryString.TryGetValue("$skip", out Skip)) ? Convert.ToInt32(Skip[0]) : 0;

                int top = (queryString.TryGetValue("$top", out Take)) ? Convert.ToInt32(Take[0]) : data.Count();

                return new { Items = data.Skip(skip).Take(top), Count = count };

            }

            else

            {

                return data;

            }

              

        }

        // GET: api/Default/5

        [HttpGet("{id}", Name = "Get")]

        public async Task<object> Get(int id)

        {

            return await _UW.TemperamentPropertiesCategory.FindByIDAsync(id);

        }

        // POST: api/Default

        [HttpPost]

        public async Task Post([FromBody] TemperamentPropertiesCategory TemperamentPropertiesCategory)

        {

            if (ModelState.IsValid)

            {

                await _UW.TemperamentPropertiesCategory.CreateAsync(TemperamentPropertiesCategory);

                await _UW.Commit();

            }

        }

        

        // PUT: api/Default/5

        [HttpPut]

        public async Task Put([FromBody] TemperamentPropertiesCategory TemperamentPropertiesCategory)

        {

            if (ModelState.IsValid)

            {

                _UW.TemperamentPropertiesCategory.Update(TemperamentPropertiesCategory);

                await _UW.Commit();

            }

        }

        

        // DELETE: api/ApiWithActions/5

        [HttpDelete("{id}")]

        public async Task Delete([FromBody] TemperamentPropertiesCategory TemperamentPropertiesCategory)

        {

            if (ModelState.IsValid)

            {

                _UW.TemperamentPropertiesCategory.Delete(TemperamentPropertiesCategory);

                await _UW.Commit();

            }

        }

       

    }

}

[Vignesh Natarajan]

Hi Edi Torabi,  

Thanks for contacting Syncfusion forums.  

Query: “n hosted core blazor data is taken from the database but in the grid. Of course, in your example , the data is displayed, but the next two example will not be displayed.” 

From your query we understand that you are facing issue while binding the dataSource to Grid from WebAPI controller. We have prepared a sample as per your suggestion and we are not able to reproduce the reported issue at our end. But you have mentioned that Data is not displayed in Grid.  

We suspect that blank rows are rendered in Grid due to camel case issue. This issue occurred when serializing the return values. For WebAPI Adaptor data must be retuned in form of Items and Count. But in Asp.NetCore while serializing it gets converted into items and count. This may be the cause of an issue. If you are facing above issue, kindly include the below code example in your startup.cs file.  

public void ConfigureServices(IServiceCollection services) 

        { 

            services.AddMvc().AddNewtonsoftJson(); 

            services.AddMvc().AddNewtonsoftJson(options => { 

                options.SerializerSettings.ContractResolver = new DefaultContractResolver(); 

            }); 

            …………………………………. 

        } 

 

For your convenience we have attached the sample which can be downloaded from below  

Sample: https://www.syncfusion.com/downloads/support/directtrac/145880/ze/EFGrid_-_CRUD_-_P61253481616  

After try out the above solution, if you are still facing the issue kindly share the following details.  

1. Share the screenshot of network tab, how the dataSource is returned from webAPI?.
2. Screenshot of script error in console with full tack trace (if any).
3. If possible try to reproduce the reported issue at our end.

For the Third Grid, you have used Json Adaptor to bind the dataSource as local data from WebAPI controller. Can you please share the following details along with above details. 

4. Share the GetAll() method in controller along with its return type. Because while binding local data, entire dataSource must be returned to Grid.
5. If you are facing  any script error in console. Kindly share the screenshot of the issue.

   

Requested details will be helpful for us to validate the reported issue at our end and provide the solution as soon as possible. 

Regards, 

Vignesh Natarajan. 

[ebi torabi]

Hi Edi Torabi,  

Thanks for contacting Syncfusion forums.  

Query: “n hosted core blazor data is taken from the database but in the grid. Of course, in your example , the data is displayed, but the next two example will not be displayed.” 

From your query we understand that you are facing issue while binding the dataSource to Grid from WebAPI controller. We have prepared a sample as per your suggestion and we are not able to reproduce the reported issue at our end. But you have mentioned that Data is not displayed in Grid.  

We suspect that blank rows are rendered in Grid due to camel case issue. This issue occurred when serializing the return values. For WebAPI Adaptor data must be retuned in form of Items and Count. But in Asp.NetCore while serializing it gets converted into items and count. This may be the cause of an issue. If you are facing above issue, kindly include the below code example in your startup.cs file.  

public void ConfigureServices(IServiceCollection services) 

        { 

            services.AddMvc().AddNewtonsoftJson(); 

            services.AddMvc().AddNewtonsoftJson(options => { 

                options.SerializerSettings.ContractResolver = new DefaultContractResolver(); 

            }); 

            …………………………………. 

        } 

 

For your convenience we have attached the sample which can be downloaded from below  

Sample: https://www.syncfusion.com/downloads/support/directtrac/145880/ze/EFGrid_-_CRUD_-_P61253481616  

After try out the above solution, if you are still facing the issue kindly share the following details.  

1. Share the screenshot of network tab, how the dataSource is returned from webAPI?.
2. Screenshot of script error in console with full tack trace (if any).
3. If possible try to reproduce the reported issue at our end.

For the Third Grid, you have used Json Adaptor to bind the dataSource as local data from WebAPI controller. Can you please share the following details along with above details. 

4. Share the GetAll() method in controller along with its return type. Because while binding local data, entire dataSource must be returned to Grid.
5. If you are facing  any script error in console. Kindly share the screenshot of the issue.

   

Requested details will be helpful for us to validate the reported issue at our end and provide the solution as soon as possible. 

Regards, 

Vignesh Natarajan. 

 https://www.syncfusion.com/downloads/support/directtrac/145880/ze/EFGrid_-_CRUD_-_P61253481616  

hi. Thanks for your prompt reply .

I went through your example, but when I installed Microsoft.EntityFrameworkCore and Microsoft.EntityFrameworkCore.SqlServer on Newsha.Shared, I encountered the following error(Attached txt file).

Newsha.Server.Startup----------------------------------------------------------------------

 public void ConfigureServices(IServiceCollection services)

        {

            services.AddMvc().AddNewtonsoftJson();

            services.AddMvc().AddNewtonsoftJson(options => {

                options.SerializerSettings.ContractResolver = new DefaultContractResolver();

            });

            services.AddResponseCompression(opts =>

            {

                opts.MimeTypes = ResponseCompressionDefaults.MimeTypes.Concat(

                    new[] { "application/octet-stream" });

            });

        }

-----------------------------------------------------------------------

Attachment: New_folder_5e75d5c4.rar

[ebi torabi]

For the Third Grid, you have used Json Adaptor to bind the dataSource as local data from WebAPI controller. Can you please share the following details along with above details

hi. Thanks for your prompt reply .

Newsha.Server =>Startup---------------------------------------------

 public void ConfigureServices(IServiceCollection services)

        {

            services.AddMvc().AddNewtonsoftJson();

            services.AddMvc().AddNewtonsoftJson(options => {

                options.SerializerSettings.ContractResolver = new DefaultContractResolver();

            });

            services.AddResponseCompression(opts =>

            {

                opts.MimeTypes = ResponseCompressionDefaults.MimeTypes.Concat(

                    new[] { "application/octet-stream" });

            });

        }

controller -----------------------------------------------------------

[HttpGet]

        public object Get()

        {

            IEnumerable<TemperamentPropertiesCategory> data = _UW.TemperamentPropertiesCategory.FindAll(); ;

            var count = data.Count();

            var queryString = Request.Query;

            if (queryString.Keys.Contains("$inlinecount"))

            {

                StringValues Skip;

                StringValues Take;

                int skip = (queryString.TryGetValue("$skip", out Skip)) ? Convert.ToInt32(Skip[0]) : 0;

                int top = (queryString.TryGetValue("$top", out Take)) ? Convert.ToInt32(Take[0]) : data.Count();

                return new { Items = data.Skip(skip).Take(top), Count = count };

            }

            else

            {

                return data;

            }

              

        }

index.razor--------------------------------------------------

@if (temperlist != null)

{

    <p>@temperlist.Count()</p>}

<EjsDropDownList ID="Employees12" PlaceHolder="Select a Employee" AllowFiltering="true" >

    <EjsDataManager Json="@temperlist"  Adaptor="@Syncfusion.EJ2.Blazor.Adaptors.JsonAdaptor"></EjsDataManager>

    <DropDownListFieldSettings Value="TemperamentPropertyCategoryName"></DropDownListFieldSettings>

</EjsDropDownList>

@code {

    EjsGrid grid;

    public string Query { get; set; } = "new ej.data.Query().select(['TemperamentPropertyCategoryName']).take(7).requiresCount()";

    TemperamentPropertiesCategory[] temperlist;

    protected override async Task OnInitAsync()

    {

        temperlist = await Http.GetJsonAsync<TemperamentPropertiesCategory[]>("api/TemperamentPropertiesCategory1");

        

    }

}

[Vignesh Natarajan]

Hi Ebi Torabi,  

Thanks for the details.  

Query: “I went through your example, but when I installed Microsoft.EntityFrameworkCore and Microsoft.EntityFrameworkCore.SqlServer on Newsha.Shared, I encountered the following error(Attached txt file).” 

We have analyzed the provided script error and it is not related to Gird component issue. The reported issue has occurred due to IL linker issue in Blazor component. To resolve the issue kindly include the below highlighted link in your client [.csproj] file. 

<PropertyGroup> 

    <TargetFramework>netstandard2.0</TargetFramework> 

    <OutputType>Exe</OutputType> 

    <LangVersion>7.3</LangVersion> 

    <RazorLangVersion>3.0</RazorLangVersion> 

    <BlazorLinkOnBuild>False</BlazorLinkOnBuild> 

  </PropertyGroup> 

   

Please find some general link regarding the issue you are facing.  

https://github.com/mono/mono/issues/12916  

Note: ensure the clear the project and also to remove bin and Obj file in your project. Then, try to run again sample with above highlighted code. If you are still facing the issue, kindly share the Network tab details regarding the data returned from API server. 

Please get back to us if you have further queries.  

Regards, 

Vignesh Natarajan.