How do you pass a parameter to the upload controller?

Hi!

I want to post a request to the upload controller with a dynamic URL upload/single/{perito_id}, but I am having dificulties defining this URL on the RadzenUpload component's.

I want to get the id from the database first and then pass it as a parameter to the controller, which I am doing on the page's load function:

 protected async System.Threading.Tasks.Task Load()
        {
           perito_id = Database.GetTScePeritos().Result.Where(i => i.asp_user_id == Security.User.Id).First().ID;
        }

but then my idea was to post the url, similarly to the following:

<RadzenUpload Url="upload/single/{@perito_id}" @ParameterName="perito_id" >
                </RadzenUpload>

Also, my upload's controller endpoint looks like this:

 // Single file upload
        [HttpPost("upload/single/{perito_id}")]
        public async Task<IActionResult> SingleAsync(IFormFile file, int perito_id)
        {

By doing this approach I get the error of Component attributes do not support complex content (mixed C# and markup). Attribute: 'Url', text: 'upload/single/{perito_id}'

Since the Services and the Controllers run on completely different threads, I can not fetch anything from the database on the Controller.

How do I go about passing a paramter to the UploadController, and while I'm at it, how could I possibily pass a informartion from the UploadController back to the view?

Hi @Henrique_Araujo,

Here is how you should do it (taken from our online demo):

  <RadzenUpload Url=@($"upload/{customParameter}")  />
1 Like

Hi , I can see your answer on this thread always is the same: "Here is how you should do it" but there is not any good example to follow. Once you are there to help the developers , please make a good and complete example to make the people to understand better how to operate with FileUploader.
Thank you.

This is my code:
<RadzenUpload @ref="upload"
Auto="false"
Multiple="true"
Url=@uploadUrl
Change=@(args => OnChange(args, "Manual Upload"))
Progress=@(args => OnProgress(args, "Manual Upload"))
ChooseText="Scegli il files da caricare."
ParameterName="docText"
Accept=".doc,.docx,.xml" Style="width:100%" />

                    <input id="radio1"
                           type="radio"
                           value="1"
                           name="test"
                           checked=""
                           @onclick="@(() => OnChange($"upload/singlegeneric/{docText}"))" />

private void OnChange(string url)
{
uploadUrl = url;
}

And this is my endpoint:

    [HttpPost("upload/singlegeneric/{docText}")]
    public async Task<IActionResult> singlegeneric(IFormFile file, string docText)
    {
        try
        {

I following the example you taking about but nothing work.. once I click on manual upload nothing happer.

Thank you very much for your help.

You need to call the Upload method of when Auto is set to false. Check our online demo:

<RadzenUpload @ref="upload" Auto="false" Multiple="true" Url="upload/multiple"  />
<RadzenButton Text="Upload" Click=@(args => upload.Upload()) />

Thank you.. I have already the button to upload:


<button class="btn btn-primary btn-sm upload-buttons" @onclick="@(args => upload.Upload())">Carica
<button class="btn btn-primary btn-sm upload-buttons" @onclick="@(()=>_nav.NavigateTo(@backUrl))">Annulla


Ok this is my entire component:

        @if (showProgress)
        {
            @foreach (var item in fileList)
            {
                <tr>
                    <td>
                        @item
                    </td>
                </tr>
            }
        }

    </table>
</div>

This is the code part:
@code {

RadzenUpload upload;
public string docText { get; set; }
private string uploadUrl = "upload/multipleprivate";
private string backUrl = string.Empty;
private int progress;
private bool showProgress = false;
private bool showComplete;
private string completionMessage;
private bool cancelUpload = false;
private List<string> fileList = new List<string>();

protected override void OnInitialized()
{
    backUrl = _open20UserStateContainer.CurrentUrl;
}

private static Logger _logger = LogManager.GetLogger("custom");

private void OnChange(string url)
{
    uploadUrl = url;
}

void CompleteUpload(UploadCompleteEventArgs args)
{
    if (!args.Cancelled)
        completionMessage = "Upload Complete!";
    else
        completionMessage = "Upload Cancelled!";

    showProgress = false;
    showComplete = true;
}

void TrackProgress(UploadProgressArgs args)
{
    showProgress = true;
    showComplete = false;
    progress = args.Progress;

    // cancel upload
    args.Cancel = cancelUpload;

    // reset cancel flag
    cancelUpload = false;
}

void CancelUpload()
{
    cancelUpload = true;
}

int customParameter = 1;

void OnChange(UploadChangeEventArgs args, string name)
{
    foreach (var file in args.Files)
    {

    }
}

void OnProgress(UploadProgressArgs args, string name)
{
    fileList.Clear();
    if (args.Progress == 100)
    {
        showProgress = true;
        foreach (var file in args.Files)
        {
            fileList.Add($"Caricati: {file.Name} - {file.Size} bytes");
        }

    }
}

}

And this is my EndPoint:
[ApiController]
public class UploadApiController : ControllerBase
{
private IWebHostEnvironment _hostingEnvironment;
private Open20UserStateContainer _open20UserStateContainer;
private readonly IConfiguration _configuration;
private string templateBasePath = string.Empty;
private static Logger _logger = LogManager.GetLogger("custom");

    public UploadApiController(IWebHostEnvironment webHostEnvironment, Open20UserStateContainer open20UserStateContainer, IConfiguration configuration)
    {
        _hostingEnvironment = webHostEnvironment;
        _open20UserStateContainer = open20UserStateContainer;
        _configuration = configuration;
        templateBasePath = _configuration.GetValue<string>("TemplatesRootPath");
    }

    //SINGLE
    [HttpPost("upload/singlegeneric/{docText}")]
    public async Task<IActionResult> singlegeneric(IFormFile file, string docText)
    {
        try
        {

What I need is: Upload a file and a small description which should appear into the , string docText) parameter but is empty

Thank you

Carica modelli di word
OnChange(args, "Manual Upload")) Progress=@(args => OnProgress(args, "Manual Upload")) ChooseText="Scegli il files da caricare." Accept=".doc,.docx,.xml" Style="width:100%" />
Carica come documenti generici
Carica come documenti privati
Carica Annulla

What happens when you click the upload button? Do you see any HTTP request being made to your controller? Check your browser's developer tools (the network tab).

This is what I get in chrome dev tools:
upload/singlegeneric/:1 Failed to load resource: the server responded with a status of 400 ()

Anyway nothing happen when I click on Upload button.

The fact that you see a request to your controller means that something happened - RadzenUpload tried to post the file to your controller which failed for some reason. Can you confirm that controllers are enabled in your application?

Yes I confirm.. the controller is active, it is in the same Blazor application.
Note: I get this problem once I added the secon parameter (docText) in the endpoint,
otherways it work perfectly.
So before the new parameter it work, after the I added the new parameter it stop working so the problem is the parameter.
I did try to change the parameter type to int instead of string and I can call the endpoint but the value is always 0 Zero.

This : in the URL before 1 seems wrong. Double check your URL construction logic. Other than that RadzenUpload seems to work as expected in your application and you have configuration / implementation problems that are unrelated.

Ok just please confirm that this is the correct way to pass parameter from the radzen uploader.
I will check again on how to pass parameter to the end point.
Please let me know: is there a way to intercept the url right before the uploader call the endpoint ?
Thank you.

There is no way to intercept the URL - RadzenUpload will use the value set via the Url property.

Ok Thank you for now.. I will update you.