RadzenUpload manual upload breaks if inside RadzenTemplateForm #1458

Closed
opened 2026-01-29 17:53:55 +00:00 by claunia · 1 comment
Owner

Originally created by @SvdSinner on GitHub (Oct 31, 2024).

Describe the bug
If a RadzenUpload control with its Auto property set to false is placed inside of a RadzenTemplateForm control, the file cannot be uploaded manually.

To Reproduce
Steps to reproduce the behavior:

  1. Create a RadzenTemplateForm on a .razor page and insert a RadzenUpload control as its child element.
  2. Give the RadzenUpload control a @ref to local variable, which we will call uploadDD
  3. Add a handler that will upload the file (either a button click or a form submit handler)
  4. Run code. Select file to upload. Activate handler from #3 via button
  5. Observe in debugger that uploadDD.HasValue will be null at this point, and you can observe from the server side that the upload does not contain a file

Futher details here: https://forum.radzen.com/t/error-uploading-the-file/18772

Expected behavior
After file selection, the RadzenUpload control should have a non-null value for the file (uploadDD.HasValue should be true) This should happen regardless of whether it is inside a RadzenTemplateForm or not. (NOTE: In the documentation, the RadzenUpload is listed under the "Forms" category, so it connotates that it should work inside a form)

Additional context
It is trivial to rearrange the .razor file to move the RadzenUpload outside of the RadzenTemplateForm, repeat the above reproduction and see that the RadzenUpload will then work as expected. Changing the Auto property to true will also prevent the issue, although that prevent any code from running before the upload happens.

Originally created by @SvdSinner on GitHub (Oct 31, 2024). **Describe the bug** If a RadzenUpload control with its Auto property set to false is placed inside of a RadzenTemplateForm control, the file cannot be uploaded manually. **To Reproduce** Steps to reproduce the behavior: 1. Create a RadzenTemplateForm on a .razor page and insert a RadzenUpload control as its child element. 2. Give the RadzenUpload control a @ref to local variable, which we will call uploadDD 3. Add a handler that will upload the file (either a button click or a form submit handler) 4. Run code. Select file to upload. Activate handler from #3 via button 5. Observe in debugger that uploadDD.HasValue will be null at this point, and you can observe from the server side that the upload does not contain a file Futher details here: https://forum.radzen.com/t/error-uploading-the-file/18772 **Expected behavior** After file selection, the RadzenUpload control should have a non-null value for the file (uploadDD.HasValue should be true) This should happen regardless of whether it is inside a RadzenTemplateForm or not. (NOTE: In the documentation, the RadzenUpload is listed under the "Forms" category, so it connotates that it should work inside a form) **Additional context** It is trivial to rearrange the .razor file to move the RadzenUpload outside of the RadzenTemplateForm, repeat the above reproduction and see that the RadzenUpload will then work as expected. Changing the Auto property to true will also prevent the issue, although that prevent any code from running before the upload happens.
Author
Owner

@akorchev commented on GitHub (Nov 15, 2024):

Hi @SvdSinner,

I tested with this and it seems to work just fine:

<RadzenTemplateForm Data="@model">
    <RadzenUpload @ref=upload Auto="false" Url="upload/single" />
    <RadzenButton Text="Upload" Click="@(() => upload.Upload())" />
</RadzenTemplateForm>
@code {
    RadzenUpload upload;

    class Model
    {
    }

    Model model = new Model();
}

Please provide a complete snippet which reproduces the problem.

@akorchev commented on GitHub (Nov 15, 2024): Hi @SvdSinner, I tested with this and it seems to work just fine: ``` <RadzenTemplateForm Data="@model"> <RadzenUpload @ref=upload Auto="false" Url="upload/single" /> <RadzenButton Text="Upload" Click="@(() => upload.Upload())" /> </RadzenTemplateForm> @code { RadzenUpload upload; class Model { } Model model = new Model(); } ``` Please provide a complete snippet which reproduces the problem.
Sign in to join this conversation.
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: starred/radzen-blazor#1458