Grid Popup Editing

[Richard]

Good afternoon,

Is there an easy way to use the built-in Grid popup edit window to only edit a few model fields rather than all of them?

I want an edit popup with three fields, update and cancel, and to prepopulate with the values from the grid row.

Can this be achieved, or will I need to build a custom popup window?

Kind regards,

Richard

[Francis]

I am also looking for similar option. I came across this: Editor Template - Answered with links.

[Richard]

Thanks Francis - the github example that Alexander posted below worked for me.

[Alexander]

Hi Richard,

Currently, there is not a built-in configuration for the Grid to hide fields in the popup editor. By default when the PopUp edit mode is enabled an EditorForModel will be used. Therefore, it will generate an Editor for each field respectively.

Having this in mind, you can achieve the desired result by hiding the desired fields programmatically using the following approach:

• Subscribe to the Edit event of the Grid:

.Events(e=>e.Edit("onEdit"))

• Within the handler hide the desired fields:

<script>
    function onEdit(e){
          //1.hides the first field and first label
          e.container.find("input:first").parents(".k-edit-field").hide();
          e.container.find("label:first").parents(".k-edit-label").hide();
  
          //2.hides the field and its label by a particular field name
          e.container.find("#OrderDate").parents(".k-edit-field").hide();
          e.container.find("label[for='OrderDate']").parents(".k-edit-label").hide();
    }
</script>

Here is a Telerik REPL example that illustrates the suggested above.

Personally, I would recommend implementing your own custom PopupEditor as it will allow you to have full control over what fields should be included and how to be included.

You can review the following example that showcases this approach:

https://github.com/telerik/ui-for-aspnet-core-examples/blob/master/Telerik.Examples.Mvc/Telerik.Examples.Mvc/Views/Grid/CustomPopUpEditor.cshtml

I hope you find this helpful.

Regards,
Alexander
Progress Telerik

[Richard]

Hi Alexander,

Many thanks for your example hiding the fields.  Given how many fields I would need to hide, I've decided to use the custom PopUpEditor as in the github example.  Apart from figuring out the validation it works exactly as I hoped.

Kind regards,

Richard