Uploading files in Grid

[Phil]

Hello,

 

I've done some searching  and can't find an example of this, so I'm asking here...

I have a grid that I'm using as part of a process to build a parent with child objects.  Think Order (as the parent) and Products (as the children).  Each parent has one or more children.

 

I create the parent object, and then 'Add' children to it, one at a time.  This part works great.

I would like to be able to upload a file as part of the process or creating a child.  I only need to upload one file at a time, and only when I create the child.  

I'm using Asp.Net core 2.0, with Telerik UI version 2017.3.1206.

 

I don't have a small project to demonstrate this; I could build one if I needed to, but it would take a bit.  I'm  just hoping for some pointers to documentation, or examples.  

 

Thanks!

Phil

[Preslav]

Hello Phil,

To achieve the desired behavior, you could use a custom editor template. In the template implement an Upload widget. Very similar functionality is demonstrated in this code library:

• https://www.telerik.com/support/code-library/upload-in-grid-popup-editor

However, in this case, handle the edit event of the Grid. In the event handler, based on the e.model.isNew(), hide the Upload widget.

• https://docs.telerik.com/kendo-ui/api/javascript/ui/grid/events/edit
• https://docs.telerik.com/kendo-ui/api/javascript/data/model/methods/isnew

Regards,
Preslav
Progress Telerik

[Phil]

Thanks for your reply.

Unfortunately, the example that you pointed me to still has the file uploaded before the grid item is fully complete.  Unless I'm not understanding your suggestion.  

So I would have to somehow attach the two records together when the grid item is created.  This isn't ideal, so I'm trying another path.

 

I'm now trying to upload the file AFTER the child item is created, by putting an upload control in a column on the grid.  When I do this, when the grid loads with existing items, the Upload control is disabled.  If I click 'Edit' on the grid row, then 'Cancel', it's enabled, allowing me to select a file.  It's like the state of the Upload control is tied to the state of the row. 

Is there any way to load the page with the Upload control in a state that would allow me to Upload files w/o editing the row?

 

Thanks!

Phil

 

 

[Preslav]

Hi Phil,

To use a widget without editing the row/cell, configure a column template:

• https://docs.telerik.com/kendo-ui/api/javascript/ui/grid/configuration/columns.template

For example:

• https://docs.telerik.com/aspnet-mvc/helpers/grid/faq#how-to-use-kendo-ui-widgets-inside-grid-client-column-templates

I hope this helps.


Regards,
Preslav
Progress Telerik

[mehran]

hi Preslav ..

can u upload a project like this link : https://www.telerik.com/support/code-library/upload-in-grid-popup-editor

with jquery and newer version of asp.net core ,because  i use asp.net core 5 and i want to use kendo grid with jquery in my project to upload image in popup form of grid . 

thanks in advance .

[Eyup]

Hi Mehran,

 

This repository uses the Telerik UI for ASP.NET Core Product and demonstrates how you can fully customize the PopUp editor depending on your specific needs:
https://github.com/telerik/ui-for-aspnet-core-examples/blob/master/Telerik.Examples.Mvc/Telerik.Examples.Mvc/Views/Grid/CustomPopUpEditor.cshtml

I hope this will prove helpful in achieving what you are looking for.

 

Regards,
Eyup
Progress Telerik