Hello, I hope you are well.

I hope you can help me with this problem I have.

I am using the Kendo UI for JQuery Upload.

What I require is to upload an entire folder of TXT files, but I have a routine that validates that the name and content meet certain rules.

I apply these rules within the foreach loop (var file in files), because what is required is that if the file is valid it shows a text that it is valid, otherwise it shows a text that is not valid and for both options to continue processing the next file.

But by marking that file as erroneous, the controller is exited and the view is returned, thus leaving the processing of the rest of the files incomplete.

I share the code of the view and the controller, hoping you can give me some light.

View Code:

<div class="centered">
    @using Kendo.Mvc.UI
    <div>
        <div class="demo-section">
            @(Html.Kendo().Upload()
                .Name("files")
                .Async(a => a
                    .Save("ChunkSave", "Upload")
                    .Remove("Chunk_Upload_Remove", "Upload")
                    .AutoUpload(true)
                    .ChunkSize(11000)

                )
                .Multiple(true) // Enable multiple file selection
                    .Directory(true)
                    .DirectoryDrop(true)
                .Validation(validation =>
                {
                    //validation.MaxFileSize(20000000);
                })
                .Events(events =>
                {
                    events.Upload("onUpload");
                    events.Success("onUploadSuccess");
                    events.Error("onUploadError");
                    events.Select("onSelect");
                })
                .Messages(messages =>
                {
                    messages
                        .Select("Seleccionar archivos")
                        .DropFilesHere("Suelta archivos aquí para cargarlos")
                        .Remove("Eliminar")
                        .Retry("Reintentar")
                        .StatusFailed("Error")
                        .StatusUploaded("Terminado")
                        .StatusUploading("Cargando")
                        .UploadSelectedFiles("Cargar archivos")
                        .UploadFail("Error al procesar el archivo.")
                        .HeaderStatusUploaded("Terminado");
                })

            )
        </div>
    </div>
</div>

Controller Code:

public async Task<ActionResult> ChunkSave(IEnumerable<IFormFile> files, string metaData, string cve)
{

    int status = 0;
    DataContractJsonSerializer serializer = new DataContractJsonSerializer(typeof(ChunkMetaData));


    MemoryStream ms = new MemoryStream(Encoding.UTF8.GetBytes(metaData));
    ChunkMetaData? somemetaData = serializer.ReadObject(ms) as ChunkMetaData;
    string path = String.Empty;

    if (files != null)
    {
        foreach (var file in files)
        {
            cap_dbt controller = new cap_dbt(_context);
            controller.ProcessFile(file, somemetaData.FileName, cve);
            status = controller.ProcessFile(file, somemetaData.FileName, cve);
            if (status == 1)
            {
                Upload(files, somemetaData.FileName);
            }
        }
    }


    if (somemetaData is null)
    {
        throw new Exception("No Metadata!");
    }

    Util.FileResult fileBlob = new Util.FileResult();
    fileBlob.uploaded = somemetaData.TotalChunks - 1 <= somemetaData.ChunkIndex;
    fileBlob.fileUid = somemetaData.UploadUid;
    fileBlob.warnings = Mensajes.msgLoadCsvWarning;
    fileBlob.message = "[" + somemetaData.FileName + "]\t";

    try
    {
        if (!fileBlob.uploaded)
        {
            fileBlob.message += "[ERROR]" + Mensajes.msgLoadCsvError;

            return StatusCode(500, fileBlob);
        }
        else if (status == -1)
        {
            fileBlob.uploaded = false;
            fileBlob.message += "[ERROR] " + Mensajes.msgLoadCsvError;
            throw new Exception(fileBlob.message); // <------- If I remove this line, it continues processing, but it no longer changes the file, it stays with the same name or empty.

        }

        if (fileBlob.warnings.Equals(""))
        {
            fileBlob.message += Mensajes.msgLoadCsvOk;
        }
    }

    catch (Exception ex)
    {
        Console.WriteLine(ex.ToString());
        return StatusCode(500, fileBlob);
    }
    finally
    {
        Mensajes.resetMsg();
    }

    return Json(fileBlob);
}

Hello Telerik,

I am using the Kendo Upload Control with Async AutoUpload set to "true".  In version 2023.3.1114, when using "Select File" to upload a document the control works perfectly.  Dragging and dropping a file onto the control also works perfectly. 

After upgrading to 2024.1.130 using "Select File" to upload a document does not work, but dragging and dropping a file does work to upload a document.

Can you please advise me as to what I am doing wrong.  I am using jQuery v3.7.0.

