CODEWITHSUNDEEP
htmlblazor
Bhargavi
Bhargavi

Reputation: 41

How to show File Saveas Dialog in Blazor Server App

I am new to Blazor and trying to show File Saveas Dialog as shown in following link on a button click. Save as Image

The requirement is - upon clicking the Saveas button above Saveas dialog should be popped up where user can choose the destination of file and file name.

I have tried "enabling the setting to check the save location in the download settings of the browser" and it works. But we do not want to depend on the Browser settings.

Please add your thoughts on below..

  1. Instead of depending on the browser settings is there any other way to show Saveas dialog?

  2. Are there any open source Nuget packages available to help on this?

NOTE: I am using .NET 6.0 for building my application

Thanks in advance,

Bhargavi Gowri.

Upvotes: 4

Views: 4059

Answers (2)

Bennyboy1973
Bennyboy1973

Reputation: 4246

This isn't a Blazor thing. In web browsers, files are downloaded from links using <a> tag in HTML using the download attribute. Just create a link to your file:

<a href="path_to_file" download>Save</a>
<a href="link_path_to_file" download="suggested_name">Save</a>

The path must be on the same server, but blob and data links will work as well.

If you do not suggest a name, the browser will use the original filename (possibly changed to remove symbols the OS doesn't allow in file paths).

https://caniuse.com/download

If you want your link to look like a button, then that's a different issue, and you can google or ask that.

Upvotes: 4

dstankovskii
dstankovskii

Reputation: 49

I also wanted to bring up a window to save a file in which the user could select a folder. Before that, the system automatically saved to the Downloads folder.

As I understood, there was no such possibility before, but now it is possible thanks to this api: https://caniuse.com/native-filesystem-api.

I found this solution in the answer to this question: https://stackoverflow.com/a/70001920/16740180.

It's worth noting that I use Blazor WebAssembly and not a Blazor Server. And I do not know if it will work for you.

Unfortunately, this doesn't work for mobile devices right now, but it works fine for windows. I hope this helps someone.

Upvotes: 2

Related Questions