Error uploading the file

I am trying to upload a file from a dialog. (code below) When I try to upload the file, the following error is returned via the error handler:

{"type":"RFC 9110 - HTTP Semantics or more validation errors occurred.","status":400,"errors":{"file":["The file field is required."]},"traceId":"00-ca846be8f542b9fc144fe1d72367310f-47e909119f95a46a-00"}

This refers to the file argument in the signature of my controller method:

        [HttpPost("UploadDocument/{docType}/{category:int}/{id}")]
        public async Task<ActionResult> UploadDocument(IFormFile file, string docType, int category, string id, string batch = "", string filename = "")

Developer tools shows that no file is included with the request that fails.
What do I need to do to get the file to be sent with the form submission?

Below are the relevant parts of the client code.

<RadzenTemplateForm TItem="string" Submit="@(args=>StartUpload(args))" Data="currentFileName">
    <RadzenPanel Variant="Variant.Outlined">
        <h3>@Title</h3>
        <RadzenPanel>
            <RadzenRow Gap="0rem" RowGap="0rem" class="rz-m-0 rz-m-md-12">
                <RadzenColumn Size="9">
                    <RadzenUpload id="ddUpload" @ref="uploadDD"
                                  ChooseText="Drag and drop here or click to choose document"
                                  Auto="false" Multiple="false" Url=@($"ImagingRepository/UploadDocument/{DocumentType}/{(int)DocumentCategory}?filename={currentFileName};documentId={DocumentId}")
                                  InputAttributes="@(new Dictionary<string,object>(){ { "aria-label", "select file" }})"
                                  Change=@UploadFileChanged
                                  Error=@UploadErrorHandler
                                  Complete=@UploadComplete
                                  Progress=@(args => OnProgress(args, "Drag and drop file to upload")) Style="width: 100%" />
                </RadzenColumn>
            </RadzenRow>
            <RadzenRow Gap="0rem" RowGap="0rem" class="rz-m-0 rz-m-md-12">
                <RadzenFormField Text="Name" AllowFloatingLabel="true" Variant="Variant.Text" Style="width:100%">
                    <ChildContent>
                        <RadzenTextBox Name="tbFileName" @ref="tbFilename" @bind-Value=@currentFileName Style="width:100%" />
                    </ChildContent>
                    <Helper>
                        <RadzenRequiredValidator Component="tbFileName" Text="Name is required." />
                    </Helper>
                </RadzenFormField>
            </RadzenRow>
            <RadzenRow>
                <RadzenColumn Size="12">
                    <RadzenButton Text="Upload"
                                  ButtonType="ButtonType.Submit" class="rz-mt-4" />
                </RadzenColumn>
            </RadzenRow>
        </RadzenPanel>
    </RadzenPanel>
</RadzenTemplateForm>
@code {
    RadzenUpload uploadDD;
    RadzenTextBox tbFilename;
    string currentFileName{get;set;}
    FileInfo? currentFile;

    private async Task StartUpload(string args)
    {
        if (null == currentFile) return;
        await uploadDD.Upload();
    }

    private void UploadComplete(UploadCompleteEventArgs args)
    {
        if (!args.Cancelled && Guid.TryParse(args.RawResponse, out var guid))
        {
            DocumentId = guid;
            DialogService.Close(guid);
        }
    }

    private void UploadErrorHandler(UploadErrorEventArgs args)
    {
        uploadError = "There was an error uploading the file.";
        if (!string.IsNullOrWhiteSpace(args.Message))
            uploadError += "   " + args.Message;
    }

}

You might want to check this thread:

This is definitely related. If I check in the StartUpload method, uploadDD.HasValue is false.
The question becomes: Why is HasValue false? The file has been selected, and UploadFileChanged has been fired showing the file that was selected in its UploadChangeEventArgs value.

What step am I missing to get the uploadDD.HasValue to stop being false?

Here is an important quote from the thread I’ve linked:

That thread suggests this code pattern:

The question becomes: What needs to happen for HasValue to be true so that I can upload the file?
Like I said, even after I drag a file on the control and the OnChange event handler shows that a file has been added, HasValue continues to be false for me.

EDIT: HasValue shows as true inside the Change event handler, but is false at the beginning of the submit handler

EDIT: If I change the control to Auto, it uploads as expected immediatley after the drop. However, we have to let the user modify the filename before it is uploaded, so we want to upload it after the user hits the "Upload" button, hence I made that button ButtonType.Submit and am using the submit event handler to do the upload.

I've tried having the Upload button be a normal button with a click handler instead of ButtonType.Submit in case there is something about form submission that stops control from being able to upload. That did not change the issue, and uploadDD.HasValue is false in that handler as well.

I am assuming that since the RadzenUpload control has an "Auto" property that can be set to false that there is someway to upload the file manually instead of automatically. How is this done? There has to be some way to allow a button to kick-off the upload process.

I created a very simple example with a standard button on a page and the upload appears to work as expected.

image

Have you tried stepping thru your code as sometimes file size and file type can cause unexpected issues ?

I went ahead and got your minimal example working and added in the things that were different one at a time until things broke. It looks like the issue is that being inside of the RadzenTemplateForm breaks the upload control. Since we needed the RadzenTemplateForm for the validation of the filename textbox to work, my work around was to rearrange the tags so that the RadzenUpload control was outside the RadzenTemplateForm.

Should I submit this as an issue on GitHub?

Submitted issue on GitHub