Grid inCell Edit

[Udvikler]

Hi,

I have created a grid with 10 columns, but I need two of them to be editable.

1 - I don't want to use inline buttons [Edit], [Save] or [Delete];

2 - I don't want the other cells to be editable, only those two I need.

3 - I want the user to click in a cell, opening it for edition;

4 - I want to save those two values only if both of them are filled out;

5 - I don't mind having a server request when the user change from once cell to another (among the editable ones).

Is it possible to do? If not, could you give me some options of how I could manage it in a Telerik grid?

Thanks.

[Tsvetomir]

Hi Udvikler,

Based on the provided requirements, I believe that "InCell" edit mode would be the best fit for this case. It does not require additional edit and delete buttons, however, it requires a "save" button at least. It can be positioned in the toolbar as shown in the following live demo:

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

The editing funtionality will be enabled only when a user clicks on a cell.

There are two approaches which can be undertaken in order to make certain fields non-editable:

1. Mark the Editable setting of the data source false

.DataSource(dataSource => dataSource
    .Ajax()
    .Model(model=>
    {
        model.Id(m=>m.OrderID);
        model.Field(m => m.Freight).Editable(false);
        model.Field(m => m.OrderDate).Editable(false);
    })

2. Take advantage of the Editable setting for each of the columns at a grid level. It accepts a JavaScript function name:

.Columns(columns =>
{
    columns.Bound(p => p.OrderID);
    columns.Bound(p => p.Freight).Editable("isEditable");

function isEditable(e) {
    return false;
}

The difference between the two is that when the editing is disabled at a grid's level, the values within the non-editable fields can be edited programmatically, therefore, will not be opened for editing. When the editing is restricted at a data source level, even programmatically, the values will not be submitted to the database. 

If it is mandatory for the fields to be filled in when submitting the changes, mark them as required in the ViewModel:

public int OrderID { get; set; }

[Required]
public DateTime? OrderDate { get; set; }

[Required]
public string ShipName { get; set; }

Let me know in case additional clarifications are needed.


Kind regards,
Tsvetomir
Progress Telerik