Dynamic Tables

[sjarl]

Hi,

at the moment I am converting the old Telerik MVC tool to Kendo MVC for one of our portals.

now I have an issue with a dynamic table, not always all fields are the same and I can't get it to work correctly.

my grid looks like this

@(Html.Kendo().Grid(Model.DefaultView)
                            .Name("Grid")
                            .DataSource(dataSource => dataSource
                                        .Ajax()
                                        .Read(read => read.Action("LoadData", "AutorisatieMatrix"))
                                        .Update(read => read.Action("_SaveBatchEditing", "AutorisatieMatrix"))
                                        .Model(model => model.Id("ProgramFunction"))
                                    )
                            .Sortable()
                            .Editable(editing => editing.Mode(GridEditMode.InCell))
                                .ToolBar(commands =>
                                {
                                    commands.Save();
                                })
                            .Columns(columns =>
                            {
                                columns.Bound("Id").Visible(false);
                                foreach (System.Data.DataColumn dcol in Model.Columns)
                                {
                                    if (dcol.ColumnName != "Id")
                                    {
                                        if (dcol.ColumnName == "ProgramFunction")
                                            columns.Bound("ProgramFunction")
                                                .EditorTemplateName("_ReadOnlyValue")
                                                .ClientTemplate("#=ProgramFunction#")
                                                .Title("Programmafunctie");
                                        else
                                        {
                                            columns.Bound(dcol.ColumnName)
                                                .EditorTemplateName("_PermissionEditor")
                                                .ClientTemplate(boo(this, "#=" + dcol.ColumnName + "#").ToHtmlString())
                                                .Title(dcol.Caption)
                                                ;
                                        }
                                    }
                                }
                            })

 

where I go through all colums specified in the model.
and the header gets created as it should.

In the controller in the Index I create an empby DataTable so the Model knows which colums to use.

public ActionResult Index()
        {
            var tbl = CreateNewDataTable();
            var model = tbl;
            return View(tbl);
        }

which seems to work fine.

Then In the loadData DataRequest I generate this same DataTable fill it, add a dynamic wrapper to include "Data" in the json
Convert is to Json and return the Content.

 

 

 

[sjarl]

Sorry,
I wasn't done typing

dynamic dataWrapper = new
{
    Data = tbl
};

var json = JsonConvert.SerializeObject(dataWrapper);
return Content(json);

 

And when I check the request it returns the dataset as expected.

The only think is that the datagrid only shows a header without any lines. so I'm missing something.

is there someone who can help me out?

 

Thank you

 

[Stefan]

Hello, Sjarl,

I can suggest checking the following article with an example of the Grid with dataTables:

https://docs.telerik.com/aspnet-mvc/helpers/grid/how-to/Binding/grid-bind-to-datatable

If the issue still occurs, please use the example as a reference to demonstrate the issue and I will gladly assist further.

Regards,
Stefan
Progress Telerik

[sjarl]

Thank you,

changing the contoller like this.

if (request.Aggregates.Any())
{
    request.Aggregates.Each(agg =>
    {
        agg.Aggregates.Each(a =>
        {
            a.MemberType = tbl.Columns[agg.Member].DataType;
        });
    });
}

return Json(tbl.ToDataSourceResult(request));

 

did the trick,