multiple partial views with same kendo mvc upload control

Question

I had a partial view which is having a Kendo MVC upload control. And now i need to use this partial view multiple times in a single .cshtml page.

Am facing problem with Control's ID and DOM conflicts... Like first Kendo upload is coming properly but second kendo upload is failing to load in UI.

So I came up with a dynamic .Name (...) so that whenever a kendo upload gets loaded it will be having unique ID.

Now the problem came with controller method. Here I need to get IEnumerable(HttpPostedFileBase) object on button click.

Am bit lost. Any hint is very helpful.

Rgds,

pavan

Edit To be more clear Let's say we had a partial view with textbox and button. on clicking the button we need to validate the textbox. But if the same partial view need to be used multiple times under same CSHTML is the one am facing now.

In multiple partial view why the same id for upload control again and again? Just Try by having the different ID's and point the Same Controller and Upload Action Methods to that., so that you can avoid conflicts. Or any other prob with that? If yes Just post bit of sample code and give a short explanation about it. Since your question is not giving the clear picture to answer. :) — RajeshKdev
@RJK Please see the edited post.. Problem is i need to use same partial view multiple times under same page. Hope you got my issue. — Pavan N

Juan Carlos Velez Juan Carlos Velez · Accepted Answer · 2015-02-11T12:41:23

I had the same problem, and I resolved it modifying the name of the kendo upload with the HtmlAttributes method (.HtmlAttributes(new {name="files" })). Look the next code:

@(Html.Kendo().Upload()
                .Name("files_" + Model.ID)
                .HtmlAttributes(new {name="files" })
                .ShowFileList(true)
                .Messages(m => m.Select("Asociar documentos").StatusUploading("Cargando...").StatusUploaded("Cargado!").Retry("Reintentar").HeaderStatusUploading("Cargando...").HeaderStatusUploaded("Listo!"))
                .Multiple(true).Async(async => async.AutoUpload(true).Save("Upload", "PQRSF", new { id = Model.ID }))
                .Events(events => events
                                    .Complete("uploadFile_OnComplete")
                                    .Error("upload_OnError")
                                    .Upload("upload_OnUpload")
                        )
            )

multiple partial views with same kendo mvc upload control

2 Answers