This is a migrated thread and some comments may be shown as answers.
Grid: Insert and Delete only, no update of existing records
8 Answers 297 Views
This is a migrated thread and some comments may be shown as answers.
Daniel Grünberger
Top achievements
Rank 1
Daniel Grünberger asked on 08 Feb 2013, 01:32 PM
Hi,

I'm using the Kendo Grid in my application.

In my Grid I just need to insert rows and delete them. Update should not be possible.

If I define the Grid as follows, I dont have an update button to save the values. If I specify the Update function, I get the Update Button.

How can I achieve this?

Greets

.Columns(
    col =>
    {
        col.Command(c => { c.Destroy(); }).Width(250);
        ...
    })
    .ToolBar(c => c.Create())

8 Answers, 1 is accepted

Sort by
0
Rosen
Telerik team
answered on 12 Feb 2013, 07:53 AM
Hi David,

Although, the requested functionality is not supported you can achieve this using few lines a JavaScript to manually hide the edit command button. This can be implemented by attaching to grid's DataBound event:

Html.Kendo().Grid<..>()
   .Name("grid")
   .Columns(columns =>
   {     
       //....
       columns.Command(command => { command.Edit(); command.Destroy(); });
   })
   .ToolBar(toolbar => toolbar.Create())
   .Editable(editable => editable.Mode(GridEditMode.InLine))
   .Events(events => events.DataBound("dataBound"))
   .DataSource(dataSource => dataSource
       .Ajax()
       //.....
   )

<script type="text/javascript">
    function dataBound() {
        this.table.find(".k-grid-edit").hide();
    }
</script>

Regards,
Rosen
the Telerik team
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
0
habeeb
Top achievements
Rank 1
answered on 06 May 2016, 11:14 PM

Has anything changed since ? This does not seem to work. I don't want any edit functionality. Just want insert.

 

Also, if I do below, it is adding a new empty colomn in table. Is this a bug ?

columns.Command(command => { command.Edit(); command.Destroy(); });

0
Rosen
Telerik team
answered on 10 May 2016, 06:07 AM

Hello habeeb,

The mentioned approach is still applicable. If you are getting empty command column, then I guess it is working at your end as it is hiding the command buttons. 

Note that the command buttons column is required when using inline editing, even when only insert operation is used as it is holding the update/cancel button shown during editing. If you want to not have the command column at all you should consider using Popup editing instead. Another approach will be to use a external button and use the Grid's API to submit the record.

Regards,
Rosen
Telerik
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
0
Leo
Top achievements
Rank 1
answered on 01 Nov 2019, 11:59 AM

OP question is over 3 years old, but still same situation?

I need a create only grid. It will only show the save button as command.Edit() is used and that can only be used if the datasource as an .Update() method defined. And i need to clutter the javscript withsome piece of code to hide the Edit buttons.

I think the toolbaar.Create() button should be enough to get the wrappers to render the save buttons.

 

0
Alex Hajigeorgieva
Telerik team
answered on 05 Nov 2019, 08:27 AM

Hi, Leo,

You could use the Command buttons Visible() method now and check if the row has a new item in it to show the Update/Cancel buttons:

columns.Command(c =>
{
      c.Edit().Visible("showOnNew");
      c.Destroy();
});

<script>
   function showOnNew(dataItem) {
       return dataItem.isNew();
   }
</script>

As for the Update operation in the data source definition, that would still be necessary but it could be anything really, even a space would do:

.Update(upd => upd.Action(" ", " "))

If you think that a lot of people would like to have this functionality built-in, we should log a Feature Request and that will allow the feature to become popular and upvoted. When a feature request collects a lot of votes it gets pushed forward for implementation by the team.

Let me know what you think of the approach I mentioned above and if you like we can open a feedback item on your behalf.

Kind Regards,
Alex Hajigeorgieva
Progress Telerik

Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
0
Andy
Top achievements
Rank 1
answered on 03 Jul 2020, 05:51 PM

Hi Alex,

Is this solution is only intended to work when the datasource is set to Ajax?

We have a hierarchical grid with 3 levels (using server side details templates). We want to allow them to Create top level items but not edit them so we have tried adding the following visible() method of the top grid

@{Html.Kendo().Grid<Location>(Model)
    .Name("Locations")
    .ToolBar(t => t.Create().Text(" TopLevel").IconClass("fas fa-plus text-success"))
    .Editable(e => e.Mode(GridEditMode.InLine))
    .Columns(columns =>
    {
      columns.Bound(e => e.Name);
      columns.Bound(e => e.Type);
      columns.Command(c => { c.Edit().Visible("function (dataItem) { return dataItem.isNew(); }"); });
    })
    .DetailTemplate(@<text>@RenderAreaGrid(item)</text>)
    .DataSource(dataSource => dataSource
        .Server()
        .Model(model =>
        {
            model.Id(l => l.LocationId);
            model.Field(l => l.Type).Editable(false);
        })
        .Create("TopLocations_Create", "Location")
        .Update(" ", " ")
    )
    .Render()
;}

 

its just ignored if the datasource is set to server. If I change to Ajax then the Visible method works but we can't use the server side details to bind to a single hierarchical viewModel.

 

0
Alex Hajigeorgieva
Telerik team
answered on 07 Jul 2020, 11:53 AM

Hello, Andy,

You are correct about the server bound grids. For them, you can use the RowAction() method as discussed in this forum post:

https://www.telerik.com/forums/how-do-i-conditional-set-the-visibility-of-the-command-edit-button-on-a-row-by-row-basis-#4u1jtFY7-k28ZWXjMOQYIA

For your purposes, it would look like this:

.RowAction(row =>
{
    if (row.DataItem.LocationId == 0 ) // or the defaultValue for the LocationId type
    {
        row.HtmlAttributes["class"] = "hide-buttons";
    }
})

Then, you can use CSS to hide the cancel button for example:

   <style>
        .hide-buttons .k-grid-cancel {
            display:none;
        }
    </style>

Kind Regards,
Alex Hajigeorgieva
Progress Telerik

Progress is here for your business, like always. Read more about the measures we are taking to ensure business continuity and help fight the COVID-19 pandemic.
Our thoughts here at Progress are with those affected by the outbreak.
0
Andy
Top achievements
Rank 1
answered on 07 Jul 2020, 05:15 PM
Thanks Alex that's what we needed!
Tags
Grid
Asked by
Daniel Grünberger
Top achievements
Rank 1
Answers by
Rosen
Telerik team
habeeb
Top achievements
Rank 1
Leo
Top achievements
Rank 1
Alex Hajigeorgieva
Telerik team
Andy
Top achievements
Rank 1
Share this question
or