Skip to content

Commit db16130

Browse files
committed
897088: Addressed the review comments.
1 parent 6323572 commit db16130

File tree

1 file changed

+164
-163
lines changed

1 file changed

+164
-163
lines changed

ej2-asp-core-mvc/spreadsheet/open-save.md

Lines changed: 164 additions & 163 deletions
Original file line numberDiff line numberDiff line change
@@ -115,6 +115,81 @@ You can achieve to access the remote excel file by using the [`created`](https:/
115115
{% endtabs %}
116116
{% endif %}
117117

118+
### Open an excel file from blob data
119+
120+
By default, the Spreadsheet control provides an option to browse files from the local file system and open them within the control. If you want to open an Excel file from blob data, you need to fetch the blob data from the server or another source and convert this blob data into a `File` object. Then, you can use the `open` method in the Spreadsheet control to load that `File` object.
121+
122+
Please find the code to fetch the blob data and load it into the Spreadsheet control below.
123+
124+
{% if page.publishingplatform == "aspnet-core" %}
125+
126+
{% tabs %}
127+
{% highlight cshtml tabtitle="CSHTML" %}
128+
{% include code-snippet/spreadsheet/open-from-blob/tagHelper %}
129+
{% endhighlight %}
130+
{% highlight c# tabtitle="OpenController.cs" %}
131+
{% include code-snippet/spreadsheet/open-from-blob/opencontroller.cs %}
132+
{% endhighlight %}
133+
{% endtabs %}
134+
135+
{% elsif page.publishingplatform == "aspnet-mvc" %}
136+
137+
{% tabs %}
138+
{% highlight razor tabtitle="CSHTML" %}
139+
{% include code-snippet/spreadsheet/open-from-blob/razor %}
140+
{% endhighlight %}
141+
{% highlight c# tabtitle="OpenController.cs" %}
142+
{% include code-snippet/spreadsheet/open-from-blob/opencontroller.cs %}
143+
{% endhighlight %}
144+
{% endtabs %}
145+
{% endif %}
146+
147+
### Open an Excel file located on a server
148+
149+
By default, the Spreadsheet control provides an option to browse files from the local file system and open them within the control. If you want to load an Excel file located on a server, you need to configure the server endpoint to fetch the Excel file from the server location, process it using `Syncfusion.EJ2.Spreadsheet.AspNet.Core`, and send it back to the client side as `JSON data`. On the client side, you should use the `openFromJson` method to load that `JSON data` into the Spreadsheet control.
150+
151+
```csharp
152+
public IActionResult Open([FromBody] FileOptions options)
153+
{
154+
OpenRequest open = new OpenRequest();
155+
string filePath = _env.ContentRootPath.ToString() + "\\Files\\" + options.FileName + ".xlsx";
156+
// Getting the file stream from the file path.
157+
FileStream fileStream = new FileStream(filePath, FileMode.Open);
158+
// Converting "MemoryStream" to "IFormFile".
159+
IFormFile formFile = new FormFile(fileStream, 0, fileStream.Length, "", options.FileName + ".xlsx");
160+
open.File = formFile;
161+
// Processing the Excel file and return the workbook JSON.
162+
var result = Workbook.Open(open);
163+
fileStream.Close();
164+
return Content(result);
165+
}
166+
167+
public class FileOptions
168+
{
169+
public string FileName { get; set; } = string.Empty;
170+
}
171+
```
172+
173+
```js
174+
175+
// Fetch call to server to load the Excel file.
176+
fetch('Home/Open', {
177+
method: 'POST',
178+
headers: {
179+
'Content-Type': 'application/json',
180+
},
181+
body: JSON.stringify({ FileName: 'Sample' }),
182+
})
183+
.then((response) => response.json())
184+
.then((data) => {
185+
// Load the JSON data into spreadsheet.
186+
spreadsheet.openFromJson({ file: data });
187+
})
188+
189+
```
190+
191+
You can find the server endpoint code to fetch and process the Excel file in this [attachment](https://www.syncfusion.com/downloads/support/directtrac/general/ze/WebApplication1_(1)-880363187).
192+
118193
### Open an excel file using a hosted web service in AWS Lambda
119194

120195
Before proceeding with the opening process, you should deploy the spreadsheet open/save web API service in AWS Lambda. To host the open/save web service in the AWS Lambda environment, please refer to the following KB documentation.
@@ -367,82 +442,7 @@ You can add your own custom header to the open action in the Spreadsheet. For pr
367442
{% include code-snippet/spreadsheet/open-header/opencontroller.cs %}
368443
{% endhighlight %}
369444
{% endtabs %}
370-
{% endif %}
371-
372-
### To open an excel file from blob data
373-
374-
By default, the Spreadsheet control provides an option to browse files from the local file system and open them within the control. If you want to open an Excel file from blob data, you need to fetch the blob data from the server or another source and convert this blob data into a `File` object. Then, you can use the `open` method in the Spreadsheet control to load that `File` object.
375-
376-
Please find the code to fetch the blob data and load it into the Spreadsheet control below.
377-
378-
{% if page.publishingplatform == "aspnet-core" %}
379-
380-
{% tabs %}
381-
{% highlight cshtml tabtitle="CSHTML" %}
382-
{% include code-snippet/spreadsheet/open-from-blob/tagHelper %}
383-
{% endhighlight %}
384-
{% highlight c# tabtitle="OpenController.cs" %}
385-
{% include code-snippet/spreadsheet/open-from-blob/opencontroller.cs %}
386-
{% endhighlight %}
387-
{% endtabs %}
388-
389-
{% elsif page.publishingplatform == "aspnet-mvc" %}
390-
391-
{% tabs %}
392-
{% highlight razor tabtitle="CSHTML" %}
393-
{% include code-snippet/spreadsheet/open-from-blob/razor %}
394-
{% endhighlight %}
395-
{% highlight c# tabtitle="OpenController.cs" %}
396-
{% include code-snippet/spreadsheet/open-from-blob/opencontroller.cs %}
397-
{% endhighlight %}
398-
{% endtabs %}
399-
{% endif %}
400-
401-
### To open an Excel file located on a server
402-
403-
By default, the Spreadsheet control provides an option to browse files from the local file system and open them within the control. If you want to load an Excel file located on a server, you need to configure the server endpoint to fetch the Excel file from the server location, process it using `Syncfusion.EJ2.Spreadsheet.AspNet.Core`, and send it back to the client side as `JSON data`. On the client side, you should use the `openFromJson` method to load that `JSON data` into the Spreadsheet control.
404-
405-
```csharp
406-
public IActionResult Open([FromBody] FileOptions options)
407-
{
408-
OpenRequest open = new OpenRequest();
409-
string filePath = _env.ContentRootPath.ToString() + "\\Files\\" + options.FileName + ".xlsx";
410-
// Getting the file stream from the file path.
411-
FileStream fileStream = new FileStream(filePath, FileMode.Open);
412-
// Converting "MemoryStream" to "IFormFile".
413-
IFormFile formFile = new FormFile(fileStream, 0, fileStream.Length, "", options.FileName + ".xlsx");
414-
open.File = formFile;
415-
// Processing the Excel file and return the workbook JSON.
416-
var result = Workbook.Open(open);
417-
fileStream.Close();
418-
return Content(result);
419-
}
420-
421-
public class FileOptions
422-
{
423-
public string FileName { get; set; } = string.Empty;
424-
}
425-
```
426-
427-
```js
428-
429-
// Fetch call to server to load the Excel file.
430-
fetch('Home/Open', {
431-
method: 'POST',
432-
headers: {
433-
'Content-Type': 'application/json',
434-
},
435-
body: JSON.stringify({ FileName: 'Sample' }),
436-
})
437-
.then((response) => response.json())
438-
.then((data) => {
439-
// Load the JSON data into spreadsheet.
440-
spreadsheet.openFromJson({ file: data });
441-
})
442-
443-
```
444-
445-
You can find the server endpoint code to fetch and process the Excel file in this [attachment](https://www.syncfusion.com/downloads/support/directtrac/general/ze/WebApplication1_(1)-880363187).
445+
{% endif %}
446446

447447
### External workbook confirmation dialog
448448

@@ -523,6 +523,93 @@ N> * Use `Ctrl + S` keyboard shortcut to save the Spreadsheet data as Excel file
523523
<br/> * The default value of [allowSave](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Spreadsheet.Spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_AllowSave) property is `true`. For demonstration purpose, we have showcased the [allowSave](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Spreadsheet.Spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_AllowSave) property in previous code snippet.
524524
<br/> * Demo purpose only, we have used the online web service url link.
525525

526+
### Save an excel file as blob data
527+
528+
By default, the Spreadsheet control saves the Excel file and downloads it to the local file system. If you want to save an Excel file as blob data, you need to set `needBlobData` property to **true** and `isFullPost` property to **false** in the `beforeSave` event of the spreadsheet. Subsequently, you will receive the spreadsheet data as a blob in the `saveComplete` event. You can then post the blob data to the server endpoint for saving.
529+
530+
Please find below the code to retrieve blob data from the Spreadsheet control below.
531+
532+
{% if page.publishingplatform == "aspnet-core" %}
533+
534+
{% tabs %}
535+
{% highlight cshtml tabtitle="CSHTML" %}
536+
{% include code-snippet/spreadsheet/save-as-blob/tagHelper %}
537+
{% endhighlight %}
538+
{% highlight c# tabtitle="SaveController.cs" %}
539+
{% include code-snippet/spreadsheet/save-as-blob/savecontroller.cs %}
540+
{% endhighlight %}
541+
{% endtabs %}
542+
543+
{% elsif page.publishingplatform == "aspnet-mvc" %}
544+
545+
{% tabs %}
546+
{% highlight razor tabtitle="CSHTML" %}
547+
{% include code-snippet/spreadsheet/save-as-blob/razor %}
548+
{% endhighlight %}
549+
{% highlight c# tabtitle="SaveController.cs" %}
550+
{% include code-snippet/spreadsheet/save-as-blob/savecontroller.cs %}
551+
{% endhighlight %}
552+
{% endtabs %}
553+
{% endif %}
554+
555+
### Save an Excel file to a server
556+
557+
By default, the Spreadsheet control saves the Excel file and downloads it to the local file system. If you want to save an Excel file to a server location, you need to configure the server endpoint to convert the spreadsheet data into a file stream and save it to the server location. To do this, first, on the client side, you must convert the spreadsheet data into `JSON` format using the `saveAsJson` method and send it to the server endpoint. On the server endpoint, you should convert the received spreadsheet `JSON` data into a file stream using `Syncfusion.EJ2.Spreadsheet.AspNet.Core`, then convert the stream into an Excel file, and finally save it to the server location.
558+
559+
```js
560+
561+
// Convert the spreadsheet workbook to JSON data.
562+
spreadsheet.saveAsJson().then((json) => {
563+
const formData = new FormData();
564+
formData.append('FileName', "Sample");
565+
formData.append('saveType', 'Xlsx');
566+
// Passing the JSON data to perform the save operation.
567+
formData.append('JSONData', JSON.stringify(json.jsonObject.Workbook));
568+
formData.append('PdfLayoutSettings', JSON.stringify({ FitSheetOnOnePage: false }));
569+
// Using fetch to invoke the save process.
570+
fetch('Home/Save', {
571+
method: 'POST',
572+
body: formData
573+
}).then((response) => {
574+
console.log(response);
575+
});
576+
});
577+
578+
```
579+
580+
```csharp
581+
582+
public string Save(SaveSettings saveSettings)
583+
{
584+
ExcelEngine excelEngine = new ExcelEngine();
585+
IApplication application = excelEngine.Excel;
586+
try
587+
{
588+
589+
// Save the workbook as stream.
590+
Stream fileStream = Workbook.Save<Stream>(saveSettings);
591+
// Using XLSIO, we are opening the file stream and saving the file in the server under "Files" folder.
592+
// You can also save the stream file in your server location.
593+
IWorkbook workbook = application.Workbooks.Open(fileStream);
594+
string basePath = _env.ContentRootPath + "\\Files\\" + saveSettings.FileName + ".xlsx";
595+
var file = System.IO.File.Create(basePath);
596+
fileStream.Seek(0, SeekOrigin.Begin);
597+
// To convert the stream to file options.
598+
fileStream.CopyTo(file);
599+
file.Dispose();
600+
fileStream.Dispose();
601+
return string.Empty;
602+
}
603+
catch (Exception ex)
604+
{
605+
return ex.Message;
606+
}
607+
}
608+
609+
```
610+
611+
You can find the server endpoint code to save the spreadsheet data as an Excel file in this [attachment](https://www.syncfusion.com/downloads/support/directtrac/general/ze/WebApplication1_(1)-880363187).
612+
526613
### Save an excel file using a hosted web service in AWS Lambda
527614

528615
Before proceeding with the save process, you should deploy the spreadsheet open/save web API service in AWS Lambda. To host the open/save web service in the AWS Lambda environment, please refer to the following KB documentation.
@@ -839,93 +926,6 @@ The possible values are:
839926
{% endtabs %}
840927
{% endif %}
841928

842-
### To save an excel file as blob data
843-
844-
By default, the Spreadsheet control saves the Excel file and downloads it to the local file system. If you want to save an Excel file as blob data, you need to set `needBlobData` property to **true** and `isFullPost` property to **false** in the `beforeSave` event of the spreadsheet. Subsequently, you will receive the spreadsheet data as a blob in the `saveComplete` event. You can then post the blob data to the server endpoint for saving.
845-
846-
Please find below the code to retrieve blob data from the Spreadsheet control below.
847-
848-
{% if page.publishingplatform == "aspnet-core" %}
849-
850-
{% tabs %}
851-
{% highlight cshtml tabtitle="CSHTML" %}
852-
{% include code-snippet/spreadsheet/save-as-blob/tagHelper %}
853-
{% endhighlight %}
854-
{% highlight c# tabtitle="SaveController.cs" %}
855-
{% include code-snippet/spreadsheet/save-as-blob/savecontroller.cs %}
856-
{% endhighlight %}
857-
{% endtabs %}
858-
859-
{% elsif page.publishingplatform == "aspnet-mvc" %}
860-
861-
{% tabs %}
862-
{% highlight razor tabtitle="CSHTML" %}
863-
{% include code-snippet/spreadsheet/save-as-blob/razor %}
864-
{% endhighlight %}
865-
{% highlight c# tabtitle="SaveController.cs" %}
866-
{% include code-snippet/spreadsheet/save-as-blob/savecontroller.cs %}
867-
{% endhighlight %}
868-
{% endtabs %}
869-
{% endif %}
870-
871-
### To save an Excel file to a server location
872-
873-
By default, the Spreadsheet control saves the Excel file and downloads it to the local file system. If you want to save an Excel file to a server location, you need to configure the server endpoint to convert the spreadsheet data into a file stream and save it to the server location. To do this, first, on the client side, you must convert the spreadsheet data into `JSON` format using the `saveAsJson` method and send it to the server endpoint. On the server endpoint, you should convert the received spreadsheet `JSON` data into a file stream using `Syncfusion.EJ2.Spreadsheet.AspNet.Core`, then convert the stream into an Excel file, and finally save it to the server location.
874-
875-
```js
876-
877-
// Convert the spreadsheet workbook to JSON data.
878-
spreadsheet.saveAsJson().then((json) => {
879-
const formData = new FormData();
880-
formData.append('FileName', "Sample");
881-
formData.append('saveType', 'Xlsx');
882-
// Passing the JSON data to perform the save operation.
883-
formData.append('JSONData', JSON.stringify(json.jsonObject.Workbook));
884-
formData.append('PdfLayoutSettings', JSON.stringify({ FitSheetOnOnePage: false }));
885-
// Using fetch to invoke the save process.
886-
fetch('Home/Save', {
887-
method: 'POST',
888-
body: formData
889-
}).then((response) => {
890-
console.log(response);
891-
});
892-
});
893-
894-
```
895-
896-
```csharp
897-
898-
public string Save(SaveSettings saveSettings)
899-
{
900-
ExcelEngine excelEngine = new ExcelEngine();
901-
IApplication application = excelEngine.Excel;
902-
try
903-
{
904-
905-
// Save the workbook as stream.
906-
Stream fileStream = Workbook.Save<Stream>(saveSettings);
907-
// Using XLSIO, we are opening the file stream and saving the file in the server under "Files" folder.
908-
// You can also save the stream file in your server location.
909-
IWorkbook workbook = application.Workbooks.Open(fileStream);
910-
string basePath = _env.ContentRootPath + "\\Files\\" + saveSettings.FileName + ".xlsx";
911-
var file = System.IO.File.Create(basePath);
912-
fileStream.Seek(0, SeekOrigin.Begin);
913-
// To convert the stream to file options.
914-
fileStream.CopyTo(file);
915-
file.Dispose();
916-
fileStream.Dispose();
917-
return string.Empty;
918-
}
919-
catch (Exception ex)
920-
{
921-
return ex.Message;
922-
}
923-
}
924-
925-
```
926-
927-
You can find the server endpoint code to save the spreadsheet data as an Excel file in this [attachment](https://www.syncfusion.com/downloads/support/directtrac/general/ze/WebApplication1_(1)-880363187).
928-
929929
### Supported file formats
930930

931931
The following list of Excel file formats are supported in Spreadsheet:
@@ -963,6 +963,7 @@ To save the Spreadsheet document as an `xlsx, xls, csv, or pdf` file, by using `
963963
{% endif %}
964964

965965

966+
966967
## Server Configuration
967968

968969
In Spreadsheet component, import and export operation processed in `server-side`, to use importing and exporting in your projects, it is required to create a server with any of the following web services.

0 commit comments

Comments
 (0)