diff --git a/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/data-binding.md b/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/data-binding.md index 382d0de9b..b5d8f24ad 100644 --- a/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/data-binding.md +++ b/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/data-binding.md @@ -8,7 +8,7 @@ documentation: ug --- -# Data Binding in Spreadsheet Control +# Data Binding in ASP.NET Core Spreadsheet Control The Spreadsheet uses `DataManager`, which supports both RESTful JSON data services and local JavaScript object array binding to a range. The `dataSource` property can be assigned either with the instance of `DataManager` or JavaScript object array collection. @@ -20,8 +20,6 @@ To bind local data to the Spreadsheet, you can assign a JavaScript object array Refer to the following code example for local data binding. -{% if page.publishingplatform == "aspnet-core" %} - {% tabs %} {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/excel/spreadsheet/asp-net-core/local-data-binding/tagHelper %} @@ -31,19 +29,6 @@ Refer to the following code example for local data binding. {% endhighlight %} {% endtabs %} -{% elsif page.publishingplatform == "aspnet-mvc" %} - -{% tabs %} -{% highlight razor tabtitle="CSHTML" %} -{% include code-snippet/excel/spreadsheet/asp-net-core/local-data-binding/razor %} -{% endhighlight %} -{% highlight c# tabtitle="LocalDataController.cs" %} -{% include code-snippet/excel/spreadsheet/asp-net-core/local-data-binding/MVC/localDataController.cs %} -{% endhighlight %} -{% endtabs %} -{% endif %} - - N> The local data source can also be provided as an instance of the `DataManager`. By default, `DataManager` uses `JsonAdaptor` for local data-binding. @@ -56,8 +41,6 @@ By default, when a data source is bound to a sheet, columns are auto-assigned fr The following code example demonstrates how to customize the mapping of column data: -{% if page.publishingplatform == "aspnet-core" %} - {% tabs %} {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/excel/spreadsheet/asp-net-core/field-mapping/tagHelper %} @@ -67,17 +50,6 @@ The following code example demonstrates how to customize the mapping of column d {% endhighlight %} {% endtabs %} -{% elsif page.publishingplatform == "aspnet-mvc" %} - -{% tabs %} -{% highlight razor tabtitle="CSHTML" %} -{% include code-snippet/excel/spreadsheet/asp-net-core/field-mapping/razor %} -{% endhighlight %} -{% highlight c# tabtitle="FieldMappingController.cs" %} -{% include code-snippet/excel/spreadsheet/asp-net-core/field-mapping/MVC/fieldMappingController.cs %} -{% endhighlight %} -{% endtabs %} -{% endif %} ## Remote data @@ -85,8 +57,6 @@ To bind remote data to the Spreadsheet control, assign service data as an instan Refer to the following code example for remote data binding. -{% if page.publishingplatform == "aspnet-core" %} - {% tabs %} {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/excel/spreadsheet/asp-net-core/remote-data-binding/tagHelper %} @@ -96,18 +66,6 @@ Refer to the following code example for remote data binding. {% endhighlight %} {% endtabs %} -{% elsif page.publishingplatform == "aspnet-mvc" %} - -{% tabs %} -{% highlight razor tabtitle="CSHTML" %} -{% include code-snippet/excel/spreadsheet/asp-net-core/remote-data-binding/razor %} -{% endhighlight %} -{% highlight c# tabtitle="RemoteDataController.cs" %} -{% include code-snippet/excel/spreadsheet/asp-net-core/remote-data-binding/MVC/remoteDataController.cs %} -{% endhighlight %} -{% endtabs %} -{% endif %} - N> By default, `DataManager` uses **ODataAdaptor** for remote data-binding. @@ -116,8 +74,6 @@ N> By default, `DataManager` uses **ODataAdaptor** for remote data-binding. `OData` is a standardized protocol for creating and consuming data. You can retrieve data from OData service using the DataManager. Refer to the following code example for remote Data binding using OData service. -{% if page.publishingplatform == "aspnet-core" %} - {% tabs %} {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/excel/spreadsheet/asp-net-core/odata-adaptor/tagHelper %} @@ -127,26 +83,12 @@ N> By default, `DataManager` uses **ODataAdaptor** for remote data-binding. {% endhighlight %} {% endtabs %} -{% elsif page.publishingplatform == "aspnet-mvc" %} - -{% tabs %} -{% highlight razor tabtitle="CSHTML" %} -{% include code-snippet/excel/spreadsheet/asp-net-core/odata-adaptor/razor %} -{% endhighlight %} -{% highlight c# tabtitle="ODataController.cs" %} -{% include code-snippet/excel/spreadsheet/asp-net-core/odata-adaptor/MVC/oDataController.cs %} -{% endhighlight %} -{% endtabs %} -{% endif %} - ### Web API You can use WebApiAdaptor to bind spreadsheet with Web API created using OData endpoint. -{% if page.publishingplatform == "aspnet-core" %} - {% tabs %} {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/excel/spreadsheet/asp-net-core/webapi-adaptor/tagHelper %} @@ -156,28 +98,14 @@ You can use WebApiAdaptor to bind spreadsheet with Web API created using OData e {% endhighlight %} {% endtabs %} -{% elsif page.publishingplatform == "aspnet-mvc" %} - -{% tabs %} -{% highlight razor tabtitle="CSHTML" %} -{% include code-snippet/excel/spreadsheet/asp-net-core/webapi-adaptor/razor %} -{% endhighlight %} -{% highlight c# tabtitle="WebApiController.cs" %} -{% include code-snippet/excel/spreadsheet/asp-net-core/webapi-adaptor/MVC/webApiController.cs %} -{% endhighlight %} -{% endtabs %} -{% endif %} - ## Cell data binding -The Spreadsheet control can bind the data to individual cell in a sheet . To achive this you can use the `value` property. +The Spreadsheet control can bind the data to individual cell in a sheet . To achieve this you can use the `value` property. Refer to the following code example for cell data binding. -{% if page.publishingplatform == "aspnet-core" %} - {% tabs %} {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/excel/spreadsheet/asp-net-core/cell-data-binding/tagHelper %} @@ -187,18 +115,6 @@ Refer to the following code example for cell data binding. {% endhighlight %} {% endtabs %} -{% elsif page.publishingplatform == "aspnet-mvc" %} - -{% tabs %} -{% highlight razor tabtitle="CSHTML" %} -{% include code-snippet/excel/spreadsheet/asp-net-core/cell-data-binding/razor %} -{% endhighlight %} -{% highlight c# tabtitle="CellDataController.cs" %} -{% include code-snippet/excel/spreadsheet/asp-net-core/cell-data-binding/MVC/cellDataController.cs %} -{% endhighlight %} -{% endtabs %} -{% endif %} - N> The cell data binding also supports formula, style, number format, and more. @@ -219,8 +135,6 @@ The following table defines the arguments of the `dataSourceChanged` event. N> For `add` action, the value for all the fields will be `null` in the data. In the case that you do not want the primary key field to be null which needs to be updated in the backend service, you can use `edit` action after updating the primary key field to update in the backend service.


