How to exclude a kendo grid field that is not in the datasource, from the editor?

2
votes

First, I know how to exclude a field by marking it 'editable: false' in the kendo data source.

I added a column with a button to the Kendo UI grid to open a window for a file upload. This column is not in the datasource! However, the column is now also displayed in the popup editor as a tetxtbox with 'File Upload' as a label (that is the column header name also as you can see in the screenshot).

How can I exclude/hide this column in the popup editor?
I am using Kendo UI version: "2014.2.716"

Thanks for your help!

Here is how I added the column to the grid, see the last line: 

columns: [
            { field: "Id", hidden: true },
            { field: "Name", title: ........ },
            { field: "EnteredBy", title: "Entered by", hidden: true },
            { field: "UpdatedOn", type: "date",.....},
            { field: "UpdatedBy", title: "......},
            { command: ["edit", "destroy"], title: "Action", width: "80px" },
            { field: "Upload", title: "File Upload", width: "80px", template: '<button class="k-button" onClick="uploadFiles(#=Id#)">Upload<br/>Files</button>' }
        ],

and here is a screenshot that shows the column 'File Upload' with the button 'Upload File' in each cell in the grid-column.

enter image description here

This is the screenshot from the popup editor with the field that I would like to hide.

enter image description here

1
kendo-uikendo-grid

1 Answers

2
votes

I think you should make that extra column a custom command instead of specifying a "field" for it.

Something like:

columns: [
    ...
    {
        command: { text: "Upload", click: uploadFiles},
        title: "File Upload",
        width: "80px"
    }
]

The uploadFiles function would then get passed a click event, from which it can get to the element that was clicked. You can add a data-id attribute to the row to get its Id from in the uploadFiles function, as they do in the demo linked above.