@(Html.Kendo().Upload()
		.Name("uplCtrl")
		.HtmlAttributes(new { aria_label = "files", title = "Select file to upload" })
		.Multiple(false)
		.Messages(m => m.Select("Select file...")
		.DropFilesHere("Drop file here to upload"))
		.ShowFileList(false)
		.Async(a => a
			.Save("UploadSave", "Vendors")
			.AutoUpload(true)                                        
		)
		.Validation(validation =>
		{
			validation.AllowedExtensions(new string[] { "pdf", "docx", "xlsx", "zip" });
			validation.MaxFileSize(52428800);
		})
		.Events(e => e
			.Error("onUploadError")
			.Complete("onUploadSuccess")
			.Upload("onUpload")
		)
	)

Razor code-behind method: I made the razor method as simple as possible, just to see if we could get in there / or hit onpostUploadFile
        public async Task<ActionResult> OnPostUploadFile(IEnumerable<IFormFile> files, string metaData)
        {
            AllowedExtensions = new string[] { "fpd", "pdf" };

            return Page();
        }

Razor page :

@addTagHelper *, Kendo.Mvc
<div>
    <div class="demo-section">
        <kendo-upload name="files">
            <async auto-upload="true" save-url="@Url.Action("Upload","UploadFile")" chunk-size="11000" />
            <validation max-file-size="20000000" />
        </kendo-upload>
    </div>
</div>

The issue is i am not able to hit the hander from the razor page when i pass the url to <async save-url="">, Despite many efforts, the handler specified in the save-url attribute doesn't seem to be hit and returns 404.

Not Working: 

1. save-url: "/Upload/UploadFile",

2. save-url="./Upload?handler=UploadFile"

I also found Forum where it discussed the same problem but that didn't help us :https://www.telerik.com/forums/upload-using-tag-helpers

Hello!

I am trying to add a <kendo-upload> tag onto the toolbar of a kendo grid using TagHelper and ASP.NET Core

Though I am struggling with figuring out how to do this,  I have followed this template: https://demos.telerik.com/aspnet-core/grid/toolbar-template to not much success. 

My goal is to simply add a file upload option to upload an excel file to populate the fields of a grid!

Any ideas on how to progress?

Thank you!

But I am still struggling

Hello,

where can I find the controller code for ASP.NET Core Upload Asynchronous Upload. Somehow when I trying to upload my file, I keep getting an error "failed to upload the file". below is what i have in my controller:

  public ActionResult Async_Save(IEnumerable<IFormFile> files)
        {
            // The Name of the Upload component is "files"
            string path = Path.Combine(_webHostEnvironment.WebRootPath, "FileSavePath");
            string DestinationPath = _configuration["DestinationPath"].ToString();
            if (files != null)
            {
                MoveFiles mf = new MoveFiles(); 
               
                foreach (var formFile in files)
                {
                    
                  

                    using (var stream = System.IO.File.Create(DestinationPath))
                    {
                        formFile.CopyTo(stream);
                    }

                    
                }
            }

This is my cshtml code:

@using Kendo.Mvc.UI
<div style="margin-top:60px">
        <div class="block-section">
        @(Html.Kendo().Upload()
            .Name("files")
            .Async(a => a
                .Save("Async_Save", "Upload")
                .Remove("Async_Remove", "Upload")
                .AutoUpload(true)
            )
        )
    </div>
</div>

Good afternoon,

I'm using a chunk upload to upload files, some of which could be greater than 2GB.

When the user has selected a file I want to run a series of checks of the filename against a database before deciding whether to allow the upload to take place.  If it fails that validation I want it to return a message to the view explaining why it failed.

I've set the Upload as follows:

        @(Html.Kendo().Upload()
            .Name("files")
            .HtmlAttributes(new { aria_label = "files"})
            .Enable(true)
            .Multiple(false)
            .Async(a => a
                .Save("Async_ChunkSave", "Source")
                .Remove("Async_Remove", "Source")
                .AutoUpload(true)
                .ChunkSize(4194304)
            )
            .Events(events => events
                .Upload("onUpload")
                .Complete("onComplete")
                .Error("onUploadError"))
        )

I'm using the Upload event to send some extra data from the view:

public async Task<ActionResult> Async_ChunkSaveAsync(IEnumerable<IFormFile> files, string metaData, string uploadData)

Am I right in thinking that although it has a foreach file in files, it will only be one file since chunkData.FileName can only be one file - presumably the same name as the file's.

                    if (files != null)
                    {
                        foreach (var file in files)
                        {
                            path = Path.Combine(fullFolderPath, chunkData.FileName);
                            AppendToFile(path, file);
                        }
                    }

Where is the best place to validate the filename against the database, before it starts handling some potentially very large files? And then return an appropriate error message to the View, and halt the upload?

Kind regards,

Richard