Form validation on file upload button

suggestions on how to trigger form validation on click of Choose button which is a RadzenUpload component.

<RadzenUpload Url="upload/single" Complete=@OnCompleteAsync class="w-100">
</RadzenUpload>

Both description and file type are required and I want to check for them prior to the file being uploaded

You can invoke Validate() method of the form EditContext:


missing something, not sure what, similar errors in my actual code.

As the error suggests both form and order aren't defined in that page. The form should be declared like this:

RadzenTemplateForm<MyItem> form;

The order is what the Data attribute of RadzenTemplateForm is set to. It should already be declared in your page.

I got that figured out, but I have realized I actually want something different.

I changed to Auto=false

I have normal form validation for File Type which works

I want to upload the file but only if validation passes, I also need to validate that they have chosen a file.

How can I upload the file in FormSubmit() ?

I now have it working.

I do need help with one thing though, how do I validate that a file has been chosen??

Here is my code

I needed to read the response from the upload as well as capture the form values

It uploads the file within FormSubmit() so when it's done, the form values are available in OnCompleteAsync(), I read the response as needed, then save the entity.

still need help with how to validate if a file has been chosen

I can't set a Name for the upload control so I can't use a RequiredValidator, looked at CustomValidator but same issue.

@korchev @enchev any suggestions? thx!

I just double checked and at the moment you can't do that. RadzenUpload doesn't have a "value" at the moment so it can't be validated with a RadzenRequiredValidator. We have to see if we can enable this scenario.

Ok, would be great to have that feature

We thought a bit how to implement such a feature but there are a lot of unknowns. What is a valid RadzenUpload? One with a selected file or one with an uploaded file? What if the upload fails for some reason (file too big, invalid extension etc)? Perhaps it is better to use a custom validator and manually check if a file has been uploaded or not.

For my use case I simply need to know if they selected a file, no different that if they filled in a text box or selected a value from a drop down etc.

If the upload fails, is that not the same as anything else failing within FormSubmit()?

Here is my current work around

        protected async Task FormSubmit()
        {
            try
            {
                if (upload.HasValue)
                {
                    await upload.Upload();
                }
                else
                {
                    errorVisible = true;
                }
            }
            catch (Exception ex)
            {
                errorVisible = true;
            }

        }

As written it doesn't know if the upload specifically failed or it was something else, but if you have a lot of things happening in your FormSubmit() it would be no different.

I changed my error message to "Cannot save, did you select your file?" which is intended to say to the end user: something didn't work, it could be you didn't select the file but it could be something else.

I am not sure if this is sufficient. RadzenUpload will not upload the file when the user submits the form.

No as the upload is separate from the form submission.

Your current implementation can probably use RadzenCustomValidator and use upload.HasValue for the condition. Then the FormSubmit event won't fire if the validator fails.

1 Like

You can't use RadzenCustomValidator because RadzenUpload isn't considered a Component, you can't set a Component value. (see above)

I'm ok with my current solution for now.

No as the upload is separate from the form submission.

Not always, it's not the way I implemented, I set Auto='false' so I could do it as part of FormSubmit() as I wanted to upload the file and save the form values at the same time.