We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. (Last updated on: June 24, 2019).
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

Multiple Uploader elements on one page

Thread ID:

Created:

Updated:

Platform:

Replies:

150512 Jan 9,2020 11:59 AM UTC Jul 28,2020 04:07 AM UTC ASP.NET Core - EJ 2 5
loading
Tags: File Upload
Patrik Volka
Asked On January 9, 2020 11:59 AM UTC

Hi guys,
I can't solve one problem.
On the page, I will encounter several Uploader elements, each located in a different Form element, and each has a different handler for saving the file.
The problem is that all Uploader elements call the Uploader method that is located in the Razor page layout.

How do I make each Uploader element call the method it is associated with?

I apologize for my bad English.

Thank you for any advice.

Attachment: UploaderProblem_6b91a389.zip

Sevvandhi Nagulan [Syncfusion]
Replied On January 12, 2020 05:17 PM UTC

Hi Patrik, 

Greetings from Syncfusion support. 

We have checked the shared  code snippet. We would like to inform you that, when you place the uploader inside the form then saveUrl and removeUrl must be null. So, you can get the file in form post and can save in server side. We have prepared the sample with uploader inside the form & without the form and handled the unique save and remove action. Kindly refer the below code, 

[index.cshtml] 

@{ 
    var asyncSettings = new Syncfusion.EJ2.Inputs.UploaderAsyncSettings { SaveUrl = "https://localhost:44362/Home/Save/", RemoveUrl = "https://localhost:44362/Home/Remove" }; 
 } 
 
<ejs-uploader id="UploadFiles" asyncSettings="@asyncSettings"> 
</ejs-uploader> 
 
<form action="https://localhost:44362/Home/BlogSave" method="post"> 
    <ejs-uploader id="UploadFiles1"></ejs-uploader> 
    <input type="submit" value="Upload" class="e-btn" /> 
</form> 

Please find the sample below, 


Regards, 
Sevvandhi N 


Albert Karam
Replied On July 26, 2020 10:17 AM UTC

Hello,
I have a related inquiry. I'm trying to add a couple of file uploaders in the same page as follows:

Upload Your Logo Here

Use PNG transparent logo file.

@{
    var asyncSettings = new Syncfusion.EJ2.Inputs.UploaderAsyncSettings { SaveUrl = "/SystemSetting/UploadCustomerLogo", RemoveUrl = "/SystemSetting/Remove" };
}

Upload eLogin Background Here

Use JPG image file.

@{
    var asyncBackgroundSettings = new Syncfusion.EJ2.Inputs.UploaderAsyncSettings { SaveUrl = "/SystemSetting/UploadBackground", RemoveUrl = "/SystemSetting/Remove" };
}

Each of the file uploaders direct to different POST request to save the file in a different location.

My problem is that with the second uploader (uploadFiles2) i don't receive the uploaded file in the post request.


Sevvandhi Nagulan [Syncfusion]
Replied On July 27, 2020 06:16 AM UTC

Hi Albert, 


Greetings from Syncfusion support. 

We would like to inform you that, by using the name attribute in the Uploader component, we can get the file on the server side. We can give any name to the component Id but you can get the file on the server side by using the same Id name. Also, we suggest to use the unique Save and Remove handler when you use multiple uploader in the same page.  And, receive the file by using the corresponding Id name provided in the code. Refer to the code below, 
 
[index.cshtml] 
 
@{ 
    var asyncSettings = new Syncfusion.EJ2.Inputs.UploaderAsyncSettings { SaveUrl = "https://localhost:44362/Home/Save/", RemoveUrl = "https://localhost:44362/Home/Remove" }; 
} 
@{ 
    var asyncSettings1 = new Syncfusion.EJ2.Inputs.UploaderAsyncSettings { SaveUrl = "https://localhost:44362/Home/BlogSave/", RemoveUrl = "https://localhost:44362/Home/BlogRemove" }; 
} 
<ejs-uploader id="UploadFiles" asyncSettings="@asyncSettings"> 
</ejs-uploader> 
 
<ejs-uploader id="uploadFiles2" asyncSettings="@asyncSettings1"> 
</ejs-uploader> 
 
[HomeController.cs] 
 
public IActionResult Save(IList<IFormFile> UploadFiles) 
        { 
            try 
            { 
 
 
 
} 
 
public IActionResult BlogSave(IList<IFormFile> uploadFiles2) 
        { 
            Try 
 
 
 
 
} 
 



Regards, 
Sevvandhi N 


Albert Karam
Replied On July 27, 2020 12:49 PM UTC

Thanks @Sevvandhi N

Issue resolved

Sevvandhi Nagulan [Syncfusion]
Replied On July 28, 2020 04:07 AM UTC

Hi Albert, 


Thanks for the update. Please let us know if you need any other further assistance. 


Regards, 
Sevvandhi N 


CONFIRMATION

This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

Please sign in to access our forum

This page will automatically be redirected to the sign-in page in 10 seconds.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon

Live Chat Icon For mobile
Live Chat Icon