1. Home
  2. Forum
  3. Blazor
  4. SfUploader rawdata

SfUploader rawdata

Hello,

SfUploader on FileSelected method is always empty i want to preview the selected image but it returns always empty string or {} string


another problem is the SfPdfViewerServer loads only from wwwroot but when i load base64 its disconnect and reconnect to server and nothing shown in the page


5 Replies
DM Dhivyabharathi Mohan Syncfusion Team August 31, 2021 01:46 PM UTC

Hi Sadi, 
  
 
Thank you for contacting Syncfusion support. 
  
 
Please find the details, 
  
Query 
Details 
  
SfUploader on FileSelected method is always empty i want to preview the selected image but it returns always empty string or {} string 
  
  
We can get the selected image in the SelectedEventArgs parameter of the FileSelected event. Kindly refer to the below screenshot  
 
  
 
 
 
If you still face any issue, please share us the sufficient information to replicate the issue in our end. This will help us provide a prompt solution  
  
another problem is the SfPdfViewerServer loads only from wwwroot but when i load base64 its disconnect and reconnect to server and nothing shown in the page 
  
  
We have checked by loading the PDF document from base64 string. We were unable to reproduce the reported issue. We have shared the sample and code snippet in which we tried to replicate this issue. 
  
  
Code snippet: 
  
  
<SfPdfViewerServer @ref="@PdfViewer" DocumentPath="@DocumentPath"> 
    <PdfViewerEvents Created="created"></PdfViewerEvents> 
    </SfPdfViewerServer> 
  
public void created() 
  
    { 
  
        byte[] byteArray = System.IO.File.ReadAllBytes("wwwroot/Data/test.pdf"); 
  
        string base64String = Convert.ToBase64String(byteArray); 
  
        DocumentPath = "data:application/pdf;base64," + base64String; 
  
    } 
  
  
  
Could you please try the sample and revert us, whether the reported issue is resolved or not? If the issue is not resolved, kindly share the modified sample in which you are facing this issue. It will be helpful for us to investigate further and provide the details at the earliest. 
  
  
  
  
Regards, 
Dhivya. 
 


SA Sadi August 31, 2021 01:52 PM UTC

another problem is the SfPdfViewerServer loads only from wwwroot but when i load base64 its disconnect and reconnect to server and nothing shown in the page 


i solved this by increasing the  MaximumReceiveMessageSize on hub options


We can get the selected image in the SelectedEventArgs parameter of the FileSelected event. yes we can but how i can show the selected image without the need to upload it to server the raw file is empty as it shown in the picture



DM Dhivyabharathi Mohan Syncfusion Team September 1, 2021 03:20 PM UTC

Hi Said, 
 
 
Please find the details, 
 
Query 
Details 
 
another problem is the SfPdfViewerServer loads only from wwwroot but when i load base64 its disconnect and reconnect to server and nothing shown in the page  
 
i solved this by increasing the  MaximumReceiveMessageSize on hub options 
 
 
Thank you for your update. We are glad to know that the reported issue is resolved. 
We can get the selected image in the SelectedEventArgs parameter of the FileSelected event. yes we can but how i can show the selected image without the need to upload it to server the raw file is empty as it shown in the picture 
 
 
We modified the sample based on the requirement. Also, convert the file to base64 string and set to the source element of image. Refer the below code.  


 
<div class="col-lg-12 control-section">  
    <div class="control_wrapper">  
        <div id="dropArea" style="height: auto; overflow: auto">  
            <SfUploader @ref="uploderObj" ID="UploadFiles" AllowedExtensions=".png,.jpeg,jpg">  
                <UploaderEvents ValueChange="onChange" OnRemove="onRemove" OnUploadStart="OnUpload"></UploaderEvents>  
                <UploaderTemplates>  
                    <Template>  
                        <span class="wrapper">  
                            <img class="upload-image" alt="Image"  
                                 src="@(files.Count >0 ? files.Where(item=>item.Name == context.Name)?.FirstOrDefault()?.Path : string.Empty)">  
                        </span>  
                        <div class="name file-name" title="@(context.Name)">@(context.Name)</div>  
                        <div class="file-size">@(context.Size)</div>  
                        <span class="e-icons e-file-remove-btn remove" id="removeIcon" title="Remove"></span>  
                        <span class="e-upload-icon e-icons e-file-remove-btn" title="Upload" id="iconUpload" @onclick="uploadFile"></span>  
                    </Template>  
                </UploaderTemplates>  
  
            </SfUploader>  
  
        </div>  
    </div>  
</div>  
<style>  
    .control_wrapper {  
        width: 350px;  
        margin: 0 auto;  
    }  
</style>  
  
  
<style>  
    .control_wrapper {  
        width: 350px;  
        margin: 0 auto;  
    }  
</style>  
  
  
@code {  
    private SfUploader uploderObj;  
    private Syncfusion.Blazor.Inputs.FileInfo[] selectedFile { get; set; }  
    List<fileInfo> files = new List<fileInfo>();  
    public bool isUploaded { get; set; } = false;  
    public void OnUpload(UploadingEventArgs args)  
    {  
  
    }  
    public async Task onSelect(SelectedEventArgs args)  
    {  
        await uploderObj.UploadAsync();  
        isUploaded = true;  
    }  
  
    public class fileInfo  
    {  
        public string Path { get; set; }  
        public string Name { get; set; }  
        public double Size { get; set; }  
    }  
  
    public void onChange(UploadChangeEventArgs args)  
    {  
  
        if(isUploaded == false)  
        {  
            foreach (var file in args.Files)  
            {  
                byte[] bytes = file.Stream.ToArray();  
                string base64 = Convert.ToBase64String(bytes);  
                files.Add(new fileInfo() { Path = @"data:image/" + file.FileInfo.Type + ";base64," + base64, Name = file.FileInfo.Name, Size = file.FileInfo.Size });  
                isUploaded = false;  
            }  
        }  
        else if(isUploaded == true)  
        {  
            foreach (var file in args.Files)  
            {  
  
                var path = Path.GetFullPath("wwwroot\\Images\\") + file.FileInfo.Name;  
                FileStream filestream = new FileStream(path, FileMode.Create, FileAccess.Write);  
                file.Stream.WriteTo(filestream);  
                filestream.Close();  
                file.Stream.Close();  
                isUploaded = false;   
            }  
        }  
    }  
    public void onRemove(RemovingEventArgs args)  
    {  
        foreach (var removeFile in args.FilesData)  
        {  
            if (File.Exists(Path.Combine(@"wwwroot\Images", removeFile.Name)))  
            {  
                File.Delete(Path.Combine(@"wwwroot\Images\", removeFile.Name));  
            }  
        }  
    }  
  
    public void uploadFile(MouseEventArgs args)  
    {  
        this.uploderObj.Upload();  
        isUploaded = true;  
    }  
}  


 
Please find the sample below.  
 
 
 
 
 
Kindly try this and revert us, if you have any concerns. 
 
 
Regards, 
Dhivya. 
 


SA Sadi September 10, 2021 08:12 AM UTC

thanks this worked


DR Desika Rajendran Syncfusion Team September 13, 2021 10:46 AM UTC

Hi Sadi,  
  
Thank you for the update.  We are glad to know that the issue was resolved. Please revert to us if you need any further assistance   
  
Regards,  
Desika  



Loader.
Up arrow icon