Dynamic Grid with DataTable

[Robert Madrian]

Hello,

It seems that there is no Extension method in Kendo.Mvc.Extensions for MVC Core to use Dynamic Grid with DataTable?

"DataTable" does not contain a definition for "ToDataSourceResult", and the overloading of the optimal extension method "QueryableExtensions.ToDataSourceResult (IEnumerable, DataSourceRequest)" requires an IEnumerable

how to use a datatable in ASP.NET MVC Core Version of the grid?

 

public ActionResult Read([DataSourceRequest] DataSourceRequest request)
        {
            DataTable products = Products();

            return Json(products.ToDataSourceResult(request));
        }

 

@(Html.Kendo().Grid<dynamic>()
                          .Name("Grid")
                          .Columns(columns =>
                          {
                              foreach (System.Data.DataColumn column in Model.Columns)
                              {
                                  var c = columns.Bound(column.ColumnName);

                              }
                          })
                          .Pageable()
                          .Sortable()
                          .Filterable()
                          .Groupable()
                          .DataSource(dataSource => dataSource
                              .Ajax()
                              .Model(model =>
                              {
                                  var id = Model.PrimaryKey[0].ColumnName;
                                  model.Id(id);
                                  foreach (System.Data.DataColumn column in Model.Columns)
                                  {
                                      var field = model.Field(column.ColumnName, column.DataType);
                                      if (column.ColumnName == id)
                                      {
                                          field.Editable(false);
                                      }

                                  }
                              })
                              .Read(read => read.Action("Read", "Home"))
                          )
                )

[Stefan]

Hello Robert,

Previously the ASP.NET Core does not support DataTables, but currently, they are considering adding it.

Please refer to the following resources for more information:

https://blogs.msdn.microsoft.com/dotnet/2016/02/10/porting-to-net-core/

https://github.com/dotnet/corefx/issues/8622

Once ASP.NET Core allows using the DataTables please log a request in our feedback portal and if possible we will add the support for the Kendo UI ASP.NET Core Grid:

http://kendoui-feedback.telerik.com/forums/127393-kendo-ui-feedback

Regards,
Stefan
Telerik by Progress

[Robert Madrian]

Hi Stefan,

what are my options now - I'm using ASP.NET Core with the target framework Net 4.6.2 and have the need to dynamically generate the grid because of using a "query generator"

or does it mean I cannot use telerik grid now for that purpose also with target framework Net 4.6.2?
(workaround?)

robert

[Stefan]

Hello Robert,

As mentioned in the previous reply the current issue is not directly related to the Kendo UI Grid as it is based on the ASP.NET Core support of DataTables.

In general, the MVC Grid can be dynamically bound to columns using the two approaches with DataTables and a list of dynamic objects:

http://www.telerik.com/support/code-library/binding-to-a-collection-of-dynamic-objects

As the ASP.NET Core support for these features is changed, the Kendo UI team currently cannot affect their implementation.

Regards,
Stefan
Telerik by Progress

[Robert Madrian]

Hi,

OK, so with the MVC Core Version it is not possible to use DataTable until NET.Standard 2.0 is released...

But is there no other possibility to create a Kendo Grid (Javascript not MVC?) with dynamic columns without datatable (only read Only no data change is necessary)?

Background: we use a query builder which generates SQL Code which we have to execute and Display the results in the Kendo grid...

[Stefan]

Hello Robert,

I can suggest checking the following thread containing a runnable example which demonstrates how to generate the columns dynamically based on the data:

http://www.telerik.com/forums/binding-kendoui-grid-to-dynamic-column-and-values-kendo-ui-complete-resources-buy-try

Also, an array can be generated in a variable and then this variable can be used for the Grid columns. If the columns have to be changed at runtime programmatically, the setOptions method can be used:

http://jsfiddle.net/darrenarbell/4HTEr/

http://docs.telerik.com/kendo-ui/api/javascript/ui/grid#methods-setOptions

Regards,
Stefan
Telerik by Progress

[Robert Madrian]

it works with .Columns(columns => columns.AutoGenerate(true))

robert

[Patricio]

Hello, 

Can i create a dynamic kendo grid with asp.net core? How can i do it? I need to pass a list of grid's style and another list of data...

I have the same problem because i can't use datatable with the extension "ToDataSourceResult"

[Stefan]

Hello, Patricio,

A dynamic Grid can be created using the Kendo UI for ASP.NET Core Grid.

Please advise the issues that occur with the suggested approach using the AutoGenerate property?

Also, the jQuery approach can be used if there is a limitation with the ASP.NET Core Grid:

https://www.telerik.com/blogs/dynamic-data-in-the-kendo-ui-grid

If additional assistance is needed, please provide more details about the current implementation, so we can provide information best suited for it.

Regards,
Stefan
Progress Telerik

[Patricio]

Hello Stefan, 

I have this code: 

 

public IActionResult DynamicGrid([DataSourceRequest] DataSourceRequest request)
        {
            DataTable dt = GetQuery();

            return Json(dt);
        }

 

@model System.Data.DataTable

<div>
       @(Html.Kendo().Grid<dynamic>()
        .Name("DynamicGrid")
        .Columns(c =>
        {

            foreach (System.Data.DataColumn column in Model.Columns)
            {
                c.Bound(column.ColumnName);
            }


        })
        .Pageable()
        .Sortable()
        .Filterable()
        .Scrollable()
        .DataSource(ds => ds
        .Ajax()
        .Model(model =>
        {
            foreach (System.Data.DataColumn column in Model.Columns)
            {
                model.Field(column.ColumnName, column.DataType);
            }

        })
        .PageSize(100)
        .Read(r => r.Action("DynamicGrid", "Grilla"))
        ))

</div>

 

Patricio

[Stefan]

Hello, Patricio,

Thank you for the code.

This approach is requiring DataTables, and as mentioned earlier in the thread, using DataTables for the Kendo UI Grid for ASP.NET Core is currently not supported.

The columns.AutoGenerate(true) approach can be used in an ASP.NET Core application.

I can also suggest checking the LoadSettings approach:

https://demos.telerik.com/aspnet-core/grid/columnsettings

Regards,
Stefan
Progress Telerik

[Alex Hajigeorgieva]

Hi, Patricio,

I am pleased to let you know that since 16th May 2018 binding to DataTables is supported for ASP.NET Core projects - i.e. R2 2018:

https://github.com/telerik/kendo-ui-core/issues/2140#issuecomment-384630376

Kind Regards,
Alex Hajigeorgieva
Progress Telerik

[Robert Madrian]

I know - Thank you

[Alex Hajigeorgieva]

Hello, Robert,

I am glad to hear that you were informed of this new feature.

Since you are using the DataTable approach, there is another issue I logged today which concerns the aggregates that you may find relevant:

https://github.com/telerik/kendo-ui-core/issues/4798

Kind Regards,
Alex Hajigeorgieva
Progress Telerik