For inserting a row at the end of the datasource range, you should insert a row below at the end of the range to trigger the `dataSourceChanged` event with action `add`. -{% if page.publishingplatform == "aspnet-core" %} - {% tabs %} {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/excel/spreadsheet/asp-net-core/dynamic-data-binding/tagHelper %} @@ -230,18 +144,6 @@ N> For `add` action, the value for all the fields will be `null` in the data. In {% endhighlight %} {% endtabs %} -{% elsif page.publishingplatform == "aspnet-mvc" %} - -{% tabs %} -{% highlight razor tabtitle="CSHTML" %} -{% include code-snippet/excel/spreadsheet/asp-net-core/dynamic-data-binding/razor %} -{% endhighlight %} -{% highlight c# tabtitle="DynamicDataController.cs" %} -{% include code-snippet/excel/spreadsheet/asp-net-core/dynamic-data-binding/MVC/dynamicDataController.cs %} -{% endhighlight %} -{% endtabs %} -{% endif %} - ## Dynamic data binding using updateRange method The `updateRange` method allows you to dynamically update the `dataSource` in a spreadsheet without manually iterating through each cell. This method is especially useful for efficiently applying bulk updates to a specific range within the spreadsheet. @@ -250,8 +152,6 @@ To use the `updateRange` method, provide the new `dataSource` and specify the st The following code example demonstrates how to dynamically update data using the `updateRange` method. -{% if page.publishingplatform == "aspnet-core" %} - {% tabs %} {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/excel/spreadsheet/asp-net-core/dynamic-data-binding-cs2/tagHelper %} @@ -261,18 +161,6 @@ The following code example demonstrates how to dynamically update data using the {% endhighlight %} {% endtabs %} -{% elsif page.publishingplatform == "aspnet-mvc" %} - -{% tabs %} -{% highlight razor tabtitle="CSHTML" %} -{% include code-snippet/excel/spreadsheet/asp-net-core/dynamic-data-binding-cs2/razor %} -{% endhighlight %} -{% highlight c# tabtitle="UpdateRangeController.cs" %} -{% include code-snippet/excel/spreadsheet/asp-net-core/dynamic-data-binding-cs2/MVC/updateRangeController.cs %} -{% endhighlight %} -{% endtabs %} -{% endif %} - ## See Also * [Filtering](filter) diff --git a/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/global-local.md b/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/global-local.md index 316f8b41b..7c4bd8366 100644 --- a/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/global-local.md +++ b/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/global-local.md @@ -7,7 +7,7 @@ control: Global Local documentation: ug --- -# Globalization in ASP.NET MVC Spreadsheet control +# Globalization in ASP.NET Core Spreadsheet control ## Localization @@ -425,12 +425,4 @@ RTL provides an option to switch the text direction and layout of the Spreadshee ## See Also -{% if page.publishingplatform == "aspnet-core" %} - * [Localization](https://ej2.syncfusion.com/aspnetcore/documentation/common/localization) - -{% elsif page.publishingplatform == "aspnet-mvc" %} - -* [Localization](https://ej2.syncfusion.com/aspnetmvc/documentation/common/localization/) - -{% endif %} \ No newline at end of file diff --git a/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/protect-sheet.md b/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/protect-sheet.md index 91b431fbb..89f94449d 100644 --- a/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/protect-sheet.md +++ b/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/protect-sheet.md @@ -8,7 +8,7 @@ documentation: ug --- -# Protection in Spreadsheet Control +# Protection in ASP.NET Core Spreadsheet Control Sheet protection helps you to prevent the users from modifying the data in the spreadsheet. @@ -65,7 +65,7 @@ Unprotect sheet is used to enable all the functionalities that are already disab **User Interface**: -In the active Spreadsheet, the sheet Unprotection can be done by any of the following ways: +In the active Spreadsheet, the sheet can be unprotected by any of the following ways: * Select the `Unprotect Sheet` item in the Ribbon toolbar under the Data Tab. * Right-click the sheet tab, select the `Unprotect Sheet` item in the context menu. @@ -168,7 +168,7 @@ Unprotect Workbook is used to enable the insert, delete, rename, move, copy, hid **User Interface**: -In the active Spreadsheet, the workbook Unprotection can be done in any of the following ways: +In the active Spreadsheet, the workbook can be unprotected in any of the following ways: * Select the `Unprotect Workbook` item in the Ribbon toolbar under the Data Tab and provide the valid password in the dialog box. diff --git a/Document-Processing/Excel/Spreadsheet/ASP-NET-MVC/data-binding.md b/Document-Processing/Excel/Spreadsheet/ASP-NET-MVC/data-binding.md index 6c68141c6..1b8f99443 100644 --- a/Document-Processing/Excel/Spreadsheet/ASP-NET-MVC/data-binding.md +++ b/Document-Processing/Excel/Spreadsheet/ASP-NET-MVC/data-binding.md @@ -8,7 +8,7 @@ documentation: ug --- -# Data Binding in Spreadsheet Control +# Data Binding in ASP.NET MVC Spreadsheet Control The Spreadsheet uses `DataManager`, which supports both RESTful JSON data services and local JavaScript object array binding to a range. The `dataSource` property can be assigned either with the instance of `DataManager` or JavaScript object array collection. @@ -102,7 +102,7 @@ You can use WebApiAdaptor to bind spreadsheet with Web API created using OData e ## Cell data binding -The Spreadsheet control can bind the data to individual cell in a sheet . To achive this you can use the `value` property. +The Spreadsheet control can bind the data to individual cell in a sheet . To achieve this you can use the `value` property. Refer to the following code example for cell data binding. diff --git a/Document-Processing/Excel/Spreadsheet/ASP-NET-MVC/protect-sheet.md b/Document-Processing/Excel/Spreadsheet/ASP-NET-MVC/protect-sheet.md index 2ed638521..91e1aab08 100644 --- a/Document-Processing/Excel/Spreadsheet/ASP-NET-MVC/protect-sheet.md +++ b/Document-Processing/Excel/Spreadsheet/ASP-NET-MVC/protect-sheet.md @@ -8,7 +8,7 @@ documentation: ug --- -# Protection in Spreadsheet Control +# Protection in ASP.NET MVC Spreadsheet Control Sheet protection helps you to prevent the users from modifying the data in the spreadsheet. @@ -52,7 +52,6 @@ The following example shows `Protect Sheet` functionality with password in the S {% include code-snippet/excel/spreadsheet/asp-net-mvc/protect-sheet/protectSheetController.cs %} {% endhighlight %} {% endtabs %} -{% endif %} @@ -66,7 +65,7 @@ Unprotect sheet is used to enable all the functionalities that are already disab **User Interface**: -In the active Spreadsheet, the sheet Unprotection can be done by any of the following ways: +In the active Spreadsheet, the sheet can be unprotected by any of the following ways: * Select the `Unprotect Sheet` item in the Ribbon toolbar under the Data Tab. * Right-click the sheet tab, select the `Unprotect Sheet` item in the context menu. @@ -169,7 +168,7 @@ Unprotect Workbook is used to enable the insert, delete, rename, move, copy, hid **User Interface**: -In the active Spreadsheet, the workbook Unprotection can be done in any of the following ways: +In the active Spreadsheet, the workbook can be unprotected in any of the following ways: * Select the `Unprotect Workbook` item in the Ribbon toolbar under the Data Tab and provide the valid password in the dialog box. diff --git a/Document-Processing/Excel/Spreadsheet/Angular/ej1-api-migration.md b/Document-Processing/Excel/Spreadsheet/Angular/ej1-api-migration.md index cdc6307d1..a0f2ae931 100644 --- a/Document-Processing/Excel/Spreadsheet/Angular/ej1-api-migration.md +++ b/Document-Processing/Excel/Spreadsheet/Angular/ej1-api-migration.md @@ -150,9 +150,9 @@ This article describes the API migration process of the Spreadsheet component fr |--------- | ----------- | ----------- | | Enables or disables the import feature | **Property:** *allowImport*

``
``| **Property:** *allowOpen*

``
``| | Enables or disables the exporting feature | **Property:** *exportSettings.allowExporting*

``
``
**Ts**
`this.exportSettings = { allowExporting: true }`| **Property:** *allowSave*

``
``| -| Defines the excelUrl to export to the excel format | **Property:** *exportSettings.excelUrl*

``
``
**Ts**
`this.exportSettings = { excelUrl: "http://js.syncfusion.com/demos/ejservices/api/Spreadsheet/ExcelExport" }`| **Property:** *saveUrl*

``
``| -| Defines the csvUrl to export to the csv format | **Property:** *exportSettings.csvUrl*

``
``
**Ts**
`this.exportSettings = { csvUrl: "http://js.syncfusion.com/demos/ejservices/api/Spreadsheet/CsvExport" }`| **Property:** *saveUrl*

You can use the same service url and specify saveType as Csv in the beforeSave event``
``
**Ts**
`beforeSave(args: BeforeSaveEventArgs) { args.saveType = 'Csv' }`| -| Import mapper to perform the import feature | **Property:** *importSettings.importMapper*

``
``
**Ts**
`this.importSettings= { importMapper: "http://js.syncfusion.com/demos/ejservices/api/Spreadsheet/Import" };`| **Property:** *openUrl*

``
``| +| Defines the excelUrl to export to the excel format | **Property:** *exportSettings.excelUrl*

``
``
**Ts**
`this.exportSettings = { excelUrl: "http://js.syncfusion.com/demos/ejservices/api/Spreadsheet/ExcelExport" }`| **Property:** *saveUrl*

``
``| +| Defines the csvUrl to export to the csv format | **Property:** *exportSettings.csvUrl*

``
``
**Ts**
`this.exportSettings = { csvUrl: "http://js.syncfusion.com/demos/ejservices/api/Spreadsheet/CsvExport" }`| **Property:** *saveUrl*

You can use the same service url and specify saveType as Csv in the beforeSave event``
``
**Ts**
`beforeSave(args: BeforeSaveEventArgs) { args.saveType = 'Csv' }`| +| Import mapper to perform the import feature | **Property:** *importSettings.importMapper*

``
``
**Ts**
`this.importSettings= { importMapper: "http://js.syncfusion.com/demos/ejservices/api/Spreadsheet/Import" };`| **Property:** *openUrl*

``
``| | Import excel file | **Method:** *import*

``
``
**TS**
`ngAfterViewInit(){ let xlObj = $("#spreadsheet").data("ejSpreadsheet"); xlObj.import({ file: file }); }`| **Method:** *open*

``
``
**TS**
`@ViewChild('default') public spreadsheetObj: SpreadsheetComponent;`
`this.spreadsheetObj.open({ file: file });`| | Load JSON data of the Spreadsheet | **Method:** *loadFromJSON*

``
``
**TS**
`ngAfterViewInit(){ let xlObj = $("#spreadsheet").data("ejSpreadsheet"); let response = xlObj.saveAsJSON(); xlObj.loadFromJSON(response); }`| **Method:** *openFromJson*

``
``
**TS**
`@ViewChild('default') public spreadsheetObj: SpreadsheetComponent;`
`this.spreadsheetObj.saveAsJson().then(response => (this.spreadsheetObj.openFromJson({ file: response.jsonObject })));`| | Triggers when a file is imported | **Event:** *onImport* 

``
``
**TS**
`onImport(args){ }`| **Event:** *openComplete* 

``
``
**TS**
`onOpenComplete(args){ }`| @@ -260,7 +260,7 @@ The following table compares Excel functionality with the availability of EJ1 an | Scrolling | Partially | Yes | - | | Selection | Yes | Yes | - | | Editing | Yes | Yes | - | -| Formulae | Yes | Partially | EJ2 supports limited number of [`most used formulas`](https://ej2.syncfusion.com/documentation/spreadsheet/formulas/#supported-formulas) | +| Formulae | Yes | Partially | EJ2 supports limited number of [`most used formulas`](https://ej2.syncfusion.com/documentation/spreadsheet/formulas#supported-formulas) | | Named range | Yes | Partially | EJ2 Spreadsheet Named range supports only in workbook scope | | Data Binding | Yes | Yes | - | | Formatting | Yes | Yes | - | diff --git a/Document-Processing/Excel/Spreadsheet/Angular/performance-best-practices.md b/Document-Processing/Excel/Spreadsheet/Angular/performance-best-practices.md index 3d442713f..6683d5481 100644 --- a/Document-Processing/Excel/Spreadsheet/Angular/performance-best-practices.md +++ b/Document-Processing/Excel/Spreadsheet/Angular/performance-best-practices.md @@ -134,8 +134,8 @@ export class AppComponent { } @ViewChild('default') public spreadsheetObj: SpreadsheetComponent; - public openUrl = 'https://services.syncfusion.com/angular/production/api/spreadsheet/open'; - public saveUrl = 'https://services.syncfusion.com/angular/production/api/spreadsheet/save'; + public openUrl = 'https://document.syncfusion.com/web-services/spreadsheet-editor/api/spreadsheet/open'; + public saveUrl = 'https://document.syncfusion.com/web-services/spreadsheet-editor/api/spreadsheet/save'; beforeSave(args: BeforeSaveEventArgs) { args.isFullPost = false; diff --git a/Document-Processing/Excel/Spreadsheet/Javascript-ES5/collaborative-editing.md b/Document-Processing/Excel/Spreadsheet/Javascript-ES5/collaborative-editing.md index d5488729e..99f5c35ef 100644 --- a/Document-Processing/Excel/Spreadsheet/Javascript-ES5/collaborative-editing.md +++ b/Document-Processing/Excel/Spreadsheet/Javascript-ES5/collaborative-editing.md @@ -1,6 +1,6 @@ --- layout: post -title: Collaborative editing in EJ2 Javascript Spreadsheet control | Syncfusion +title: Collaborative-editing EJ2 Javascript Spreadsheet | Syncfusion description: Learn here all about Collaborative editing in Syncfusion EJ2 Javascript Spreadsheet control of Syncfusion Essential JS 2 and more. platform: document-processing control: Collaborative editing @@ -181,7 +181,7 @@ var connection = new signalR.HubConnectionBuilder().withUrl('https://localhost:4 }).build(); var spreadsheet = new ej.spreadsheet.Spreadsheet({ - openUrl: 'https://services.syncfusion.com/js/production/api/spreadsheet/open', + openUrl: 'https://document.syncfusion.com/web-services/spreadsheet-editor/api/spreadsheet/open', actionComplete: (args) => { if (args.action === 'import') { // Send the action data to the server in args.response at the time of importing an excel file. diff --git a/Document-Processing/Excel/Spreadsheet/Javascript-ES6/ej1-api-migration.md b/Document-Processing/Excel/Spreadsheet/Javascript-ES6/ej1-api-migration.md index aac8e9fda..ae4948855 100644 --- a/Document-Processing/Excel/Spreadsheet/Javascript-ES6/ej1-api-migration.md +++ b/Document-Processing/Excel/Spreadsheet/Javascript-ES6/ej1-api-migration.md @@ -150,9 +150,9 @@ This article describes the API migration process of the Spreadsheet component fr |--------- | ----------- | ----------- | | Enables or disables the import feature | **Property:** *allowImport*

`new ej.Spreadsheet($("#sheet"), { allowImport: true });`| **Property:** *allowOpen*

`new Spreadsheet({ allowOpen: true });`| | Enables or disables the exporting feature | **Property:** *exportSettings.allowExporting*

`new ej.Spreadsheet($("#sheet"), { exportSettings: { allowExporting: true } });`| **Property:** *allowSave*

`new Spreadsheet({ allowSave: true });`| -| Defines the excelUrl to export to the excel format | **Property:** *exportSettings.excelUrl*

`new ej.Spreadsheet($("#sheet"), { exportSettings: { excelUrl: "http://js.syncfusion.com/demos/ejservices/api/Spreadsheet/ExcelExport" } });`| **Property:** *saveUrl*

`new Spreadsheet({ saveUrl: 'https://services.syncfusion.com/js/production/api/spreadsheet/save' });`| -| Defines the csvUrl to export to the csv format | **Property:** *exportSettings.csvUrl*

`new ej.Spreadsheet($("#sheet"), { exportSettings: { csvUrl: "http://js.syncfusion.com/demos/ejservices/api/Spreadsheet/CsvExport" } });`| **Property:** *saveUrl*

You can use the same service url and specify saveType as Csv in the beforeSave event`new Spreadsheet({ saveUrl: 'https://services.syncfusion.com/js/production/api/spreadsheet/save', beforeSave: (args) => { args.saveType = 'Csv' } });`| -| Import mapper to perform the import feature | **Property:** *importSettings.importMapper*

`new ej.Spreadsheet($("#sheet"), { importSettings: { importMapper: "http://js.syncfusion.com/demos/ejservices/api/Spreadsheet/Import" } });`| **Property:** *openUrl*

`new Spreadsheet({ openUrl: 'https://services.syncfusion.com/js/production/api/spreadsheet/open' });`| +| Defines the excelUrl to export to the excel format | **Property:** *exportSettings.excelUrl*

`new ej.Spreadsheet($("#sheet"), { exportSettings: { excelUrl: "http://js.syncfusion.com/demos/ejservices/api/Spreadsheet/ExcelExport" } });`| **Property:** *saveUrl*

`new Spreadsheet({ saveUrl: 'https://document.syncfusion.com/web-services/spreadsheet-editor/api/spreadsheet/save' });`| +| Defines the csvUrl to export to the csv format | **Property:** *exportSettings.csvUrl*

`new ej.Spreadsheet($("#sheet"), { exportSettings: { csvUrl: "http://js.syncfusion.com/demos/ejservices/api/Spreadsheet/CsvExport" } });`| **Property:** *saveUrl*

You can use the same service url and specify saveType as Csv in the beforeSave event`new Spreadsheet({ saveUrl: 'https://document.syncfusion.com/web-services/spreadsheet-editor/api/spreadsheet/save', beforeSave: (args) => { args.saveType = 'Csv' } });`| +| Import mapper to perform the import feature | **Property:** *importSettings.importMapper*

`new ej.Spreadsheet($("#sheet"), { importSettings: { importMapper: "http://js.syncfusion.com/demos/ejservices/api/Spreadsheet/Import" } });`| **Property:** *openUrl*

`new Spreadsheet({ openUrl: 'https://document.syncfusion.com/web-services/spreadsheet-editor/api/spreadsheet/open' });`| | Import excel file | **Method:** *import*

`let xlObj = $("#sheet").data("ejSpreadsheet"); xlObj.import({ file: file });`| **Method:** *open*

`let ssObj: Spreadsheet = document.getElementById("sheet").ej2_instances[0];`
`ssObj.open({ file: file });`| | Load JSON data of the Spreadsheet | **Method:** *loadFromJSON*

`let xlObj = $("#sheet").data("ejSpreadsheet"); let response = xlObj.saveAsJSON(); xlObj.loadFromJSON(response);`| **Method:** *openFromJson*

`let ssObj: Spreadsheet = document.getElementById("sheet").ej2_instances[0];`
`ssObj.saveAsJson().then(response => (ssObj.openFromJson({ file: response.jsonObject })));`| | Triggers when a file is imported | **Event:** *onImport* 

`new ej.Spreadsheet($("#sheet"), { onImport: (args) => { } });`| **Event:** *openComplete* 

`new Spreadsheet({ openComplete: (args) => { } });`| @@ -260,7 +260,7 @@ The following table compares Excel functionality with the availability of EJ1 an | Scrolling | Partially | Yes | - | | Selection | Yes | Yes | - | | Editing | Yes | Yes | - | -| Formulae | Yes | Partially | EJ2 supports limited number of [`most used formulas`](https://ej2.syncfusion.com/documentation/spreadsheet/formulas/#supported-formulas) | +| Formulae | Yes | Partially | EJ2 supports limited number of [`most used formulas`](https://ej2.syncfusion.com/documentation/spreadsheet/formulas#supported-formulas) | | Named range | Yes | Partially | EJ2 Spreadsheet Named range supports only in workbook scope | | Data Binding | Yes | Yes | - | | Formatting | Yes | Yes | - | diff --git a/Document-Processing/Excel/Spreadsheet/Javascript-ES6/illustrations.md b/Document-Processing/Excel/Spreadsheet/Javascript-ES6/illustrations.md index 57cb46bd3..437faeb36 100644 --- a/Document-Processing/Excel/Spreadsheet/Javascript-ES6/illustrations.md +++ b/Document-Processing/Excel/Spreadsheet/Javascript-ES6/illustrations.md @@ -166,9 +166,6 @@ Chart feature allows you to view and insert a chart in a spreadsheet, and you ca {% previewsample "https://helpstaging.syncfusion.com/document-processing/code-snippet/excel/spreadsheet/javascript-es6/chart-cs1" %} -{% previewsample "https://helpstaging.syncfusion.com/document-processing/code-snippet/excel/spreadsheet/javascript-es6/chart-cs1" %} -{% endif %} - #### Customization of line chart markers Using the [`actionBegin`](https://ej2.syncfusion.com/documentation/api/spreadsheet/#actionbegin) event, you can change the shape, size, fill color, and border of the line chart marker. In the following example, you can see the modified marker appearance, such as shape and size, while creating the line chart with UI interaction. diff --git a/Document-Processing/Excel/Spreadsheet/React/nextjs-getting-started.md b/Document-Processing/Excel/Spreadsheet/React/nextjs-getting-started.md index 63e5bef68..855a72926 100644 --- a/Document-Processing/Excel/Spreadsheet/React/nextjs-getting-started.md +++ b/Document-Processing/Excel/Spreadsheet/React/nextjs-getting-started.md @@ -7,8 +7,7 @@ platform: document-processing documentation: ug --- -# Creating a Next.js Application Using Syncfusion® React Components - +# Creating a Spreadsheet Application in Next.js This section provides a step-by-step guide for setting up a Next.js application and integrating the Syncfusion® React Spreadsheet component. ## What is Next.js? @@ -42,12 +41,12 @@ yarn create next-app Using one of the above commands will lead you to set up additional configurations for the project as below: -1.Define the project name: Users can specify the name of the project directly. Let's specify the name of the project as `ej2-nextjs-spreadsheet`. +1.Define the project name: Users can specify the name of the project directly. Let's specify the name of the project as `ej2-next-js-spreadsheet`. {% tabs %} {% highlight bash tabtitle="CMD" %} -√ What is your project named? » ej2-nextjs-spreadsheet +√ What is your project named? » ej2-next-js-spreadsheet {% endhighlight %} {% endtabs %} @@ -57,24 +56,24 @@ Using one of the above commands will lead you to set up additional configuration {% tabs %} {% highlight bash tabtitle="CMD" %} -√ What is your project named? ... ej2-nextjs-spreadsheet +√ What is your project named? ... ej2-next-js-spreadsheet √ Would you like to use TypeScript? ... No / `Yes` √ Would you like to use ESLint? ... No / `Yes` √ Would you like to use Tailwind CSS? ... `No` / Yes √ Would you like to use `src/` directory? ... No / `Yes` √ Would you like to use App Router? (recommended) ... No / `Yes` √ Would you like to customize the default import alias? ... `No`/ Yes -Creating a new Next.js app in D:\ej2-nextjs-spreadsheet. +Creating a new Next.js app in D:\ej2-next-js-spreadsheet. {% endhighlight %} {% endtabs %} -3.Once complete the above mentioned steps to create `ej2-nextjs-spreadsheet`, navigate to the directory using the below command: +3.Once complete the above mentioned steps to create `ej2-next-js-spreadsheet`, navigate to the directory using the below command: {% tabs %} {% highlight bash tabtitle="CMD" %} -cd ej2-nextjs-spreadsheet +cd ej2-next-js-spreadsheet {% endhighlight %} {% endtabs %} @@ -83,7 +82,7 @@ The application is ready to run with default settings. Now, let's add Syncfusion ## Install Syncfusion® React packages -Syncfusion® React component packages are available at [npmjs.com](https://www.npmjs.com/search?q=ej2-react). To use Syncfusion® React components in the project, install the corresponding npm package. +Syncfusion® React component packages are available at [npm js](https://www.npmjs.com/search?q=ej2-react). To use Syncfusion® React components in the project, install the corresponding npm package. Here, the [React Spreadsheet component](https://www.syncfusion.com/spreadsheet-editor-sdk/react-spreadsheet-editor) is used in the project. To install the React Spreadsheet component, use the following command: @@ -102,7 +101,7 @@ yarn add @syncfusion/ej2-react-spreadsheet ## Import Syncfusion® CSS styles -Syncfusion® React components come with [built-in themes](https://ej2.syncfusion.com/react/documentation/appearance/theme/), which are available in the installed packages. It’s easy to adapt the Syncfusion® React components to match the style of your application by referring to one of the built-in themes. +Syncfusion® React components come with [built-in themes](https://ej2.syncfusion.com/react/documentation/appearance/theme), which are available in the installed packages. It’s easy to adapt the Syncfusion® React components to match the style of your application by referring to one of the built-in themes. Import the `Material` theme into the **src/app/globals.css** file and removed the existing styles in that file, as shown below: @@ -123,7 +122,7 @@ Import the `Material` theme into the **src/app/globals.css** file and removed th {% endhighlight %} {% endtabs %} -> To know more about built-in themes and CSS reference for individual components, refer to the [themes](https://ej2.syncfusion.com/react/documentation/appearance/theme/) section. +> To know more about built-in themes and CSS reference for individual components, refer to the [themes](https://ej2.syncfusion.com/react/documentation/appearance/theme) section. ## Add Syncfusion® React component @@ -394,8 +393,8 @@ export default function Home(this: any) { return ( <>

Syncfusion React Spreadsheet Component

- { spreadsheet = Obj as SpreadsheetComponent }} created={onCreated.bind(this)} > @@ -445,6 +444,4 @@ yarn run dev {% endhighlight %} {% endtabs %} -To learn more about the functionality of the Spreadsheet component, refer to the [documentation](https://help.syncfusion.com/document-processing/excel/spreadsheet/react/feature-list). - -> [View the NEXT.js Spreadsheet sample in the GitHub repository](https://github.com/SyncfusionExamples/ej2-nextjs-spreadsheet). +To learn more about the functionality of the Spreadsheet component, refer to the [documentation](https://help.syncfusion.com/document-processing/excel/spreadsheet/react/feature-list). \ No newline at end of file diff --git a/Document-Processing/Excel/Spreadsheet/React/performance-best-practices.md b/Document-Processing/Excel/Spreadsheet/React/performance-best-practices.md index 3f1335cf1..cd2c9a31f 100644 --- a/Document-Processing/Excel/Spreadsheet/React/performance-best-practices.md +++ b/Document-Processing/Excel/Spreadsheet/React/performance-best-practices.md @@ -121,7 +121,7 @@ function App() { } return (
- +
); @@ -145,7 +145,7 @@ function App() { } return (
- +
); @@ -199,7 +199,7 @@ function App() { const spreadsheetRef = React.useRef(null); return (
- +
); @@ -219,7 +219,7 @@ function App() { const spreadsheetRef = React.useRef(null); return (
- +
); diff --git a/Document-Processing/Excel/Spreadsheet/Vue/performance-best-practices.md b/Document-Processing/Excel/Spreadsheet/Vue/performance-best-practices.md index 1fd61b28d..dc147d612 100644 --- a/Document-Processing/Excel/Spreadsheet/Vue/performance-best-practices.md +++ b/Document-Processing/Excel/Spreadsheet/Vue/performance-best-practices.md @@ -123,8 +123,8 @@ import { ref } from "vue"; import { SpreadsheetComponent as EjsSpreadsheet } from "@syncfusion/ej2-vue-spreadsheet"; const spreadsheet = ref(null); -const openUrl = 'https://services.syncfusion.com/vue/production/api/spreadsheet/open'; -const saveUrl = 'https://services.syncfusion.com/vue/production/api/spreadsheet/save'; +const openUrl = 'https://document.syncfusion.com/web-services/spreadsheet-editor/api/spreadsheet/open'; +const saveUrl = 'https://document.syncfusion.com/web-services/spreadsheet-editor/api/spreadsheet/save'; const beforeSave = function (args) { args.isFullPost = false; } @@ -162,8 +162,8 @@ export default { }, data: () => { return { - openUrl: 'https://services.syncfusion.com/vue/production/api/spreadsheet/open', - saveUrl: 'https://services.syncfusion.com/vue/production/api/spreadsheet/save' + openUrl: 'https://document.syncfusion.com/web-services/spreadsheet-editor/api/spreadsheet/open', + saveUrl: 'https://document.syncfusion.com/web-services/spreadsheet-editor/api/spreadsheet/save' } }, methods: { @@ -235,8 +235,8 @@ import { ref } from "vue"; import { SpreadsheetComponent as EjsSpreadsheet } from "@syncfusion/ej2-vue-spreadsheet"; const spreadsheet = ref(null); -const openUrl = 'https://services.syncfusion.com/vue/production/api/spreadsheet/open'; -const saveUrl = 'https://services.syncfusion.com/vue/production/api/spreadsheet/save'; +const openUrl = 'https://document.syncfusion.com/web-services/spreadsheet-editor/api/spreadsheet/open'; +const saveUrl = 'https://document.syncfusion.com/web-services/spreadsheet-editor/api/spreadsheet/save';