Required columns with DataTable in kendo mvc grid

[Mahesh]

Hi,

I am using datatable with my kendo mvc grid and want to make few columns as mandatory. I am not sure how can I do that.

How can I do this?

 

Thanks in advance.

Mahesh

[Alexander]

Hi Mahesh,

Thank you for reaching out.

I noticed that currently there is no license associated with your account, which generally limits our support services. ence, I would recommend renewing your license to get a hold of all the latest bug fixes, features, and support services the product provides.

A list of the available support plans can be found here:

• Product Bundles Pricing - https://www.telerik.com/purchase.aspx?filter=web 

If you want to proceed with a more dynamic approach in composing the Grid's schema then my personal recommendation here would be to consider the option of transmuting the existing Enumeration of dictionaries to a DataTable instance.

The following article outlines such an approach that I think you might find intriguing as well:

• Implementing a Dynamic Grid - https://docs.telerik.com/aspnet-core/knowledge-base/grid-dynamic

The Grid's Schema is constructed on the server-side in a similar "Key-Value" pair fashion. Namely, by adding them as required DataColumn incarnations. Here is an exemplary configuration:

private DataTable GetDataTableColumns()
{
    DataTable dt = new DataTable();
    dt.Columns.Add(new DataColumn("OrderID", typeof(int)));
    dt.Columns.Add(new DataColumn("OrderDate", typeof(DateTime)));
    dt.Columns.Add(new DataColumn("Freight", typeof(decimal)));
    dt.Columns.Add(new DataColumn("ShipName", typeof(string)));
    dt.Columns.Add(new DataColumn("ShipCity", typeof(string)));
    dt.Columns.Add(new DataColumn("ShipCountry", typeof(string)));
    dt.PrimaryKey = new DataColumn[] { dt.Columns["OrderID"] };
    return dt;
}

The supplemented columns are then traversed within the existing Grid declaration as follows:

@(Html.Kendo().Grid<dynamic>()
    .Name("gridItem")
    .Columns(columns => // Bound Columns
    {
        foreach (System.Data.DataColumn dcolumn in Model.Columns)
        {
            columns.Bound(dcolumn.ColumnName).Title(dcolumn.Caption);
        }
    })
	...
    .DataSource(dataSource => dataSource
      .Ajax()
      .Model(model => // Model Schema
      {
          var id = Model.Columns[0].ColumnName;
          model.Id(id); // Set the Model Id
          foreach (System.Data.DataColumn column in Model.Columns)
          {
              var field = model.Field(column.ColumnName, column.DataType);
              if (column.ColumnName == id)
              {
                  field.Editable(false);
              }
          }
      })
      .PageSize(10)
      .Read(read => read.Action("Customers_Read", "Home"))
    )
)

The rows are then populated again on the server-side by leveraging the previously supplemented column keys:

private DataTable GetDataTable(int howMany)
{
    DataTable dt = GetDataTableColumns();

    for (int i = 0; i < howMany; i++)
    {
        int index = i + 1;

        DataRow row = dt.NewRow();

        row["OrderID"] = index;
        row["OrderDate"] = new DateTime(DateTime.Now.Year, DateTime.Now.Month, DateTime.Now.Day, 0, 0, 0).AddHours(index);
        row["Freight"] = index * 0.1 + index * 0.01;
        row["ShipName"] = "Name " + index;
        row["ShipCity"] = "City " + index;
        row["ShipCountry"] = "Country " + index;

        dt.Rows.Add(row);
    }

    return dt;
}

"Notice, that the aforementioned article also points to an existing GitHub examples repository which contains other scenarios involving the dynamic Grid."

I hope this proves helpful.

Kind Regards,
Alexander
Progress Telerik