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. Image for the cookie policy date

Uploader server API

Hi,

do u have any example for Server Controller for SaveUrl and RemoveUrl action since i can not find any example for it

thx,
erick


23 Replies

BC Berly Christopher Syncfusion Team July 16, 2019 05:48 AM UTC

Hi Erick,   
  
 
Greetings from Syncfusion Support. 
  
 
We prepared the default uploader and configured the controller to save and remove action. 
 
  
Please find the latest nuget below, 
 
 
  
Please find the UG Documentation link for Save and Remove action 
 
 
  
Please find the sample below, 
 
 
  
Regards, 
Berly B.C 



ER Erick July 16, 2019 10:00 AM UTC

hi,

thx for the link

after i updated to latest version, i got an error in aggregate columns saying "The name 'Sum' does not exist in the current context"



BC Berly Christopher Syncfusion Team July 17, 2019 05:08 AM UTC

Hi Erick,
We have checked your reported problem and we suspect that you have not updated the latest version ejs.interop.min.js and ej2.min.js (17.2.34 version) in your application. So please refer to the latest version files like below code.   

[_Host.cshtml

  
Please let me know if you have any questions. 

Regards, 
Berly B.C 



ER Erick July 17, 2019 05:21 AM UTC

Hi,

after the update in js files, the problem still exists



VN Vignesh Natarajan Syncfusion Team July 17, 2019 10:47 AM UTC

Hi Erick,  
 
Query: “after the update in js files, the problem still exists 

Based on your suggestion we have prepared a sample and we are able to reproduce the reported issue in our end too. This is because in our latest Nuget release (17.2.0.34) we have modified our event arguments and some of our properties as strongly typed. Hence the reported issue occurred. To overcome the reported issue kindly modify the Type of GridAggregateColumn as below  

<EjsGrid DataSource="@data" Allowpaging="true"> 
    <GridAggregates> 
        <GridAggregate> 
            <GridAggregatecolumns> 
                <GridAggregatecolumn Field="Freight" Type="AggregateType.Sum"></GridAggregatecolumn> 
            </GridAggregatecolumns> 
        </GridAggregate>        
    </GridAggregates> 
    <GridColumns> 
…………………………………………………….. 
    </GridColumns> 
</EjsGrid> 

For your convenience we have prepared a sample which can be downloaded from below  


Please get back to us if you have any other queries.   

Regards, 
Vignesh Natarajan. 



ER Erick July 19, 2019 11:16 AM UTC

thx, it works now


ER Erick July 21, 2019 03:02 PM UTC

Hi,

is there any sample how to get the filename after uploaded? because we need to save the filename and it's part of registration process 

since the uploader 'directly post' when click the upload so i'm thinking to 'resend' the filename back to the page and save it as part of the registration

thx,
erick


BC Berly Christopher Syncfusion Team July 22, 2019 09:32 AM UTC

Hi Erick, 
  
Yes, we can get the file name after the file uploaded to the server using our “Success” event as mentioned in the below code example. Here, we have deserialized the success event arguments using JSON convertor to get the file name. 
  
@page "/" 
@using Newtonsoft.Json; 
@using Newtonsoft.Json.Converters; 
 
 
<EjsUploader ID="UploadFiles" Success="@OnSuccess"> 
    <UploaderAsyncSettings SaveUrl="api/SampleData/Save" RemoveUrl="api/SampleData/Remove"></UploaderAsyncSettings> 
</EjsUploader> 
<div> 
    <p>Uploaded File name is: @FileName</p> 
</div> 
@code{ 
    public string FileName; 
    public void OnSuccess(object args) 
    { 
        //Deserialized the success event args using Newton soft. 
        SuccessEventArgs eventArgs = JsonConvert.DeserializeObject<SuccessEventArgs>(args.ToString()); 
        // Assign the file name in the variable 
        FileName = eventArgs.File.Name; 
        // To reflect the DOM content 
        this.StateHasChanged(); 
    } 
    //Success event args class. 
    public class SuccessEventArgs 
    { 
        public object E { get; set; } 
        public FileInfo File { get; set; } 
        public string StatusText { get; set; } 
        public string Name { get; set; } 
        public string Operation { get; set; } 
        public ResponseEventArgs Response { get; set; } 
    } 
 
    public class ResponseEventArgs 
    { 
        public string Headers { get; set; } 
        public object ReadyState { get; set; } 
        public object StatusCode { get; set; } 
        public string StatusText { get; set; } 
        public bool withCredentials { get; set; } 
    } 
} 

  
Please find the sample from the below link. 
  
Also, currently we are working on to provide the specific type for success event arguments and this support will be included in our patch release scheduled on mid of August 2019. We appreciate your patience until then. 
   
You can track the status of the issue from the below feedback link. 
  
Regards, 
Berly B.C 



ER Erick July 26, 2019 04:22 AM UTC

Hi, thx for the info..

Your example can work and i can get the file name but it will break when i try to upload a bigger file (> 5kb), 
i already set the MinFileSize="1024" MaxFileSize="1000000" accordingly.

at first i thought the code was wrong then i realize it has size limitation which occur eventhough we already set the maxfilesize property

any insight?

thx,
erick


BC Berly Christopher Syncfusion Team July 26, 2019 12:10 PM UTC

Hi Erick, 
  

Sorry for the inconvenience. 

  
In the provided code example, you set the MaxFileSize is 1 MB for the Uploader component. But, we can upload the file up to 1 MB at our end and the reported issue is not reproduced in the given sample. Please attached the below screenshot to demonstrate this. 

Screenshot: 
 
 

Please check the attached sample from below. 

 
  
Also, ASP.NET Blazor application allow us to upload the limited size of files only. If you want to upload the large number of files, EJ2 Blazor file upload have the feature of chunck upload which is used to upload large number of files and it will split the file based on the size (In bytes) provided in ChunkSize API and sent the multiple requests. 

  
Please refer the below code example. 

<EjsUploader ID="UploadFiles" MaxFileSize="1048576000"> 
    <UploaderAsyncSettings SaveUrl="api/SampleData/Save" RemoveUrl="api/SampleData/Remove" ChunkSize="500000"></UploaderAsyncSettings> 
</EjsUploader> 

  

  
Still issue persists, please revert with issue reproducing sample and which kind of files are uploaded in the Uploader component that will help us to check and provide the exact solution at our end.  

  
Regards, 
Berly B.C


ER Erick July 26, 2019 04:11 PM UTC

Hi Berly,

Thanks for the update.. Ur sampe seems to work but it does not work in mine

I'm using serverside blazor
I attached what i mean

Thx, 
Erick

Attachment: VID_20190726_230301_2623688b.zip


ER Erick July 28, 2019 06:58 AM UTC

I think because the default limitation size in signalR that mention in this link but i'm not sure and i can't configure it right to test it..

using preview7 now and syncfusion 35 beta, and also upgrade the ej2.min and ej2.interop to 35 version

thx,
erick


ER Erick July 29, 2019 04:36 AM UTC

hi, 


i'm able to solve the issue

the configuration something like this
   
            services.AddSignalR(e =>
            {
                e.MaximumReceiveMessageSize = 5000000;
            });

the link come from this 


BC Berly Christopher Syncfusion Team July 29, 2019 07:02 AM UTC

Hi Erick, 
  

Thanks for the update. 
  

We would like to inform you that, if you are using server-side Blazor application, there are certain limitations (32 KB) to upload the files to the server. So, we need to go to configure the MaximumReceiveMessageSize using SignalR as mentioned in your last update.  

  
Uploader is working fine since we have provided the sample using the client-side hosted application in our last update. As we stated earlier, if you want to upload the large size of files in our Blazor Uploader, we suggest you to use chunk upload as mentioned in the below UG documentation link.  
 
  

  
Regards, 
Berly B.C 



ER Erick July 30, 2019 03:55 AM UTC

Yes,

thanks for clarify it.

We'll keep in mind about chunk upload

thx,
erick


BC Berly Christopher Syncfusion Team July 30, 2019 06:06 AM UTC

Hi Erick, 

  
Most Welcome, Please let us know, if you need any further assistance. 

  
Regards, 
Berly B.C 



ER Erick August 21, 2019 05:01 AM UTC

Hi, 

It seems i had another error when upgrade it to latest version (46) and blazor prev 8

there is no "Success" event, any insight?

thx,
erick


ER Erick August 21, 2019 10:52 AM UTC

Hi,

i know the answer

use "Events" something like below:

  <EjsUploader ID="uploadFiles3" Enabled="@Upload3" Multiple="false" AllowedExtensions=".jpg,.jpeg,.png" MinFileSize="3000" MaxFileSize="5000000">
                        <UploaderEvents Success="@OnSuccess3"></UploaderEvents>
                        <UploaderAsyncSettings SaveUrl="api/SJUploader/Save3" RemoveUrl="api/SJUploader/Remove3" ChunkSize="5000"></UploaderAsyncSettings>
                    </EjsUploader>

thx,
erick


GG Gopi Govindasamy Syncfusion Team August 21, 2019 12:29 PM UTC

Hi Erick,  

We have checked your reported issue and this issue is known issue in our end. We have already logged bug in our end. We will fix the issue and the fix is include in our upcoming patch release and scheduled on 27th August 2019. You can track the status of the reported issue from the below feedback link. 


We have created a private Nuget for this fix and please find the attachment  

 
Thanks for your patience and we will deliver the fix to patch release as promised. 

Note: Clear NuGet cache and refer the local Nuget.  
 
We have prepared sample and code snippet for your reference.  

@using Syncfusion.EJ2.Blazor 
@using Syncfusion.EJ2.Blazor.Inputs 
 
    <EjsUploader> 
        <UploaderEvents Success="OnSuccess"></UploaderEvents> 
        <UploaderAsyncSettings SaveUrl="https://aspnetmvc.syncfusion.com/services/api/uploadbox/Save" 
                               RemoveUrl="https://aspnetmvc.syncfusion.com/services/api/uploadbox/Remove"></UploaderAsyncSettings> 
    </EjsUploader> 
 
@code{ 
 
    public string Status { get; set; } 
 
    public void OnSuccess(SuccessEventArgs args) 
    { 
        this.Status = args.StatusText; 
    } 
} 

 
Regard, 
Gopi G. 



RA Riyan Afriyanto August 28, 2019 09:22 AM UTC

Hi Berly,

I follow this Post and try your code for this

@page "/" 
@using Newtonsoft.Json; 
@using Newtonsoft.Json.Converters; 
 
 
<EjsUploader ID="UploadFiles" Success="@OnSuccess"> 
    <UploaderAsyncSettings SaveUrl="api/SampleData/Save"RemoveUrl="api/SampleData/Remove">UploaderAsyncSettings> 
EjsUploader> 
<div> 
    <p>Uploaded File name is: @FileNamep> 
div> 
@code{ 
    public string FileName; 
    public void OnSuccess(object args) 
    { 
        //Deserialized the success event args using Newton soft. 
        SuccessEventArgs eventArgs = JsonConvert.DeserializeObject(args.ToString()); 
        // Assign the file name in the variable 
        FileName = eventArgs.File.Name; 
        // To reflect the DOM content 
        this.StateHasChanged(); 
    } 
    //Success event args class. 
    public class SuccessEventArgs 
    { 
        public object E { getset; } 
        public FileInfo File { getset; } 
        public string StatusText { getset; } 
        public string Name { getset; } 
        public string Operation { getset; } 
        public ResponseEventArgs Response { getset; } 
    } 
 
    public class ResponseEventArgs 
    { 
        public string Headers { getset; } 
        public object ReadyState { getset; } 
        public object StatusCode { getset; } 
        public string StatusText { getset; } 
        public bool withCredentials { getset; } 
    } 
} 



when I still use Syncfusion.EJ2.Blazor 17.2.0.46-beta it still good running, but after I upgrade to 17.2.0.47 I have trouble with DeserializeObject like in this img

Attachment: DsO_4a583690.zip


GG Gopi Govindasamy Syncfusion Team August 29, 2019 09:04 AM UTC

Hi Erick,  

We would like to inform you, we have provided specific type for Success event instead of anonymous type. So, you can get the argument directly from SuccessEventArgs.  

Please find the code snippet and sample for your reference.  

Note:  We have update this details in the below feedback link.  



@using Syncfusion.EJ2.Blazor.Inputs 
 
<EjsUploader> 
    <UploaderEvents Success="OnSuccess"></UploaderEvents> 
    <UploaderAsyncSettings SaveUrl="https://aspnetmvc.syncfusion.com/services/api/uploadbox/Save" 
                           RemoveUrl="https://aspnetmvc.syncfusion.com/services/api/uploadbox/Remove"></UploaderAsyncSettings> 
</EjsUploader> 
 
<p> 
    Uploaded File name is: @FileName 
</p> 
 
@code{ 
 
    public string FileName { get; set; } 
    public void OnSuccess(SuccessEventArgs args) 
    { 
        this.FileName = args.File.Name; 
    } 
} 

 
Regards, 
Gopi G. 



RA Riyan Afriyanto August 30, 2019 02:05 AM UTC

Hi Gopi,

thanks, now it run like as my expected. Thank you so much


GG Gopi Govindasamy Syncfusion Team August 30, 2019 04:54 AM UTC

Hi Erick, 

Thanks for your update. 

We are happy to hear that your issue has been resolved. Please feel free to contact us if you need any further assistance on Syncfusion components. 

Regards,
Gopi G. 
 


Loader.
Up arrow icon