From 76c3e0fb417b76719c588517c185d1d217609064 Mon Sep 17 00:00:00 2001 From: Deepak Raj Sundar <34937839+DeepakRajSundar@users.noreply.github.com> Date: Thu, 23 Jul 2026 20:46:42 +0530 Subject: [PATCH] Revert "DOCINFRA-2341_merged_using_automation" --- blazor/Release-Notes/34.1.30.md | 96 ------------------- blazor/Release-Notes/34.1.31.md | 96 ------------------- blazor/Release-Notes/34.1.32.md | 96 ------------------- blazor/button/native-event.md | 2 +- blazor/chart/accessibility.md | 2 +- blazor/chart/adaptive-layout.md | 2 +- .../advanced-accessibility-configuration.md | 2 +- blazor/chart/cross-hair-and-track-ball.md | 2 +- blazor/chart/zooming.md | 2 +- blazor/combobox/customization.md | 46 +++++++++ .../data-binding/bind-entity-framework.md | 24 ++--- blazor/common/data-binding/data-updates.md | 8 +- .../common/data-binding/grpc-data-binding.md | 18 ++-- .../data-binding/restful-service-binding.md | 26 ++--- .../data-binding/sql-server-data-binding.md | 24 ++--- blazor/common/data-binding/two-way-binding.md | 8 +- .../data-binding/webapi-service-binding.md | 22 ++--- blazor/common/enable-ripple.md | 4 +- blazor/datagrid/cell-edit-types.md | 4 +- blazor/datagrid/filter-bar.md | 2 +- .../how-to/create-custom-grid-component.md | 2 + .../upgrade-application-to-latest-version.md | 2 + blazor/file-manager/accessibility.md | 2 +- .../amazon-S3-cloud-file-provider.md | 4 +- .../azure-cloud-file-system-provider.md | 2 +- blazor/file-manager/context-menu.md | 2 +- blazor/file-manager/custom-file-provider.md | 2 +- .../how-to/customize-http-handler.md | 2 +- .../how-to/customize-navigation-items.md | 2 +- .../how-to/perform-custom-filtering.md | 2 +- .../file-manager/how-to/previewing-files.md | 2 +- .../how-to/restrict-drag-and-drop-upload.md | 2 +- .../file-manager/how-to/upload-large-files.md | 2 +- blazor/file-manager/upload.md | 2 +- blazor/file-manager/views.md | 2 +- .../how-to/disable-edit-mode.md | 61 ++++++++++++ blazor/treegrid/getting-started-webapp.md | 2 +- blazor/treeview/data-binding.md | 2 +- 38 files changed, 203 insertions(+), 380 deletions(-) delete mode 100644 blazor/Release-Notes/34.1.30.md delete mode 100644 blazor/Release-Notes/34.1.31.md delete mode 100644 blazor/Release-Notes/34.1.32.md create mode 100644 blazor/combobox/customization.md create mode 100644 blazor/in-place-editor/how-to/disable-edit-mode.md diff --git a/blazor/Release-Notes/34.1.30.md b/blazor/Release-Notes/34.1.30.md deleted file mode 100644 index abfd59f7fd..0000000000 --- a/blazor/Release-Notes/34.1.30.md +++ /dev/null @@ -1,96 +0,0 @@ ---- -title: Essential Studio for Blazor Release Notes - v34.1.30 -description: Learn here about the controls in the Essential Studio for Blazor Weekly Release - Release Notes - v34.1.30 -platform: blazor -documentation: ug ---- - -# Essential Studio for Blazor - v34.1.30 Release Notes - -{% include release-info.html date="July 09, 2026" version="v34.1.30" passed="97907" failed="0" %} - -{% directory path: _includes/release-notes/v34.1.30 %} - -{% include {{file.url}} %} - -{% enddirectory %} - -## Test Results - -| Component Name | Test Cases | Passed | Failed | Remarks | -|---------------|------------|--------|--------|---------| -| 3DChart | 376 | 376 | 0 | All Passed | -| Accordion | 232 | 232 | 0 | All Passed | -| AiAssistView | 463 | 463 | 0 | All Passed | -| Appbar | 103 | 103 | 0 | All Passed | -| Autocomplete | 484 | 484 | 0 | All Passed | -| BarcodeGenerator | 533 | 533 | 0 | All Passed | -| Breadcrumb | 137 | 137 | 0 | All Passed | -| Bulletchart | 241 | 241 | 0 | All Passed | -| Button | 255 | 255 | 0 | All Passed | -| Calendar | 146 | 146 | 0 | All Passed | -| Carousel | 177 | 177 | 0 | All Passed | -| Charts | 6709 | 6709 | 0 | All Passed | -| ChartWizard | 317 | 317 | 0 | All Passed | -| ChatUI | 243 | 243 | 0 | All Passed | -| Chips | 214 | 214 | 0 | All Passed | -| CircularGauge | 1015 | 1015 | 0 | All Passed | -| ColorPicker | 115 | 115 | 0 | All Passed | -| ComboBox | 620 | 620 | 0 | All Passed | -| DashboardLayout | 262 | 262 | 0 | All Passed | -| DataForm | 548 | 548 | 0 | All Passed | -| DataGrid | 10702 | 10702 | 0 | All Passed | -| DatePicker | 580 | 580 | 0 | All Passed | -| DateRangePicker | 368 | 368 | 0 | All Passed | -| DateTimePicker | 475 | 475 | 0 | All Passed | -| Diagram | 17261 | 17261 | 0 | All Passed | -| Dialog | 488 | 488 | 0 | All Passed | -| DropdownList | 920 | 920 | 0 | All Passed | -| Dropdowntree | 214 | 214 | 0 | All Passed | -| FileManager | 3460 | 3460 | 0 | All Passed | -| FileUpload | 725 | 725 | 0 | All Passed | -| FloatingActionButton | 128 | 128 | 0 | All Passed | -| Gantt | 9368 | 9368 | 0 | All Passed | -| HeatMap | 419 | 419 | 0 | All Passed | -| ImageEditor | 3745 | 3745 | 0 | All Passed | -| InPlaceEditor | 768 | 768 | 0 | All Passed | -| InputMask | 172 | 172 | 0 | All Passed | -| Kanban | 543 | 543 | 0 | All Passed | -| LinearGauge | 801 | 801 | 0 | All Passed | -| ListBox | 139 | 139 | 0 | All Passed | -| ListView | 442 | 442 | 0 | All Passed | -| Maps | 1756 | 1756 | 0 | All Passed | -| Mention | 154 | 154 | 0 | All Passed | -| Menu | 398 | 398 | 0 | All Passed | -| Message | 211 | 211 | 0 | All Passed | -| MultiselectDropdown | 907 | 907 | 0 | All Passed | -| NumericTextbox | 467 | 467 | 0 | All Passed | -| OtpInput | 123 | 123 | 0 | All Passed | -| PivotTable | 1845 | 1845 | 0 | All Passed | -| ProgressBar | 199 | 199 | 0 | All Passed | -| progressbutton | 101 | 101 | 0 | All Passed | -| QueryBuilder | 585 | 585 | 0 | All Passed | -| RangeNavigator | 220 | 220 | 0 | All Passed | -| Rating | 106 | 106 | 0 | All Passed | -| Ribbon | 548 | 548 | 0 | All Passed | -| RichTextEditor | 3218 | 3218 | 0 | All Passed | -| Scheduler | 6768 | 6768 | 0 | All Passed | -| Sidebar | 150 | 150 | 0 | All Passed | -| Slider | 273 | 273 | 0 | All Passed | -| SmithChart | 260 | 260 | 0 | All Passed | -| Sparkline | 229 | 229 | 0 | All Passed | -| SpeedDial | 353 | 353 | 0 | All Passed | -| Splitter | 193 | 193 | 0 | All Passed | -| Stepper | 218 | 218 | 0 | All Passed | -| StockChart | 359 | 359 | 0 | All Passed | -| Tabs | 1085 | 1085 | 0 | All Passed | -| TextArea | 126 | 126 | 0 | All Passed | -| Textbox | 685 | 685 | 0 | All Passed | -| Timeline | 182 | 182 | 0 | All Passed | -| TimePicker | 421 | 421 | 0 | All Passed | -| Toast | 234 | 234 | 0 | All Passed | -| Toolbar | 236 | 236 | 0 | All Passed | -| Tooltip | 135 | 135 | 0 | All Passed | -| TreeGrid | 8113 | 8113 | 0 | All Passed | -| TreeMap | 775 | 775 | 0 | All Passed | -| TreeView | 1366 | 1366 | 0 | All Passed | \ No newline at end of file diff --git a/blazor/Release-Notes/34.1.31.md b/blazor/Release-Notes/34.1.31.md deleted file mode 100644 index f7ea8febf1..0000000000 --- a/blazor/Release-Notes/34.1.31.md +++ /dev/null @@ -1,96 +0,0 @@ ---- -title: Essential Studio for Blazor Release Notes - v34.1.31 -description: Learn here about the controls in the Essential Studio for Blazor Weekly Release - Release Notes - v34.1.31 -platform: blazor -documentation: ug ---- - -# Essential Studio for Blazor - v34.1.31 Release Notes - -{% include release-info.html date="July 14, 2026" version="v34.1.31" passed="97934" failed="0" %} - -{% directory path: _includes/release-notes/v34.1.31 %} - -{% include {{file.url}} %} - -{% enddirectory %} - -## Test Results - -| Component Name | Test Cases | Passed | Failed | Remarks | -|---------------|------------|--------|--------|---------| -| 3DChart | 376 | 376 | 0 | All Passed | -| Accordion | 232 | 232 | 0 | All Passed | -| AiAssistView | 463 | 463 | 0 | All Passed | -| Appbar | 103 | 103 | 0 | All Passed | -| Autocomplete | 484 | 484 | 0 | All Passed | -| BarcodeGenerator | 533 | 533 | 0 | All Passed | -| Breadcrumb | 137 | 137 | 0 | All Passed | -| Bulletchart | 241 | 241 | 0 | All Passed | -| Button | 255 | 255 | 0 | All Passed | -| Calendar | 146 | 146 | 0 | All Passed | -| Carousel | 177 | 177 | 0 | All Passed | -| Charts | 6709 | 6709 | 0 | All Passed | -| ChartWizard | 317 | 317 | 0 | All Passed | -| ChatUI | 243 | 243 | 0 | All Passed | -| Chips | 214 | 214 | 0 | All Passed | -| CircularGauge | 1015 | 1015 | 0 | All Passed | -| ColorPicker | 115 | 115 | 0 | All Passed | -| ComboBox | 621 | 621 | 0 | All Passed | -| DashboardLayout | 262 | 262 | 0 | All Passed | -| DataForm | 548 | 548 | 0 | All Passed | -| DataGrid | 10702 | 10702 | 0 | All Passed | -| DatePicker | 580 | 580 | 0 | All Passed | -| DateRangePicker | 368 | 368 | 0 | All Passed | -| DateTimePicker | 475 | 475 | 0 | All Passed | -| Diagram | 17261 | 17261 | 0 | All Passed | -| Dialog | 488 | 488 | 0 | All Passed | -| DropdownList | 921 | 921 | 0 | All Passed | -| Dropdowntree | 214 | 214 | 0 | All Passed | -| FileManager | 3460 | 3460 | 0 | All Passed | -| FileUpload | 725 | 725 | 0 | All Passed | -| FloatingActionButton | 128 | 128 | 0 | All Passed | -| Gantt | 9375 | 9375 | 0 | All Passed | -| HeatMap | 419 | 419 | 0 | All Passed | -| ImageEditor | 3745 | 3745 | 0 | All Passed | -| InPlaceEditor | 768 | 768 | 0 | All Passed | -| InputMask | 172 | 172 | 0 | All Passed | -| Kanban | 544 | 544 | 0 | All Passed | -| LinearGauge | 801 | 801 | 0 | All Passed | -| ListBox | 139 | 139 | 0 | All Passed | -| ListView | 442 | 442 | 0 | All Passed | -| Maps | 1756 | 1756 | 0 | All Passed | -| Mention | 154 | 154 | 0 | All Passed | -| Menu | 398 | 398 | 0 | All Passed | -| Message | 211 | 211 | 0 | All Passed | -| MultiselectDropdown | 909 | 909 | 0 | All Passed | -| NumericTextbox | 467 | 467 | 0 | All Passed | -| OtpInput | 123 | 123 | 0 | All Passed | -| PivotTable | 1846 | 1846 | 0 | All Passed | -| ProgressBar | 199 | 199 | 0 | All Passed | -| progressbutton | 101 | 101 | 0 | All Passed | -| QueryBuilder | 585 | 585 | 0 | All Passed | -| RangeNavigator | 220 | 220 | 0 | All Passed | -| Rating | 106 | 106 | 0 | All Passed | -| Ribbon | 548 | 548 | 0 | All Passed | -| RichTextEditor | 3232 | 3232 | 0 | All Passed | -| Scheduler | 6768 | 6768 | 0 | All Passed | -| Sidebar | 150 | 150 | 0 | All Passed | -| Slider | 273 | 273 | 0 | All Passed | -| SmithChart | 260 | 260 | 0 | All Passed | -| Sparkline | 229 | 229 | 0 | All Passed | -| SpeedDial | 353 | 353 | 0 | All Passed | -| Splitter | 193 | 193 | 0 | All Passed | -| Stepper | 218 | 218 | 0 | All Passed | -| StockChart | 359 | 359 | 0 | All Passed | -| Tabs | 1085 | 1085 | 0 | All Passed | -| TextArea | 126 | 126 | 0 | All Passed | -| Textbox | 685 | 685 | 0 | All Passed | -| Timeline | 182 | 182 | 0 | All Passed | -| TimePicker | 421 | 421 | 0 | All Passed | -| Toast | 234 | 234 | 0 | All Passed | -| Toolbar | 236 | 236 | 0 | All Passed | -| Tooltip | 135 | 135 | 0 | All Passed | -| TreeGrid | 8113 | 8113 | 0 | All Passed | -| TreeMap | 775 | 775 | 0 | All Passed | -| TreeView | 1366 | 1366 | 0 | All Passed | \ No newline at end of file diff --git a/blazor/Release-Notes/34.1.32.md b/blazor/Release-Notes/34.1.32.md deleted file mode 100644 index eef2541938..0000000000 --- a/blazor/Release-Notes/34.1.32.md +++ /dev/null @@ -1,96 +0,0 @@ ---- -title: Essential Studio for Blazor Release Notes - v34.1.32 -description: Learn here about the controls in the Essential Studio for Blazor Weekly Release - Release Notes - v34.1.32 -platform: blazor -documentation: ug ---- - -# Essential Studio for Blazor - v34.1.32 Release Notes - -{% include release-info.html date="July 21, 2026" version="v34.1.32" passed="98367" failed="0" %} - -{% directory path: _includes/release-notes/v34.1.32 %} - -{% include {{file.url}} %} - -{% enddirectory %} - -## Test Results - -| Component Name | Test Cases | Passed | Failed | Remarks | -|---------------|------------|--------|--------|---------| -| 3DChart | 376 | 376 | 0 | All Passed | -| Accordion | 232 | 232 | 0 | All Passed | -| AiAssistView | 464 | 464 | 0 | All Passed | -| Appbar | 103 | 103 | 0 | All Passed | -| Autocomplete | 484 | 484 | 0 | All Passed | -| BarcodeGenerator | 533 | 533 | 0 | All Passed | -| Breadcrumb | 137 | 137 | 0 | All Passed | -| Bulletchart | 241 | 241 | 0 | All Passed | -| Button | 255 | 255 | 0 | All Passed | -| Calendar | 146 | 146 | 0 | All Passed | -| Carousel | 177 | 177 | 0 | All Passed | -| Charts | 6709 | 6709 | 0 | All Passed | -| ChartWizard | 317 | 317 | 0 | All Passed | -| ChatUI | 243 | 243 | 0 | All Passed | -| Chips | 214 | 214 | 0 | All Passed | -| CircularGauge | 1015 | 1015 | 0 | All Passed | -| ColorPicker | 115 | 115 | 0 | All Passed | -| ComboBox | 621 | 621 | 0 | All Passed | -| DashboardLayout | 264 | 264 | 0 | All Passed | -| DataForm | 548 | 548 | 0 | All Passed | -| DataGrid | 10747 | 10747 | 0 | All Passed | -| DatePicker | 580 | 580 | 0 | All Passed | -| DateRangePicker | 368 | 368 | 0 | All Passed | -| DateTimePicker | 475 | 475 | 0 | All Passed | -| Diagram | 17316 | 17316 | 0 | All Passed | -| Dialog | 488 | 488 | 0 | All Passed | -| DropdownList | 921 | 921 | 0 | All Passed | -| Dropdowntree | 214 | 214 | 0 | All Passed | -| FileManager | 3460 | 3460 | 0 | All Passed | -| FileUpload | 725 | 725 | 0 | All Passed | -| FloatingActionButton | 128 | 128 | 0 | All Passed | -| Gantt | 9381 | 9381 | 0 | All Passed | -| HeatMap | 419 | 419 | 0 | All Passed | -| ImageEditor | 3745 | 3745 | 0 | All Passed | -| InPlaceEditor | 768 | 768 | 0 | All Passed | -| InputMask | 172 | 172 | 0 | All Passed | -| Kanban | 544 | 544 | 0 | All Passed | -| LinearGauge | 801 | 801 | 0 | All Passed | -| ListBox | 139 | 139 | 0 | All Passed | -| ListView | 442 | 442 | 0 | All Passed | -| Maps | 1756 | 1756 | 0 | All Passed | -| Mention | 154 | 154 | 0 | All Passed | -| Menu | 398 | 398 | 0 | All Passed | -| Message | 211 | 211 | 0 | All Passed | -| MultiselectDropdown | 1074 | 1074 | 0 | All Passed | -| NumericTextbox | 467 | 467 | 0 | All Passed | -| OtpInput | 123 | 123 | 0 | All Passed | -| PivotTable | 1846 | 1846 | 0 | All Passed | -| ProgressBar | 199 | 199 | 0 | All Passed | -| progressbutton | 101 | 101 | 0 | All Passed | -| QueryBuilder | 585 | 585 | 0 | All Passed | -| RangeNavigator | 220 | 220 | 0 | All Passed | -| Rating | 106 | 106 | 0 | All Passed | -| Ribbon | 549 | 549 | 0 | All Passed | -| RichTextEditor | 3344 | 3344 | 0 | All Passed | -| Scheduler | 6787 | 6787 | 0 | All Passed | -| Sidebar | 150 | 150 | 0 | All Passed | -| Slider | 273 | 273 | 0 | All Passed | -| SmithChart | 260 | 260 | 0 | All Passed | -| Sparkline | 229 | 229 | 0 | All Passed | -| SpeedDial | 353 | 353 | 0 | All Passed | -| Splitter | 194 | 194 | 0 | All Passed | -| Stepper | 218 | 218 | 0 | All Passed | -| StockChart | 359 | 359 | 0 | All Passed | -| Tabs | 1088 | 1088 | 0 | All Passed | -| TextArea | 126 | 126 | 0 | All Passed | -| Textbox | 685 | 685 | 0 | All Passed | -| Timeline | 182 | 182 | 0 | All Passed | -| TimePicker | 421 | 421 | 0 | All Passed | -| Toast | 234 | 234 | 0 | All Passed | -| Toolbar | 236 | 236 | 0 | All Passed | -| Tooltip | 135 | 135 | 0 | All Passed | -| TreeGrid | 8136 | 8136 | 0 | All Passed | -| TreeMap | 775 | 775 | 0 | All Passed | -| TreeView | 1366 | 1366 | 0 | All Passed | \ No newline at end of file diff --git a/blazor/button/native-event.md b/blazor/button/native-event.md index 0e205c8b4b..7151fa3c52 100644 --- a/blazor/button/native-event.md +++ b/blazor/button/native-event.md @@ -367,4 +367,4 @@ The `onfocusout` event fires when the Button or any of its child elements loses Message = "Focus moved out of the button (focusout)."; } } -``` \ No newline at end of file +``` diff --git a/blazor/chart/accessibility.md b/blazor/chart/accessibility.md index 3f8f2ced25..4364081341 100644 --- a/blazor/chart/accessibility.md +++ b/blazor/chart/accessibility.md @@ -9,7 +9,7 @@ documentation: ug # Accessibility in Blazor Chart Component -The [Blazor Chart](https://www.syncfusion.com/blazor-components/blazor-charts) component followed the accessibility guidelines and standards, including [ADA](https://www.ada.gov/), [Section 508](https://www.section508.gov/), [WCAG 2.2](https://www.w3.org/TR/WCAG22/) standards, and [WCAG roles](https://www.w3.org/TR/wai-aria/#roles) that are commonly used to evaluate accessibility. +The Blazor Chart component followed the accessibility guidelines and standards, including [ADA](https://www.ada.gov/), [Section 508](https://www.section508.gov/), [WCAG 2.2](https://www.w3.org/TR/WCAG22/) standards, and [WCAG roles](https://www.w3.org/TR/wai-aria/#roles) that are commonly used to evaluate accessibility. The accessibility compliance for the Blazor Chart component is outlined below. diff --git a/blazor/chart/adaptive-layout.md b/blazor/chart/adaptive-layout.md index a988fd46be..f5aecc92fb 100644 --- a/blazor/chart/adaptive-layout.md +++ b/blazor/chart/adaptive-layout.md @@ -9,7 +9,7 @@ documentation: ug # Adaptive Layout in Blazor Charts Component -Adaptive layout in [Blazor Charts](https://www.syncfusion.com/blazor-components/blazor-charts) ensures optimal display of chart elements on mobile devices and screens with limited space. By enabling the [EnableAdaptiveRendering](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Charts.SfChart.html#Syncfusion_Blazor_Charts_SfChart_EnableAdaptiveRendering) property, the chart automatically adjusts to container size changes, maintaining clear alignment and visibility for elements such as legend, axis titles, axis labels, data labels, chart title, and more. +Adaptive layout in Blazor Charts ensures optimal display of chart elements on mobile devices and screens with limited space. By enabling the [EnableAdaptiveRendering](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Charts.SfChart.html#Syncfusion_Blazor_Charts_SfChart_EnableAdaptiveRendering) property, the chart automatically adjusts to container size changes, maintaining clear alignment and visibility for elements such as legend, axis titles, axis labels, data labels, chart title, and more. ```cshtml diff --git a/blazor/chart/advanced-accessibility-configuration.md b/blazor/chart/advanced-accessibility-configuration.md index 224c85ee6f..5caadcc12a 100644 --- a/blazor/chart/advanced-accessibility-configuration.md +++ b/blazor/chart/advanced-accessibility-configuration.md @@ -9,7 +9,7 @@ documentation: ug # Accessibility Customization in Blazor Chart Component -The [Blazor Chart](https://www.syncfusion.com/blazor-components/blazor-charts) component is structured to visualize data in a graphical manner. It provides robust customization options for accessibility, allowing you to enhance the user experience for those with disabilities. The main attributes of the Blazor Chart component's accessibility customization are briefly explained in this section. +The Blazor Chart component is structured to visualize data in a graphical manner. It provides robust customization options for accessibility, allowing you to enhance the user experience for those with disabilities. The main attributes of the Blazor Chart component's accessibility customization are briefly explained in this section. The chart component has a number of characteristics that enable accessibility features to be customized, including: * [AccessibilityDescription](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Charts.SfChart.html#Syncfusion_Blazor_Charts_SfChart_AccessibilityDescription) - Provides a text description for the chart, improving support for screen readers. diff --git a/blazor/chart/cross-hair-and-track-ball.md b/blazor/chart/cross-hair-and-track-ball.md index 5e3f443693..582bbc4f79 100644 --- a/blazor/chart/cross-hair-and-track-ball.md +++ b/blazor/chart/cross-hair-and-track-ball.md @@ -11,7 +11,7 @@ documentation: ug Inspect or target any data point on mouse move or touch with the help of crosshair. A thin horizontal line and vertical line indicate the data point with the information displayed in an interactive tooltip. The crosshair can be enabled using the [Enable](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Charts.ChartCrosshairSettings.html#Syncfusion_Blazor_Charts_ChartCrosshairSettings_Enable) property in the [ChartCrosshairSettings](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Charts.ChartCrosshairSettings.html). -A detailed walkthrough demonstrating how to enable and customize the crosshair and trackball in [Blazor Charts](https://www.syncfusion.com/blazor-components/blazor-charts) is presented in the video below +A detailed walkthrough demonstrating how to enable and customize the crosshair and trackball in Blazor charts is presented in the video below {% youtube "youtube:https://www.youtube.com/watch?v=ASrWXJh0khI" %} diff --git a/blazor/chart/zooming.md b/blazor/chart/zooming.md index 75a31fd1e8..91b2e5ff66 100644 --- a/blazor/chart/zooming.md +++ b/blazor/chart/zooming.md @@ -9,7 +9,7 @@ documentation: ug # Zooming in Blazor Charts Component -A detailed walkthrough demonstrating how to configure and use zooming and panning in the [Blazor Charts](https://www.syncfusion.com/blazor-components/blazor-charts) is presented in the video below. +A detailed walkthrough demonstrating how to configure and use zooming and panning in the Blazor charts is presented in the video below. {% youtube "youtube:https://www.youtube.com/watch?v=-fqwvVMI9Ec" %} diff --git a/blazor/combobox/customization.md b/blazor/combobox/customization.md new file mode 100644 index 0000000000..f13b8c79c6 --- /dev/null +++ b/blazor/combobox/customization.md @@ -0,0 +1,46 @@ +--- +layout: post +title: Customization in Blazor ComboBox | Syncfusion® +description: Checkout and learn here all the features about Customization in Blazor ComboBox component and much more. +platform: Blazor +control: ComboBox +documentation: ug +--- + +# Customization in Blazor ComboBox + +## Open ComboBox dropdown on focus + +Automatically open the ComboBox dropdown when the input receives focus by handling the [Focus event](https://blazor.syncfusion.com/documentation/combobox/events#focus) and calling the [ShowPopupAsync method](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.DropDowns.SfDropDownList-2.html#Syncfusion_Blazor_DropDowns_SfDropDownList_2_ShowPopupAsync) (inherited from the base DropDownList). ShowPopupAsync programmatically opens the popup displaying the list of items. + +```cshtml +@using Syncfusion.Blazor.DropDowns + + + + + + +@code { + public class GameFields + { + public string ID { get; set; } + public string Text { get; set; } + } + SfComboBox popup; + private List Games = new List() { + new GameFields(){ ID= "Game1", Text= "American Football" }, + new GameFields(){ ID= "Game2", Text= "Badminton" }, + new GameFields(){ ID= "Game3", Text= "Basketball" }, + new GameFields(){ ID= "Game4", Text= "Cricket" }, + }; + + private void FocusHandler() + { + popup.ShowPopupAsync(); + + } +} +``` + +![Blazor ComboBox opening dropdown on focus](./images/blazor-combobox-customization.png) \ No newline at end of file diff --git a/blazor/common/data-binding/bind-entity-framework.md b/blazor/common/data-binding/bind-entity-framework.md index d0a4a6142d..a1e36fb906 100644 --- a/blazor/common/data-binding/bind-entity-framework.md +++ b/blazor/common/data-binding/bind-entity-framework.md @@ -1,16 +1,16 @@ --- layout: post title: Bind data from SQL server in Blazor | Syncfusion -description: Learn how to retrieve data from SQL server, bind it to Blazor DataGrid component using Entity Framework, and perform CRUD operations. +description: Learn how to retrieve data from SQL server, bind it to Syncfusion DataGrid component using Entity Framework, and perform CRUD operations. platform: Blazor component: Common documentation: ug --- -# Bind Data from SQL Server to Blazor Components +# Bind Data from SQL Server to Syncfusion® Blazor Components In this section, you can learn how to retrieve data from SQL database using [Entity Framework](https://learn.microsoft.com/en-us/ef/core/) to bind it to the Grid component and perform CRUD operations. -Entity Framework is an open-source object-relational mapper (O/RM) from Microsoft. Entity Framework works with many databases. But here, we are going to discuss the step-by-step procedure to create an Entity Framework using the [MS SQL Server](https://en.wikipedia.org/wiki/Microsoft_SQL_Server) database and connect it to the Blazor component to perform CRUD operations in a Blazor Server Application. +Entity Framework is an open-source object-relational mapper (O/RM) from Microsoft. Entity Framework works with many databases. But here, we are going to discuss the step-by-step procedure to create an Entity Framework using the [MS SQL Server](https://en.wikipedia.org/wiki/Microsoft_SQL_Server) database and connect it to the Syncfusion® component to perform CRUD operations in a Blazor Server Application. ## Prerequisite software @@ -457,11 +457,11 @@ builder.Services.AddDbContext(option => {% endhighlight %} {% endtabs %} -## Add Blazor Grid and Themes NuGet in Blazor App +## Add Syncfusion® Blazor Grid and Themes NuGet in Blazor App To add **Blazor DataGrid** component in the app, open the NuGet package manager in Visual Studio (*Tools → NuGet Package Manager → Manage NuGet Packages for Solution*), search and install [Syncfusion.Blazor.Grid](https://www.nuget.org/packages/Syncfusion.Blazor.Grid/) and [Syncfusion.Blazor.Themes](https://www.nuget.org/packages/Syncfusion.Blazor.Themes/). -If you utilize `WebAssembly or Auto` render modes in the Blazor Web App need to be install Blazor components NuGet packages within the client project. +If you utilize `WebAssembly or Auto` render modes in the Blazor Web App need to be install Syncfusion® Blazor components NuGet packages within the client project. Alternatively, you can utilize the following package manager command to achieve the same. @@ -474,7 +474,7 @@ Install-Package Syncfusion.Blazor.Themes -Version {{ site.releaseversion }} {% endhighlight %} {% endtabs %} -N> Blazor components are available in [nuget.org](https://www.nuget.org/packages?q=syncfusion.blazor). Refer to [NuGet packages](https://blazor.syncfusion.com/documentation/nuget-packages) topic for available NuGet packages list with component details. +N> Syncfusion® Blazor components are available in [nuget.org](https://www.nuget.org/packages?q=syncfusion.blazor). Refer to [NuGet packages](https://blazor.syncfusion.com/documentation/nuget-packages) topic for available NuGet packages list with component details. Open **~/_Imports.razor** file and import the following namespace. @@ -485,9 +485,9 @@ Open **~/_Imports.razor** file and import the following namespace. {% endhighlight %} -Now, register the Blazor Service in the **~/Program.cs** file of your App. +Now, register the Syncfusion® Blazor Service in the **~/Program.cs** file of your App. -For a Blazor Web App with `WebAssembly` or `Auto (Server and WebAssembly)` interactive render mode, register the Blazor service in both **~/Program.cs** files of your web app. +For a Blazor Web App with `WebAssembly` or `Auto (Server and WebAssembly)` interactive render mode, register the Syncfusion® Blazor service in both **~/Program.cs** files of your web app. ```cshtml @@ -499,7 +499,7 @@ builder.Services.AddSyncfusionBlazor(); ``` -Themes provide life to components. Blazor has different themes. They are: +Themes provide life to components. Syncfusion® Blazor has different themes. They are: * Fabric * Bootstrap @@ -529,11 +529,11 @@ Also, Include the script reference at the end of the `` of **~/Components/ ``` -## Add Blazor DataGrid component to an application +## Add Syncfusion® Blazor DataGrid component to an application In previous steps, you have successfully configured the Syncfusion® Blazor package in the application. Now, you can add the grid component to the `.razor` page inside the `Pages` folder. -If you have set the interactivity location to `Per page/component` in the web app, ensure that you define a render mode at the top of the Blazor component-included razor page as follows: +If you have set the interactivity location to `Per page/component` in the web app, ensure that you define a render mode at the top of the Syncfusion® Blazor component-included razor page as follows: {% tabs %} {% highlight razor %} @@ -662,7 +662,7 @@ Now, the data from the SQL server is loaded into the DataGrid component. Refer t ![SQL Server Grid in Blazor](../images/grid-component.png) -## Handling CRUD operations with our Blazor DataGrid component +## Handling CRUD operations with our Syncfusion® Blazor DataGrid component You can enable editing in the grid component using the **GridEditSettings** component. Grid provides various modes of editing options such as Inline/Normal, Dialog, and Batch editing. Refer to the following documentation for your reference. diff --git a/blazor/common/data-binding/data-updates.md b/blazor/common/data-binding/data-updates.md index e6f9bcd2cd..b12c053a82 100644 --- a/blazor/common/data-binding/data-updates.md +++ b/blazor/common/data-binding/data-updates.md @@ -1,7 +1,7 @@ --- layout: post -title: ObservableCollection and INotifyPropertyChanged in Blazor | Syncfusion -description: Learn how Blazor components react to changes from ObservableCollection and INotifyPropertyChanged without manual refresh. Explore to more details. +title: ObservableCollection and INotifyPropertyChanged in Syncfusion Blazor +description: Learn how Syncfusion Blazor components react to changes from ObservableCollection and INotifyPropertyChanged without manual refresh. Explore to more details. platform: Blazor component: Common documentation: ug @@ -9,7 +9,7 @@ documentation: ug # Data updates with Interface -Blazor components automatically update UI when bound data implements `INotifyCollectionChanged` (`ObservableCollection`) or `INotifyPropertyChanged`. +Syncfusion® Blazor components automatically update UI when bound data implements `INotifyCollectionChanged` (`ObservableCollection`) or `INotifyPropertyChanged`. ## ObservableCollection @@ -73,7 +73,7 @@ In the following example, the DataGrid updates automatically when items are adde } ``` -### List of Blazor Components supports ObservableCollection +### List of Syncfusion® Components supports ObservableCollection * AutoComplete * Breadcrumb diff --git a/blazor/common/data-binding/grpc-data-binding.md b/blazor/common/data-binding/grpc-data-binding.md index 365bb9485c..f43bfee7a2 100644 --- a/blazor/common/data-binding/grpc-data-binding.md +++ b/blazor/common/data-binding/grpc-data-binding.md @@ -1,15 +1,15 @@ --- layout: post title: "Bind data to the Blazor components using gRPC service | Syncfusion" -description: "Checkout and learn here all about how to consume data from gRPC service and bind it to the Blazor Component." +description: "Checkout and learn here all about how to consume data from gRPC service and bind it to the Syncfusion Component." platform: Blazor component: Common documentation: ug --- -# Bind Data to the Blazor Components Using gRPC Service +# Bind Data to the Syncfusion® Blazor Components Using gRPC Service -In this topic, you can learn how to consume data from [gRPC](https://grpc.io/) service and bind it to a Blazor Component. +In this topic, you can learn how to consume data from [gRPC](https://grpc.io/) service and bind it to a Syncfusion® Blazor Component. ## Prerequisite software @@ -201,9 +201,9 @@ public static async Task Main(string[] args) N> The **OrdersService.OrdersServiceClient** class is also generated automatically from the `.proto` file. -## Add Blazor DataGrid package +## Add Syncfusion® Blazor DataGrid package -We are going to explain this data (gRPC service data) binding process using the DataGrid component. So, we are going to install the packages required to use the Blazor components. Now, right-click **Dependencies** in the project and select **Manage NuGet Packages**. +We are going to explain this data (gRPC service data) binding process using the Syncfusion® DataGrid component. So, we are going to install the packages required to use the Syncfusion® Blazor components. Now, right-click **Dependencies** in the project and select **Manage NuGet Packages**. ![Manage NuGet packages](../images/manage-nuget-pack.png) @@ -213,16 +213,16 @@ In the **Browse** tab, search and install the `Syncfusion.Blazor.Grid` NuGet pac N> For this demo, `Syncfusion.Blazor`(19.1.0.66) NuGet package is used. A new `Syncfusion.Blazor` NuGet package with new enhancement will be released in our every-week release and main release. So, you can check and update to the [latest versions](https://www.nuget.org/packages/Syncfusion.Blazor). -## Adding Blazor DataGrid component +## Adding Syncfusion® Blazor DataGrid component -Open `_Import.razor` file and add the following namespaces which are required to use Blazor DataGrid Component in this application. +Open `_Import.razor` file and add the following namespaces which are required to use Syncfusion® Blazor DataGrid Component in this application. ```cshtml @using Syncfusion.Blazor @using Syncfusion.Blazor.Grids ``` -Open `Program.cs` file in a **Client** project and **register** the `service` in the **ConfigureServices** method as follows. +Open `Program.cs` file in a **Client** project and **register** the `Syncfusion® service` in the **ConfigureServices** method as follows. ```c# using Syncfusion.Blazor; @@ -262,7 +262,7 @@ To consume data from the gRPC service, inject the **OrdersServiceClient** into t Here, the `DataSource` property of the DataGrid component is used to bind the data to DataGrid in the WebAssembly application. -Grid columns can be defined using the [GridColumn](https://blazor.syncfusion.com/documentation/datagrid/columns) component. Columns are created using the following code, let’s see the properties used and their usage. +Grid columns can be defined using the [GridColumn](https://blazor.syncfusion.com/documentation/datagrid/columns/) component. Columns are created using the following code, let’s see the properties used and their usage. * `Field` property specifies the column name of the **Orders** table to display in the grid column. * The `Width` property specifies the column width. diff --git a/blazor/common/data-binding/restful-service-binding.md b/blazor/common/data-binding/restful-service-binding.md index 6ba5d26505..d9c606d09d 100644 --- a/blazor/common/data-binding/restful-service-binding.md +++ b/blazor/common/data-binding/restful-service-binding.md @@ -1,7 +1,7 @@ --- layout: post -title: Bind data from web services to Blazor components | Syncfusion -description: Learn how to retrieve data from a RESTful service, bind it to Blazor DataGrid using SfDataManager with ODataV4Adaptor, and perform CRUD operations. +title: Bind data from web services to Syncfusion Blazor components +description: Learn how to retrieve data from a RESTful service, bind it to Syncfusion Blazor DataGrid using SfDataManager with ODataV4Adaptor, and perform CRUD operations. platform: Blazor control: Common documentation: ug @@ -11,7 +11,7 @@ documentation: ug This article shows how to retrieve data from a RESTful web services, bind it to the Grid component, and perform CRUD operations. Data is fetched from an ODatav4 service using the [ODataV4Adaptor](https://blazor.syncfusion.com/documentation/data/adaptors#odatav4-adaptor) of `SfDataManager`. -Choose the suitable adaptor based on the RESTful service which you are using to bind data for the Blazor component. Refer to the following documentation to know about the available Adaptors of SfDataManager. +Choose the suitable adaptor based on the RESTful service which you are using to bind data for the Syncfusion® Blazor component. Refer to the following documentation to know about the available Adaptors of SfDataManager. * [Adaptors](https://blazor.syncfusion.com/documentation/data/adaptors) ## Prerequisite software @@ -321,15 +321,15 @@ app.Run(); ## Create Blazor Web App -Create a **Blazor Web App** using Visual Studio 2022 via [Microsoft templates](https://learn.microsoft.com/en-us/aspnet/core/blazor/tooling) or the [Blazor Extension](https://blazor.syncfusion.com/documentation/visual-studio-integration/template-studio). +Create a **Blazor Web App** using Visual Studio 2022 via [Microsoft templates](https://learn.microsoft.com/en-us/aspnet/core/blazor/tooling) or the [Syncfusion® Blazor Extension](https://blazor.syncfusion.com/documentation/visual-studio-integration/template-studio). Configure the appropriate [interactive render mode](https://learn.microsoft.com/en-us/aspnet/core/blazor/components/render-modes#render-modes) and [interactivity location](https://learn.microsoft.com/en-us/aspnet/core/blazor/tooling#interactivity-location) when creating the Blazor Web App. ## Create Blazor Server Application -Create a **Blazor Server App** using Visual Studio via [Microsoft templates](https://learn.microsoft.com/en-us/aspnet/core/blazor/tooling) or the [Blazor Extension](https://blazor.syncfusion.com/documentation/visual-studio-integration/template-studio). +Create a **Blazor Server App** using Visual Studio via [Microsoft templates](https://learn.microsoft.com/en-us/aspnet/core/blazor/tooling) or the [Syncfusion® Blazor Extension](https://blazor.syncfusion.com/documentation/visual-studio-integration/template-studio). -## Add Blazor Grid and Themes NuGet in Blazor App +## Add Syncfusion® Blazor Grid and Themes NuGet in Blazor App To add **Blazor DataGrid** component in the app, open the NuGet package manager in Visual Studio (*Tools → NuGet Package Manager → Manage NuGet Packages for Solution*), search and install [Syncfusion.Blazor.Grid](https://www.nuget.org/packages/Syncfusion.Blazor.Grid/) and [Syncfusion.Blazor.Themes](https://www.nuget.org/packages/Syncfusion.Blazor.Themes/). @@ -346,7 +346,7 @@ Install-Package Syncfusion.Blazor.Themes -Version {{ site.releaseversion }} {% endhighlight %} {% endtabs %} -N> Blazor components are available in [nuget.org](https://www.nuget.org/packages?q=syncfusion.blazor). Refer to [NuGet packages](https://blazor.syncfusion.com/documentation/nuget-packages) topic for available NuGet packages list with component details. +N> Syncfusion® Blazor components are available in [nuget.org](https://www.nuget.org/packages?q=syncfusion.blazor). Refer to [NuGet packages](https://blazor.syncfusion.com/documentation/nuget-packages) topic for available NuGet packages list with component details. Open **~/_Imports.razor** file and import the following namespace. @@ -357,9 +357,9 @@ Open **~/_Imports.razor** file and import the following namespace. {% endhighlight %} -Now, register the Blazor Service in the **~/Program.cs** file of your App. +Now, register the Syncfusion® Blazor Service in the **~/Program.cs** file of your App. -For a Blazor Web App with `WebAssembly` or `Auto (Server and WebAssembly)` interactive render mode, register the Blazor service in both **~/Program.cs** files of your web app. +For a Blazor Web App with `WebAssembly` or `Auto (Server and WebAssembly)` interactive render mode, register the Syncfusion® Blazor service in both **~/Program.cs** files of your web app. ```cshtml @@ -371,7 +371,7 @@ builder.Services.AddSyncfusionBlazor(); ``` -Themes provide life to components. Blazor has different [themes](https://blazor.syncfusion.com/documentation/appearance/themes). They are: +Themes provide life to components. Syncfusion® Blazor has different [themes](https://blazor.syncfusion.com/documentation/appearance/themes). They are: * Bootstrap5 * Material 3 @@ -404,11 +404,11 @@ In this demo application, the latest theme is used. ``` -## Add Blazor DataGrid component to an application +## Add Syncfusion® Blazor DataGrid component to an application In previous steps, you have successfully configured the Syncfusion® Blazor package in the application. Now, you can add the grid component to the `.razor` page inside the `Pages` folder. -If you have set the interactivity location to `Per page/component` in the web app, ensure that you define a render mode at the top of the Blazor component-included razor page as follows: +If you have set the interactivity location to `Per page/component` in the web app, ensure that you define a render mode at the top of the Syncfusion® Blazor component-included razor page as follows: {% tabs %} {% highlight razor %} @@ -501,7 +501,7 @@ public class OrdersController : ODataController {% endhighlight %} {% endtabs %} -## Handling CRUD operations with our Blazor DataGrid component +## Handling CRUD operations with our Syncfusion® Blazor DataGrid component Enable editing in the grid component using [GridEditSettings](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Grids.GridEditSettings.html). The Grid supports several editing modes: [Inline/Normal](https://blazor.syncfusion.com/documentation/datagrid/in-line-editing), [Dialog](https://blazor.syncfusion.com/documentation/datagrid/dialog-editing), and [Batch](https://blazor.syncfusion.com/documentation/datagrid/batch-editing). diff --git a/blazor/common/data-binding/sql-server-data-binding.md b/blazor/common/data-binding/sql-server-data-binding.md index 3d2fde1ffb..16d956ae0c 100644 --- a/blazor/common/data-binding/sql-server-data-binding.md +++ b/blazor/common/data-binding/sql-server-data-binding.md @@ -1,7 +1,7 @@ --- layout: post title: SQL server data binding and performing CRUD operations | Syncfusion -description: Learn about consuming data from SQL Server using Microsoft SQL Client, binding it to Blazor Component, and performing CRUD operations +description: Learn about consuming data from SQL Server using Microsoft SQL Client, binding it to Syncfusion Component, and performing CRUD operations platform: Blazor component: DataGrid component and DataManager documentation: ug @@ -11,7 +11,7 @@ documentation: ug ## Introduction -This topic gives a clear idea about how to consume data from [SQL Server](https://learn.microsoft.com/en-us/sql/sql-server/?view=sql-server-ver15) using Microsoft SQL Client, bind it to a Blazor Component, and perform CRUD operations. +This topic gives a clear idea about how to consume data from [SQL Server](https://learn.microsoft.com/en-us/sql/sql-server/?view=sql-server-ver15) using Microsoft SQL Client, bind it to a Syncfusion® Component, and perform CRUD operations. ## Prerequisite software @@ -361,11 +361,11 @@ namespace BlazorWebApp.Controller Open Visual Studio and follow the steps in the [documentation](https://blazor.syncfusion.com/documentation/getting-started/blazor-server-side-visual-studio) to create the Blazor Server Application. -## Add Blazor DataGrid package +## Add Syncfusion® Blazor DataGrid package To add **Blazor DataGrid** component in the app, open the NuGet package manager in Visual Studio (*Tools → NuGet Package Manager → Manage NuGet Packages for Solution*), search and install [Syncfusion.Blazor.Grid](https://www.nuget.org/packages/Syncfusion.Blazor.Grid/) and [Syncfusion.Blazor.Themes](https://www.nuget.org/packages/Syncfusion.Blazor.Themes/). -If you utilize `WebAssembly or Auto` render modes in the Blazor Web App need to be install Blazor components NuGet packages within the client project. +If you utilize `WebAssembly or Auto` render modes in the Blazor Web App need to be install Syncfusion® Blazor components NuGet packages within the client project. Alternatively, you can utilize the following package manager command to achieve the same. @@ -378,7 +378,7 @@ Install-Package Syncfusion.Blazor.Themes -Version {{ site.releaseversion }} {% endhighlight %} {% endtabs %} -N> Blazor components are available in [nuget.org](https://www.nuget.org/packages?q=syncfusion.blazor). Refer to [NuGet packages](https://blazor.syncfusion.com/documentation/nuget-packages) topic for available NuGet packages list with component details. +N> Syncfusion® Blazor components are available in [nuget.org](https://www.nuget.org/packages?q=syncfusion.blazor). Refer to [NuGet packages](https://blazor.syncfusion.com/documentation/nuget-packages) topic for available NuGet packages list with component details. Open **~/_Imports.razor** file and import the following namespace. @@ -389,9 +389,9 @@ Open **~/_Imports.razor** file and import the following namespace. {% endhighlight %} -Now, register the Blazor Service in the **~/Program.cs** file of your App. +Now, register the Syncfusion® Blazor Service in the **~/Program.cs** file of your App. -For a Blazor Web App with `WebAssembly` or `Auto (Server and WebAssembly)` interactive render mode, register the Blazor service in both **~/Program.cs** files of your web app. +For a Blazor Web App with `WebAssembly` or `Auto (Server and WebAssembly)` interactive render mode, register the Syncfusion® Blazor service in both **~/Program.cs** files of your web app. ```cshtml @@ -403,7 +403,7 @@ builder.Services.AddSyncfusionBlazor(); ``` -Themes provide life to components. Blazor has different themes. They are: +Themes provide life to components. Syncfusion® Blazor has different themes. They are: * Bootstrap5 * Material 3 @@ -431,11 +431,11 @@ Also, Include the script reference at the end of the `` of **~/Components/ ``` -## Add Blazor DataGrid component to an application +## Add Syncfusion® Blazor DataGrid component to an application In previous steps, you have successfully configured the Syncfusion® Blazor package in the application. Now, you can add the grid component to the to the `.razor` page inside the `Pages` folder. -If you have set the interactivity location to `Per page/component` in the web app, ensure that you define a render mode at the top of the Blazor component-included razor page as follows: +If you have set the interactivity location to `Per page/component` in the web app, ensure that you define a render mode at the top of the Syncfusion® Blazor component-included razor page as follows: {% tabs %} {% highlight razor %} @@ -638,7 +638,7 @@ While running the application, the grid will be displayed as follows. ![Binding SQL data to the Blazor DataGrid Component](../images/SQLServerBoundedGrid.png) -## Handling CRUD operations with our Blazor DataGrid component +## Handling CRUD operations with our Syncfusion® Blazor DataGrid component Enable editing in the grid component using the [GridEditSettings](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Grids.GridEditSettings.html) component. Grid provides various modes of editing options such as Inline/Normal, Dialog and Batch editing. Refer the [Grid Editing](https://blazor.syncfusion.com/documentation/datagrid/editing) documentation for reference. @@ -661,7 +661,7 @@ The CRUD operations can be performed and customized on our own by overriding the * Update/UpdateAsync * BatchUpdate/BatchUpdateAsync -Let’s see how to perform CRUD operation using SQL server data with Blazor DataGrid component +Let’s see how to perform CRUD operation using SQL server data with Syncfusion® Blazor DataGrid component ### Insert Operation diff --git a/blazor/common/data-binding/two-way-binding.md b/blazor/common/data-binding/two-way-binding.md index e7a3e5bc61..50a2253ccf 100644 --- a/blazor/common/data-binding/two-way-binding.md +++ b/blazor/common/data-binding/two-way-binding.md @@ -1,7 +1,7 @@ --- layout: post title: Two-way data binding in Blazor | Syncfusion -description: Learn here all about how Blazor components use the two-way data binding with @bind-Value and related patterns. Explore here to more details. +description: Learn here all about how Syncfusion Blazor components use the two-way data binding with @bind-Value and related patterns. Explore here to more details. platform: Blazor control: Common documentation: ug @@ -9,9 +9,9 @@ documentation: ug # Two-way data binding -Blazor components provide data binding features with the `@bind-value` Razor directive attribute with a field, property, or Razor expression value. By default, the `bind-value` attribute binds the data value in the `OnChange` event. The `OnChange` event triggers when the element loses its focus. +Syncfusion® Blazor components provide data binding features with the `@bind-value` Razor directive attribute with a field, property, or Razor expression value. By default, the `bind-value` attribute binds the data value in the `OnChange` event. The `OnChange` event triggers when the element loses its focus. -To enable two-way binding on Blazor components, use `@bind-Value`. In the following example, the `SfTextBox` component is bound to the C# `textValue` property. When the textbox loses focus, the bound field is updated. +To enable two-way binding on Syncfusion® components, use `@bind-Value`. In the following example, the `SfTextBox` component is bound to the C# `textValue` property. When the textbox loses focus, the bound field is updated. ```cshtml @@ -34,7 +34,7 @@ To enable two-way binding on Blazor components, use `@bind-Value`. In the follow ![Two-way data binding example in Blazor](../images/blazor-two-way-binding.gif) -The following Blazor components support two-way binding: +The following Syncfusion® Blazor components support two-way binding: * [AutoComplete](https://blazor.syncfusion.com/documentation/autocomplete/data-binding) * [Calendar](https://blazor.syncfusion.com/documentation/calendar/data-binding) diff --git a/blazor/common/data-binding/webapi-service-binding.md b/blazor/common/data-binding/webapi-service-binding.md index 0f2fd88b26..7dc70bc1d9 100644 --- a/blazor/common/data-binding/webapi-service-binding.md +++ b/blazor/common/data-binding/webapi-service-binding.md @@ -1,7 +1,7 @@ --- layout: post title: Bind data to Blazor components using WebApiAdaptor | CRUD | Syncfusion -description: Learn how to retrieve data from a Web API, bind it to the Blazor DataGrid using SfDataManager with WebApiAdaptor, and perform CRUD operations. +description: Learn how to retrieve data from a Web API, bind it to the Syncfusion Blazor DataGrid using SfDataManager with WebApiAdaptor, and perform CRUD operations. platform: Blazor control: Common documentation: ug @@ -53,7 +53,7 @@ Now, click on **Update Database**. ## Create a new Blazor Web App -Create a **Blazor Web App** using Visual Studio 2022 via [Microsoft templates](https://learn.microsoft.com/en-us/aspnet/core/blazor/tooling) or the [Blazor Extension](https://blazor.syncfusion.com/documentation/visual-studio-integration/template-studio). +Create a **Blazor Web App** using Visual Studio 2022 via [Microsoft templates](https://learn.microsoft.com/en-us/aspnet/core/blazor/tooling) or the [Syncfusion® Blazor Extension](https://blazor.syncfusion.com/documentation/visual-studio-integration/template-studio). Configure the appropriate [interactive render mode](https://learn.microsoft.com/en-us/aspnet/core/blazor/components/render-modes#render-modes) and [interactivity location](https://learn.microsoft.com/en-us/aspnet/core/blazor/tooling#interactivity-location) when creating the Blazor Web App. @@ -231,7 +231,7 @@ app.MapControllers(); ## Create Blazor Server Application -You can create a **Blazor Server App** using Visual Studio via [Microsoft Templates](https://learn.microsoft.com/en-us/aspnet/core/blazor/tooling?view=aspnetcore-7.0) or the [Blazor Extension](https://blazor.syncfusion.com/documentation/visual-studio-integration/template-studio). +You can create a **Blazor Server App** using Visual Studio via [Microsoft Templates](https://learn.microsoft.com/en-us/aspnet/core/blazor/tooling?view=aspnetcore-7.0) or the [Syncfusion® Blazor Extension](https://blazor.syncfusion.com/documentation/visual-studio-integration/template-studio). ### Generate DbContext and model class from the database @@ -421,7 +421,7 @@ app.Run(); {% endhighlight %} {% endtabs %} -## Add Blazor DataGrid package +## Add Syncfusion® Blazor DataGrid package To add **Blazor DataGrid** component in the app, open the NuGet package manager in Visual Studio (*Tools → NuGet Package Manager → Manage NuGet Packages for Solution*), search and install [Syncfusion.Blazor.Grid](https://www.nuget.org/packages/Syncfusion.Blazor.Grid/) and [Syncfusion.Blazor.Themes](https://www.nuget.org/packages/Syncfusion.Blazor.Themes/). @@ -438,7 +438,7 @@ Install-Package Syncfusion.Blazor.Themes -Version {{ site.releaseversion }} {% endhighlight %} {% endtabs %} -N> Blazor components are available in [nuget.org](https://www.nuget.org/packages?q=syncfusion.blazor). Refer to [NuGet packages](https://blazor.syncfusion.com/documentation/nuget-packages) topic for available NuGet packages list with component details. +N> Syncfusion® Blazor components are available in [nuget.org](https://www.nuget.org/packages?q=syncfusion.blazor). Refer to [NuGet packages](https://blazor.syncfusion.com/documentation/nuget-packages) topic for available NuGet packages list with component details. Open **~/_Imports.razor** file and import the following namespace. @@ -449,9 +449,9 @@ Open **~/_Imports.razor** file and import the following namespace. {% endhighlight %} -Now, register the Blazor Service in the **~/Program.cs** file of your App. +Now, register the Syncfusion® Blazor Service in the **~/Program.cs** file of your App. -For a Blazor Web App with `WebAssembly` or `Auto (Server and WebAssembly)` interactive render mode, register the Blazor service in both **~/Program.cs** files of your web app. +For a Blazor Web App with `WebAssembly` or `Auto (Server and WebAssembly)` interactive render mode, register the Syncfusion® Blazor service in both **~/Program.cs** files of your web app. ```cshtml @@ -463,7 +463,7 @@ builder.Services.AddSyncfusionBlazor(); ``` -Themes provide life to components. Blazor has different themes. They are: +Themes provide life to components. Syncfusion® Blazor has different themes. They are: * Fabric * Bootstrap @@ -493,11 +493,11 @@ Also, Include the script reference at the end of the `` of **~/Components/ ``` -## Add Blazor DataGrid component to an application +## Add Syncfusion® Blazor DataGrid component to an application In previous steps, you have successfully configured the Syncfusion® Blazor package in the application. Now, you can add the grid component to the to the `.razor` page inside the `Pages` folder. -If you have set the interactivity location to `Per page/component` in the web app, ensure that you define a render mode at the top of the Blazor component-included razor page as follows: +If you have set the interactivity location to `Per page/component` in the web app, ensure that you define a render mode at the top of the Syncfusion® Blazor component-included razor page as follows: {% tabs %} {% highlight razor %} @@ -593,7 +593,7 @@ The sample response object should look like this: } ``` -## Handling CRUD operations with our Blazor DataGrid component +## Handling CRUD operations with our Syncfusion® Blazor DataGrid component You can enable editing in the grid component using the [GridEditSettings](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Grids.GridEditSettings.html) component. Grid provides various modes of editing options such as [Inline/Normal](https://blazor.syncfusion.com/documentation/datagrid/in-line-editing), [Dialog](https://blazor.syncfusion.com/documentation/datagrid/dialog-editing), and [Batch](https://blazor.syncfusion.com/documentation/datagrid/batch-editing) editing. diff --git a/blazor/common/enable-ripple.md b/blazor/common/enable-ripple.md index 9c730c55dd..0df1f538d2 100644 --- a/blazor/common/enable-ripple.md +++ b/blazor/common/enable-ripple.md @@ -53,9 +53,7 @@ await builder.Build().RunAsync(); {% endtabs %} -The above configuration enables the ripple effect globally for all supported Blazor components. - -N> Ripple effect is supported in the following themes: `Material`, `Material 3`, `Bootstrap 5`, `Bootstrap 5.3`, `Tailwind`, `Fluent 2`, `Fluent2 High Contrast`. +The above configuration enables ripple effect globally for all Blazor components. For example, the Blazor Tab component will display with a ripple animation effect: diff --git a/blazor/datagrid/cell-edit-types.md b/blazor/datagrid/cell-edit-types.md index d924eccd4d..d970f81f9b 100644 --- a/blazor/datagrid/cell-edit-types.md +++ b/blazor/datagrid/cell-edit-types.md @@ -1136,4 +1136,6 @@ N> [View Sample in GitHub.](https://github.com/SyncfusionExamples/blazor-datagri ## See also -* [Edit one column update the value in another column](https://www.syncfusion.com/forums/151238/edit-one-column-update-the-value-in-another-column) \ No newline at end of file +* [Edit one column update the value in another column](https://www.syncfusion.com/forums/151238/edit-one-column-update-the-value-in-another-column) + +N> Looking for a complete Blazor DataGrid Component overview, including features, pricing, and documentation? Explore the [Blazor DataGrid](https://www.syncfusion.com/blazor-components/blazor-datagrid) Component page. \ No newline at end of file diff --git a/blazor/datagrid/filter-bar.md b/blazor/datagrid/filter-bar.md index f46aa3e964..4e28ff3760 100644 --- a/blazor/datagrid/filter-bar.md +++ b/blazor/datagrid/filter-bar.md @@ -729,7 +729,7 @@ public class OrderData ### Operator-based filtering in the filter bar -The Blazor DataGrid supports operator-based filtering in the filter bar through the **ShowFilterBarOperator** property in [GridFilterSettings](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Grids.SfGrid-1.html#Syncfusion_Blazor_Grids_SfGrid_1_FilterSettings). +The Syncfusion Blazor DataGrid supports operator-based filtering in the filter bar through the **ShowFilterBarOperator** property in [GridFilterSettings](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Grids.SfGrid-1.html#Syncfusion_Blazor_Grids_SfGrid_1_FilterSettings). When the **ShowFilterBarOperator** property is enabled, clicking the filter icon in a filter bar cell displays an operator dropdown menu. A filtering condition appropriate to the column type can be selected, removing the need to type operator expressions manually. diff --git a/blazor/datagrid/how-to/create-custom-grid-component.md b/blazor/datagrid/how-to/create-custom-grid-component.md index e12b571daa..886cb883cb 100644 --- a/blazor/datagrid/how-to/create-custom-grid-component.md +++ b/blazor/datagrid/how-to/create-custom-grid-component.md @@ -159,3 +159,5 @@ This approach allows developers to focus more on application logic rather than r {% endhighlight %} {% endtabs %} + +N> Looking for a complete Blazor DataGrid Component overview, including features, pricing, and documentation? Explore the [Blazor DataGrid](https://www.syncfusion.com/blazor-components/blazor-datagrid) Component page. diff --git a/blazor/datagrid/how-to/upgrade-application-to-latest-version.md b/blazor/datagrid/how-to/upgrade-application-to-latest-version.md index ba6aefc0d6..e8d254325f 100644 --- a/blazor/datagrid/how-to/upgrade-application-to-latest-version.md +++ b/blazor/datagrid/how-to/upgrade-application-to-latest-version.md @@ -47,3 +47,5 @@ The following steps explain how to clean the cache: 1. Delete/clear the `Syncfusion.Blazor` package from the installed location `{System drive}/Users/{user-name}/.nuget/packages/syncfusion.blazor`. On Windows, the installed location can also be accessed using `%userprofile%/.nuget/packages/syncfusion.blazor`. 2. Update to the latest version of the `Syncfusion.Blazor` NuGet package. + +N> Looking for a complete Blazor DataGrid Component overview, including features, pricing, and documentation? Explore the [Blazor DataGrid](https://www.syncfusion.com/blazor-components/blazor-datagrid) Component page. diff --git a/blazor/file-manager/accessibility.md b/blazor/file-manager/accessibility.md index eb61c638c8..031bd5c445 100644 --- a/blazor/file-manager/accessibility.md +++ b/blazor/file-manager/accessibility.md @@ -9,7 +9,7 @@ documentation: ug # Accessibility in Blazor File Manager Component -The [Blazor File Manager](https://www.syncfusion.com/blazor-components/blazor-file-manager) component has been designed with keeping the [WAI-ARIA](https://www.w3.org/WAI/ARIA/apg/patterns/) specifications in mind, and applied the `WAI-ARIA` roles, states, and properties along with `keyboard support`. This component is characterized by complete keyboard interaction support and ARIA accessibility support, which makes navigation easy for people who use assistive technologies (AT) or for users who completely rely on keyboard navigation. +The [Blazor FileManager](https://www.syncfusion.com/blazor-components/blazor-file-manager) component has been designed with keeping the [WAI-ARIA](https://www.w3.org/WAI/ARIA/apg/patterns/) specifications in mind, and applied the `WAI-ARIA` roles, states, and properties along with `keyboard support`. This component is characterized by complete keyboard interaction support and ARIA accessibility support, which makes navigation easy for people who use assistive technologies (AT) or for users who completely rely on keyboard navigation. The Blazor File Manager component followed the accessibility guidelines and standards, including [ADA](https://www.ada.gov/), [Section 508](https://www.section508.gov/), [WCAG 2.2](https://www.w3.org/TR/WCAG22/) standards, and [WCAG roles](https://www.w3.org/TR/wai-aria/#roles) that are commonly used to evaluate accessibility. diff --git a/blazor/file-manager/amazon-S3-cloud-file-provider.md b/blazor/file-manager/amazon-S3-cloud-file-provider.md index b1e7ab006f..48e4946879 100644 --- a/blazor/file-manager/amazon-S3-cloud-file-provider.md +++ b/blazor/file-manager/amazon-S3-cloud-file-provider.md @@ -11,7 +11,7 @@ documentation: ug ## Introduction to Amazon S3 -Amazon Simple Storage Service (Amazon S3) is AWS's object storage service for storing and retrieving any amount of data. S3 is durable, scalable, and pay‑as‑you‑go. In this guide the [Blazor File Manager](https://www.syncfusion.com/blazor-components/blazor-file-manager) connects to S3 through an ASP.NET Core backend so you can securely browse and perform file operations in the File Manager component. +Amazon Simple Storage Service (Amazon S3) is AWS's object storage service for storing and retrieving any amount of data. S3 is durable, scalable, and pay‑as‑you‑go. In this guide the Blazor File Manager connects to S3 through an ASP.NET Core backend so you can securely browse and perform file operations in the File Manager component. ## Prerequisites @@ -80,4 +80,4 @@ We have enabled below list of features that can be performed using Amazon File S Additionally, you can check out all the necessary file operation method details for this provider in the same GitHub repository. To access the live Amazon S3 File Provider demo refer to this [link](https://blazor.syncfusion.com/demos/file-manager/amazon-s3-provider?theme=fluent2) -N> To learn more about the file actions that can be performed with Amazon S3 Cloud File provider, refer to this [link](https://github.com/SyncfusionExamples/amazon-s3-aspcore-file-provider#key-features) +N> To learn more about the file actions that can be performed with Amazon S3 Cloud File provider, refer to this [link](https://github.com/SyncfusionExamples/amazon-s3-aspcore-file-provider#key-features) \ No newline at end of file diff --git a/blazor/file-manager/azure-cloud-file-system-provider.md b/blazor/file-manager/azure-cloud-file-system-provider.md index 2dee42ba6a..c7718cd4e5 100644 --- a/blazor/file-manager/azure-cloud-file-system-provider.md +++ b/blazor/file-manager/azure-cloud-file-system-provider.md @@ -11,7 +11,7 @@ documentation: ug ## Introduction to Azure Blob Storage -Azure Blob Storage is Microsoft Azure's object storage solution for the cloud, optimized for storing massive amounts of unstructured data. In this guide, the [Blazor File Manager](https://www.syncfusion.com/blazor-components/blazor-file-manager) connects to Blob Storage through an ASP.NET Core backend so you can securely browse and perform file operations in the File Manager component. +Azure Blob Storage is Microsoft Azure's object storage solution for the cloud, optimized for storing massive amounts of unstructured data. In this guide, the Blazor File Manager connects to Blob Storage through an ASP.NET Core backend so you can securely browse and perform file operations in the File Manager component. ## Prerequisites diff --git a/blazor/file-manager/context-menu.md b/blazor/file-manager/context-menu.md index 57e005e1d4..ef6c5cfae0 100644 --- a/blazor/file-manager/context-menu.md +++ b/blazor/file-manager/context-menu.md @@ -9,7 +9,7 @@ documentation: ug # Context Menu in Blazor File Manager Component -The context menu items can be added for the files, folders, and layout in the [Blazor FileManager](https://www.syncfusion.com/blazor-components/blazor-file-manager) component using the properties of the [ContextMenuSettings](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.FileManager.FileManagerContextMenuSettings.html) below. +The context menu items can be added for the files, folders, and layout in the Blazor File Manager component using the properties of the [ContextMenuSettings](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.FileManager.FileManagerContextMenuSettings.html) below. * [File](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.FileManager.FileManagerContextMenuSettings.html#Syncfusion_Blazor_FileManager_FileManagerContextMenuSettings_File) - Specifies the array of string that is used to configure file items. * [Folder](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.FileManager.FileManagerContextMenuSettings.html#Syncfusion_Blazor_FileManager_FileManagerContextMenuSettings_Folder) - Specifies the array of string that is used to configure folder items. diff --git a/blazor/file-manager/custom-file-provider.md b/blazor/file-manager/custom-file-provider.md index aed7b54aae..80e01443d3 100644 --- a/blazor/file-manager/custom-file-provider.md +++ b/blazor/file-manager/custom-file-provider.md @@ -9,7 +9,7 @@ documentation: ug # Custom file provider for Blazor File Manager Component -You can also create a custom file provider specific to your needs to connect with the [Blazor File Manager](https://www.syncfusion.com/blazor-components/blazor-file-manager) component, instead of relying on the above listed predefined providers offered by Syncfusion. Additionally, you need to ensure that the file actions requests and responses adhere to the same format used in the file system. Below are the details for each file action, to know more information about their request and response parameters. +You can also create a custom file provider specific to your needs to connect with the Blazor File Manager component, instead of relying on the above listed predefined providers offered by Syncfusion. Additionally, you need to ensure that the file actions requests and responses adhere to the same format used in the file system. Below are the details for each file action, to know more information about their request and response parameters. * **Read** - This action is used to read files and directories from the file system. It retrieves the list of files and subdirectories in a specified directory. Click this [link](https://blazor.syncfusion.com/documentation/file-manager/file-operations#reading-files-and-folders) to know about the request and response parameters of read operations. diff --git a/blazor/file-manager/how-to/customize-http-handler.md b/blazor/file-manager/how-to/customize-http-handler.md index c06c8db3ba..d85844ac68 100644 --- a/blazor/file-manager/how-to/customize-http-handler.md +++ b/blazor/file-manager/how-to/customize-http-handler.md @@ -9,7 +9,7 @@ documentation: ug # Customize HTTP handler -In secured applications, API operations including file management, image retrieval, uploads, and downloads often require authentication tokens. The [Blazor File Manager](https://www.syncfusion.com/blazor-components/blazor-file-manager) component provides comprehensive support for adding authorization headers to all requests through various settings and events including [FileManagerUploadSettings](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.FileManager.FileManagerUploadSettings.html), [OnSend](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.FileManager.FileManagerEvents-1.html#Syncfusion_Blazor_FileManager_FileManagerEvents_1_OnSend), [BeforeImageLoad](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.FileManager.FileManagerEvents-1.html#Syncfusion_Blazor_FileManager_FileManagerEvents_1_BeforeImageLoad), and [BeforeDownload](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.FileManager.FileManagerEvents-1.html#Syncfusion_Blazor_FileManager_FileManagerEvents_1_BeforeDownload). +In secured applications, API operations including file management, image retrieval, uploads, and downloads often require authentication tokens. The Blazor File Manager component provides comprehensive support for adding authorization headers to all requests through various settings and events including [FileManagerUploadSettings](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.FileManager.FileManagerUploadSettings.html), [OnSend](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.FileManager.FileManagerEvents-1.html#Syncfusion_Blazor_FileManager_FileManagerEvents_1_OnSend), [BeforeImageLoad](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.FileManager.FileManagerEvents-1.html#Syncfusion_Blazor_FileManager_FileManagerEvents_1_BeforeImageLoad), and [BeforeDownload](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.FileManager.FileManagerEvents-1.html#Syncfusion_Blazor_FileManager_FileManagerEvents_1_BeforeDownload). ## Understanding the Security Challenge diff --git a/blazor/file-manager/how-to/customize-navigation-items.md b/blazor/file-manager/how-to/customize-navigation-items.md index b336554cb9..81222d56a1 100644 --- a/blazor/file-manager/how-to/customize-navigation-items.md +++ b/blazor/file-manager/how-to/customize-navigation-items.md @@ -9,7 +9,7 @@ documentation: ug # Customize Navigation Pane in Blazor File Manager Component -The navigation pane in the [Blazor File Manager](https://www.syncfusion.com/blazor-components/blazor-file-manager) component displays the folder hierarchy in a tree-like structure. You can customize the layout of each folder node in the navigation pane using the `NavigationPaneTemplate` property. This allows you to modify the appearance of folders based on your application's requirements. +The navigation pane in the Blazor File Manager component displays the folder hierarchy in a tree-like structure. You can customize the layout of each folder node in the navigation pane using the `NavigationPaneTemplate` property. This allows you to modify the appearance of folders based on your application's requirements. You may use this template to show additional metadata, custom icons, or other UI elements alongside the folder name. diff --git a/blazor/file-manager/how-to/perform-custom-filtering.md b/blazor/file-manager/how-to/perform-custom-filtering.md index 58c3dd0d02..7227d7a052 100644 --- a/blazor/file-manager/how-to/perform-custom-filtering.md +++ b/blazor/file-manager/how-to/perform-custom-filtering.md @@ -9,7 +9,7 @@ documentation: ug # Perform Custom Filtering in Blazor File Manager component -In the [Blazor File Manager](https://www.syncfusion.com/blazor-components/blazor-file-manager) component, filtering support is provided. When the [FilterFilesAsync](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.FileManager.SfFileManager-1.html#Syncfusion_Blazor_FileManager_SfFileManager_1_FilterFilesAsync_System_Collections_Generic_List__0__) method is called, it triggers a custom operation on the controller side. Using this method, you can perform search operations by passing the SearchString as a parameter. +In the Blazor File Manager component, filtering support is provided. When the [FilterFilesAsync](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.FileManager.SfFileManager-1.html#Syncfusion_Blazor_FileManager_SfFileManager_1_FilterFilesAsync_System_Collections_Generic_List__0__) method is called, it triggers a custom operation on the controller side. Using this method, you can perform search operations by passing the SearchString as a parameter. In the following example, the SearchString value **Downloads** is passed, and based on that, a search operation is performed in the Blazor File Manager using a button click. diff --git a/blazor/file-manager/how-to/previewing-files.md b/blazor/file-manager/how-to/previewing-files.md index 8249163476..3deb3060f3 100644 --- a/blazor/file-manager/how-to/previewing-files.md +++ b/blazor/file-manager/how-to/previewing-files.md @@ -9,7 +9,7 @@ documentation: ug # Previewing files in Blazor File Manager component -In the [Blazor File Manager](https://www.syncfusion.com/blazor-components/blazor-file-manager) component, you can preview PDF files using the [PDF Viewer](https://help.syncfusion.com/document-processing/pdf/pdf-viewer/blazor/getting-started/web-app) component, docx files using the [DocumentEditor](https://blazor.syncfusion.com/documentation/document-editor/getting-started/web-app) component, and play videos within the [Dialog](https://blazor.syncfusion.com/documentation/dialog/getting-started-with-web-app) component. +In the Blazor File Manager component, you can preview PDF files using the [PDF Viewer](https://help.syncfusion.com/document-processing/pdf/pdf-viewer/blazor/getting-started/web-app) component, docx files using the [DocumentEditor](https://blazor.syncfusion.com/documentation/document-editor/getting-started/web-app) component, and play videos within the [Dialog](https://blazor.syncfusion.com/documentation/dialog/getting-started-with-web-app) component. ## Previewing PDF and Word File in Dialog diff --git a/blazor/file-manager/how-to/restrict-drag-and-drop-upload.md b/blazor/file-manager/how-to/restrict-drag-and-drop-upload.md index 43a1ad23b0..3132fe987e 100644 --- a/blazor/file-manager/how-to/restrict-drag-and-drop-upload.md +++ b/blazor/file-manager/how-to/restrict-drag-and-drop-upload.md @@ -9,7 +9,7 @@ documentation: ug # Restrict drag and drop upload -In the [Blazor File Manager](https://www.syncfusion.com/blazor-components/blazor-file-manager) component, you are able to prevent the external drag and drop upload action for any types of files or folders by setting the [DropArea](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.FileManager.FileManagerUploadSettings.html#Syncfusion_Blazor_FileManager_FileManagerUploadSettings_DropArea) property as `@null` in the [`FileManagerUploadSettings`](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.FileManager.FileManagerUploadSettings.html) class. +In the Blazor File Manager component, you are able to prevent the external drag and drop upload action for any types of files or folders by setting the [DropArea](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.FileManager.FileManagerUploadSettings.html#Syncfusion_Blazor_FileManager_FileManagerUploadSettings_DropArea) property as `@null` in the [`FileManagerUploadSettings`](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.FileManager.FileManagerUploadSettings.html) class. The following example demonstrates how to prevent the external drag and drop upload actions for all types of files in the Blazor File Manager component. diff --git a/blazor/file-manager/how-to/upload-large-files.md b/blazor/file-manager/how-to/upload-large-files.md index 6cd1bb7a81..087a63032e 100644 --- a/blazor/file-manager/how-to/upload-large-files.md +++ b/blazor/file-manager/how-to/upload-large-files.md @@ -9,7 +9,7 @@ documentation: ug # Upload large files in Blazor File Manager Component -To enable large file uploads in the [Blazor File Manager](https://www.syncfusion.com/blazor-components/blazor-file-manager) component, you can set the [MaxFileSize](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.FileManager.FileManagerUploadSettings.html#Syncfusion_Blazor_FileManager_FileManagerUploadSettings_MaxFileSize) property in the [`FileManagerUploadSettings`](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.FileManager.FileManagerUploadSettings.html) class. This property allows you to specify the maximum file size that can be uploaded, in bytes. +To enable large file uploads in the Blazor File Manager component, you can set the [MaxFileSize](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.FileManager.FileManagerUploadSettings.html#Syncfusion_Blazor_FileManager_FileManagerUploadSettings_MaxFileSize) property in the [`FileManagerUploadSettings`](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.FileManager.FileManagerUploadSettings.html) class. This property allows you to specify the maximum file size that can be uploaded, in bytes. Here's an example of how to set the `MaxFileSize` property to allow uploads of large files: diff --git a/blazor/file-manager/upload.md b/blazor/file-manager/upload.md index 8d9453b7f9..fd57934480 100644 --- a/blazor/file-manager/upload.md +++ b/blazor/file-manager/upload.md @@ -9,7 +9,7 @@ documentation: ug # Upload in Blazor File Manager component -The [Blazor File Manager](https://www.syncfusion.com/blazor-components/blazor-file-manager) component provides a [FileManagerUploadSettings](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.FileManager.FileManagerUploadSettings.html) property with various options to customize how files are uploaded, such as controlling file size, restricting file types, and enabling chunk uploads. +The Blazor File Manager component provides a [FileManagerUploadSettings](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.FileManager.FileManagerUploadSettings.html) property with various options to customize how files are uploaded, such as controlling file size, restricting file types, and enabling chunk uploads. ## Directory Upload diff --git a/blazor/file-manager/views.md b/blazor/file-manager/views.md index 8f030f66a7..df9c5ecb8e 100644 --- a/blazor/file-manager/views.md +++ b/blazor/file-manager/views.md @@ -9,7 +9,7 @@ documentation: ug # Views in Blazor File Manager component -The [Blazor File Manager](https://www.syncfusion.com/blazor-components/blazor-file-manager) component provides both the `Large Icons View` for visual recognition and the `Details View` for organized information. +The Blazor File Manager component provides both the `Large Icons View` for visual recognition and the `Details View` for organized information. ## Large Icons View diff --git a/blazor/in-place-editor/how-to/disable-edit-mode.md b/blazor/in-place-editor/how-to/disable-edit-mode.md new file mode 100644 index 0000000000..071958d949 --- /dev/null +++ b/blazor/in-place-editor/how-to/disable-edit-mode.md @@ -0,0 +1,61 @@ +--- +layout: post +title: Disable the edit mode in Blazor In-place Editor | Syncfusion® +description: Learn here all about Disable the edit mode specifically in Blazor In-place Editor component and much more details. +platform: Blazor +control: In-place Editor +documentation: ug +--- + +# Disable the Edit Mode Specifically in Blazor In-place Editor Component + +The edit mode of the In-place Editor can be disabled by setting the `Disabled` property value to `true`. In the following example, when you check or uncheck the checkbox, the In-place Editor component will disable or enable the edit mode respectively. + +```cshtml + +@using Syncfusion.Blazor.InPlaceEditor +@using Syncfusion.Blazor.Buttons +@using Syncfusion.Blazor.Inputs + + + + + + + + + + +
Disabled: + +
Enter your name: + + + + + +
+ + + +@code { + public string TextValue { get; set; } = "Andrew"; + public bool Checked { get; set; } = true; + +} +``` \ No newline at end of file diff --git a/blazor/treegrid/getting-started-webapp.md b/blazor/treegrid/getting-started-webapp.md index 10fa08faaf..3b440ae019 100644 --- a/blazor/treegrid/getting-started-webapp.md +++ b/blazor/treegrid/getting-started-webapp.md @@ -182,7 +182,7 @@ N> If the interactivity location is set to `Per page/component` in the Web App, @code { - + public class BusinessObject { public int TaskId { get; set; } diff --git a/blazor/treeview/data-binding.md b/blazor/treeview/data-binding.md index bc7a7955de..402ff11b3a 100644 --- a/blazor/treeview/data-binding.md +++ b/blazor/treeview/data-binding.md @@ -219,7 +219,7 @@ To render the root level nodes, specify the ParentID as null or no need to speci {% previewsample "https://blazorplayground.syncfusion.com/embed/BjBRXcCtBleZlxUf?appbar=false&editor=false&result=true&errorlist=false&theme=fluent2" backgroundimage "[Blazor TreeView with Self-Referential Data](./images/blazor-treeview-hierarchical-data.webp)" %} -### ExpandoObject Binding +### ExpandoObject Binding The Blazor TreeView is a generic component that is strongly bound to a specific model type, but in cases where the model type is unknown at compile time, the TreeView can be bound to a list of ExpandoObjects using the [`DataSource`](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Navigations.TreeViewFieldOptions-1.html#Syncfusion_Blazor_Navigations_TreeViewFieldOptions_1_DataSource) property. This allows the TreeView to perform all supported data operations.