How to enable creation as well as disable editing for the Kendo grid

Is it possible to enable only the insertion of new records into the Kendo grid, but disable the editing of records?

The best I could do was onDataBound to remove the "Edit" buttons in JavaScript. I tried setting Editable(ed => ed.Enabled(false)) , but I am getting runtime errors.

 @(Html.Kendo().Grid(Model) .Name("Grid" + guid) .HtmlAttributes(new { style = "margin:20px" }) .Columns(columns => { columns.Bound(p => p.Id).Hidden(true); //a few more columns columns.Command(command => { command.Edit().Text(Resources.KendoEdit).UpdateText(Resources.KendoUpdateText).CancelText(Resources.KendoCancelText); command.Destroy().Text(Resources.KendoDestroy); }).Title(Resources.KendoCommands).Width(180); }) .ToolBar(toolbar => toolbar.Create().Text(Resources.KendoToolbarCreate)) .Editable(editable => editable //.Enabled(false) .Mode(GridEditMode.InLine) .DisplayDeleteConfirmation(false) ) .DataSource(dataSource => dataSource .Ajax() .ServerOperation(false) .Events(events => events.Sync("sync").Error("error")) .Model(mod => mod .Id(p => p.Id) ) .Model(mod => mod .Field(p => p.OldRoleId).Editable(false) ) .Read(read => read.Action("ChangeRole_Read", "ChangeRole")) .Create(update => update.Action("ChangeRole_Create", "ChangeRole")) .Update(update => update.Action("ChangeRole_Update", "ChangeRole")) .Destroy(update => update.Action("ChangeRole_Destroy", "ChangeRole")) ) .Sortable() .Filterable(filterable => filterable .Extra(true) .Operators(operators => operators .ForString(str => str.Clear() .StartsWith(Resources.KendoFilterStartsWith) .IsEqualTo(Resources.KendoFilterIsEqualTo) .IsNotEqualTo(Resources.KendoFilterIsNotEqualTo) .Contains(Resources.KendoFilterContains) .DoesNotContain(Resources.KendoFilterDoesNotContain) .EndsWith(Resources.KendoFilterEndsWith) ) ) .Messages(mess => mess .Info(Resources.KendoFilterMsgInfo) .And(Resources.KendoFilterMsgAnd) .Or(Resources.KendoFilterMsgOr) .Filter(Resources.KendoFilterMsgFilter) .Clear(Resources.KendoFilterMsgClear) ) ) .Scrollable() .Pageable(pg => pg .Refresh(true) .Messages(ms => ms .First(Resources.KendoPageableFirst) .Last(Resources.KendoPageableLast) .Next(Resources.KendoPageableNext) .Previous(Resources.KendoPageablePrevious) .Empty(Resources.KendoPageableEmpty) .Display(Resources.KendoPageableDisplay) ) ) .Events(ev => ev .Edit("edit") .Save("save") .DataBound("dataBound") ) ) 
+7
source share
5 answers

The only way to do this is to set the visibility of the Edit button to No:

 <style> #yourgridid .k-grid-edit { display: none; } </style> 
+2
source

It's hard to answer without the code that you use to initialize the grid, but I'm going to take a picture. If I remember correctly, you should explicitly tell Kendo to add a column with edit / delete buttons, for example:

 .Columns(columns => { columns.Bound(m => m.Whatever); columns.Command(command => { command.Edit(); command.Destroy(); }); }) 

So, if you have this or something similar in the column definitions, deleting it will get rid of editing / deleting, but will keep the add button on the top line of the grid.

If this is not the way the edit / delete buttons are configured, I would be happy to revise my answer if you post the grid code.

+1
source

This fix is ​​in the comments below:

 .Columns(cols => { cols.Bound(c => c.name).Width(300); cols.Bound(c => c.dateBuilt); cols.Command(cmd => { cmd.Select(); //cmd.Edit();//This is the part to comment out if u want to disable edit cmd.Destroy(); }); }) 
0
source

I had the same problem.

The only work I am working with so far is to use popup editing and remove the edit button from the grid. Now it's just a matter of customizing the editor template.

 @(Html.Kendo().Grid<xxxxViewModel>() .Name("xxxx") .Columns(columns => { ......... columns.Command(command => { command.Destroy().Text("Del"); }).Width(80); }) .ToolBar(commands => { commands.Create(); }) .Pageable() .Editable(editable => editable.Mode(GridEditMode.PopUp)) .Sortable() .Scrollable() .Filterable() .Events(events => { //events.Save("xxxx"); }) .HtmlAttributes(new { style = "height:700px" }) .DataSource(dataSource => dataSource .Ajax() .Events(events => events.Error("error")) .Model(model => { model.Id(p => p.xxxx); model.Field(p => p.xxxx).Editable(false); }) .Create(create => create.Action("xxxx", "xxxx")) .Read(read => read.Action("xxxx", "xxxx")) .Destroy(destroy => destroy.Action("xxxx", "xxxx")) ) ) 
0
source

I also think others suggested you remove

 command.Edit() 

from your line and to save the save button, you can add it to the toolbar next to the creation using

 toolbar.Save() 

Cheers, Sameh

0
source

All Articles