diff --git a/knowledge-base/animationcontainer-close-on-outside-click.md b/knowledge-base/animationcontainer-close-on-outside-click.md index c434b9280..57b1cd807 100644 --- a/knowledge-base/animationcontainer-close-on-outside-click.md +++ b/knowledge-base/animationcontainer-close-on-outside-click.md @@ -15,7 +15,7 @@ res_type: kb Product - Telerik® UI for Blazor AnimationContainer + AnimationContainer for Blazor diff --git a/knowledge-base/blazor-in-asp-net.md b/knowledge-base/blazor-in-asp-net.md index cfc771976..9a102e873 100644 --- a/knowledge-base/blazor-in-asp-net.md +++ b/knowledge-base/blazor-in-asp-net.md @@ -9,13 +9,14 @@ res_type: kb --- ## Environment + - - - - - - + + + + + +
ProductTelerik® UI for Blazor
ProductUI for Blazor
## Description diff --git a/knowledge-base/button-change-icons-position.md b/knowledge-base/button-change-icons-position.md index 6f9a25e1a..87fd98e60 100644 --- a/knowledge-base/button-change-icons-position.md +++ b/knowledge-base/button-change-icons-position.md @@ -10,13 +10,14 @@ res_type: kb --- ## Environment + - - - - - - + + + + + +
ProductTelerik® UI for Blazor Button
ProductButton for Blazor
diff --git a/knowledge-base/buttongroup-mixed-selection-mode.md b/knowledge-base/buttongroup-mixed-selection-mode.md index c16bd5cdc..6116ca1e3 100644 --- a/knowledge-base/buttongroup-mixed-selection-mode.md +++ b/knowledge-base/buttongroup-mixed-selection-mode.md @@ -15,7 +15,7 @@ res_type: kb Product - Telerik® UI for Blazor ButtonGroup + ButtonGroup for Blazor diff --git a/knowledge-base/calendar-allowed-dates.md b/knowledge-base/calendar-allowed-dates.md index 93d23db95..d8998d18e 100644 --- a/knowledge-base/calendar-allowed-dates.md +++ b/knowledge-base/calendar-allowed-dates.md @@ -9,6 +9,16 @@ tags: telerik, blazor, calendar res_type: kb --- +## Environment + + + + + + + + +
ProductCalendar for Blazor
## Description diff --git a/knowledge-base/cdn-fallback.md b/knowledge-base/cdn-fallback.md index 326d61ba2..e16e72ee0 100644 --- a/knowledge-base/cdn-fallback.md +++ b/knowledge-base/cdn-fallback.md @@ -10,6 +10,16 @@ ticketid: 1479427 res_type: kb --- +## Environment + + + + + + + + +
ProductUI for Blazor
## Description diff --git a/knowledge-base/change-theme-runtime.md b/knowledge-base/change-theme-runtime.md index 773cb6def..926a0e31b 100644 --- a/knowledge-base/change-theme-runtime.md +++ b/knowledge-base/change-theme-runtime.md @@ -10,6 +10,16 @@ ticketid: 1442823 res_type: kb --- +## Environment + + + + + + + + +
ProductUI for Blazor
## Description You may want to change the Telerik Blazor Theme during runtime on the fly - for example, to allow your users to choose the application theme. diff --git a/knowledge-base/chart-add-data-table.md b/knowledge-base/chart-add-data-table.md index 64a3411eb..9e55dfce7 100644 --- a/knowledge-base/chart-add-data-table.md +++ b/knowledge-base/chart-add-data-table.md @@ -11,20 +11,23 @@ res_type: kb --- ## Environment + - - - - - - + + + + + +
ProductCharts for Blazor
ProductChart for Blazor
## Description + Is there an easy way to put the data table below the chart? Chart with data table. How to add a data table to the Chart? ## Solution + You can use Grid for data table below the Chart. By using the same data from the Chart in the Grid below it, you can achieve the desired result. >caption Added Grid in the role of data table below the Chart. The result from the snippet below. diff --git a/knowledge-base/chart-datatable-bind.md b/knowledge-base/chart-datatable-bind.md index 1483a4e8b..056a98b89 100644 --- a/knowledge-base/chart-datatable-bind.md +++ b/knowledge-base/chart-datatable-bind.md @@ -11,16 +11,16 @@ res_type: kb --- ## Environment + - - - - + + + +
ProductCharts for Blazor
ProductChart for Blazor
- ## Description How to data bind the Telerik Blazor Chart to a DataTable? diff --git a/knowledge-base/chart-draw-horizontal-vertical-lines.md b/knowledge-base/chart-draw-horizontal-vertical-lines.md index b22c677b6..4d030c28e 100644 --- a/knowledge-base/chart-draw-horizontal-vertical-lines.md +++ b/knowledge-base/chart-draw-horizontal-vertical-lines.md @@ -16,7 +16,7 @@ res_type: kb Product - Charts for Blazor + Chart for Blazor diff --git a/knowledge-base/chart-dynamic-series.md b/knowledge-base/chart-dynamic-series.md index 6d49011a1..ff2cef148 100644 --- a/knowledge-base/chart-dynamic-series.md +++ b/knowledge-base/chart-dynamic-series.md @@ -11,12 +11,13 @@ res_type: kb --- ## Environment + - - - - + + + +
ProductCharts for Blazor
ProductChart for Blazor
diff --git a/knowledge-base/chart-format-percent.md b/knowledge-base/chart-format-percent.md index 9d06e93c6..b7b291afa 100644 --- a/knowledge-base/chart-format-percent.md +++ b/knowledge-base/chart-format-percent.md @@ -16,7 +16,7 @@ res_type: kb Product - Charts for Blazor + Chart for Blazor Version diff --git a/knowledge-base/chart-mark-series-on-click.md b/knowledge-base/chart-mark-series-on-click.md index 6998ea30e..e8da2a2d3 100644 --- a/knowledge-base/chart-mark-series-on-click.md +++ b/knowledge-base/chart-mark-series-on-click.md @@ -9,6 +9,17 @@ tags: res_type: kb --- +## Environment + + + + + + + + +
ProductChart for Blazor
+ ## Description diff --git a/knowledge-base/chart-newtonsoft-seialization-settings.md b/knowledge-base/chart-newtonsoft-seialization-settings.md index e304d11dc..58fddea8c 100644 --- a/knowledge-base/chart-newtonsoft-seialization-settings.md +++ b/knowledge-base/chart-newtonsoft-seialization-settings.md @@ -15,16 +15,16 @@ res_type: kb - - + + - - + + - +
Product Version2.10.0ProductChart for Blazor
ProductCharts for BlazorProduct Version2.10.0
Blazor application typeClient-sideWebAssembly
diff --git a/knowledge-base/chart-performance-optimization.md b/knowledge-base/chart-performance-optimization.md index 1607d1c0c..81cb3cea5 100644 --- a/knowledge-base/chart-performance-optimization.md +++ b/knowledge-base/chart-performance-optimization.md @@ -11,26 +11,24 @@ res_type: kb --- ## Environment + - - - - - - - - + + + +
Product Versionany
ProductProgress® Telerik® UI for Blazor
ProductChart for Blazor
- ## Description + Sometimes the chart data will be updated in real time (for example, by using SignalR or loops). When doing this, the chart updates may seem to be really jerky during the re-render. ## Possible Cause + When the data changes, the chart re-renders from scratch, and has an animation enabled by default. If the data updates come in too often, the browser simply drops the framerate while re-rendering the charts due to performance reasons. @@ -38,6 +36,7 @@ If the data updates come in too often, the browser simply drops the framerate wh In some test cases around 10 second intervals provide smooth animations, while 2-3 second intervals result in performance issues. ## Solution + There are several things you can do to improve the performance, and you can do any or all of them: * Set the `Transitions` property of the chart to `false` to disable the animations. diff --git a/knowledge-base/chart-print-chart-only.md b/knowledge-base/chart-print-chart-only.md index 0bedf6123..251698912 100644 --- a/knowledge-base/chart-print-chart-only.md +++ b/knowledge-base/chart-print-chart-only.md @@ -9,6 +9,17 @@ tags: res_type: kb --- +## Environment + + + + + + + + +
ProductChart for Blazor
+ ## Description diff --git a/knowledge-base/chart-responsive.md b/knowledge-base/chart-responsive.md index fa3f98528..4739dbffb 100644 --- a/knowledge-base/chart-responsive.md +++ b/knowledge-base/chart-responsive.md @@ -10,16 +10,16 @@ res_type: kb --- ## Environment + - - - - + + + +
ProductCharts for Blazor
ProductChart for Blazor
- ## Description When the user resizes the browser window or some layout change happens (for example, a navigation panel is expanded or collapsed), you may want to have the charts redraw with the new dimensions. diff --git a/knowledge-base/chart-stacked-series-sum-label.md b/knowledge-base/chart-stacked-series-sum-label.md index 60d9b0468..864e6f221 100644 --- a/knowledge-base/chart-stacked-series-sum-label.md +++ b/knowledge-base/chart-stacked-series-sum-label.md @@ -16,7 +16,7 @@ res_type: kb Product - Charts for Blazor + Chart for Blazor Version diff --git a/knowledge-base/chart-style-the-series-labels.md b/knowledge-base/chart-style-the-series-labels.md index f61a6f495..c2d910c8f 100644 --- a/knowledge-base/chart-style-the-series-labels.md +++ b/knowledge-base/chart-style-the-series-labels.md @@ -13,15 +13,14 @@ res_type: kb ## Environment - - - - - - + + + + + +
ProductCharts for Blazor
ProductChart for Blazor
- ## Description The [UI for Blazor Chart]({%slug components/chart/overview%}) is rendered using the [HTML Canvas API](https://developer.mozilla.org/en-US/docs/web/html/element/canvas) or [Scalable Vector Graphic](https://developer.mozilla.org/en-US/docs/Web/SVG) and that means manipulating the styling and appearance is not possible without an existing API from the chart component. diff --git a/knowledge-base/chart-transparent-marker.md b/knowledge-base/chart-transparent-marker.md index b7aae7861..088f2445f 100644 --- a/knowledge-base/chart-transparent-marker.md +++ b/knowledge-base/chart-transparent-marker.md @@ -11,13 +11,14 @@ res_type: kb --- ## Environment + - - - - - - + + + + + +
ProductCharts for Blazor
ProductChart for Blazor
diff --git a/knowledge-base/common-animate-content-change.md b/knowledge-base/common-animate-content-change.md index 70f2e4fb7..b652dd4d9 100644 --- a/knowledge-base/common-animate-content-change.md +++ b/knowledge-base/common-animate-content-change.md @@ -10,9 +10,19 @@ ticketid: 1505799 res_type: kb --- +## Environment + + + + + + + +
ProductUI for Blazor
## Description + We want to do some animations to show the flow between some razor components. I want to change content on my page with an animation. diff --git a/knowledge-base/common-cannot-read-properties-of-null-reading-addeventlistener.md b/knowledge-base/common-cannot-read-properties-of-null-reading-addeventlistener.md index 7664d5413..3561891ce 100644 --- a/knowledge-base/common-cannot-read-properties-of-null-reading-addeventlistener.md +++ b/knowledge-base/common-cannot-read-properties-of-null-reading-addeventlistener.md @@ -11,16 +11,20 @@ res_type: kb --- ## Environment + - - - - - - + + + + + + + + + +
Blazor application typeWebAssembly
ProductUI for Blazor
Blazor application typeWebAssembly
- ## Description JSInterop (JavaScript) error in the browser devtools console: diff --git a/knowledge-base/common-change-selected-localization-keys.md b/knowledge-base/common-change-selected-localization-keys.md index 73bac2a93..0359c3e64 100644 --- a/knowledge-base/common-change-selected-localization-keys.md +++ b/knowledge-base/common-change-selected-localization-keys.md @@ -16,12 +16,11 @@ res_type: kb Product - Telerik UI for Blazor + UI for Blazor - ## Description This knowledge base article addresses the following scenarios. diff --git a/knowledge-base/common-code-examples-in-documentation-do-not-compile.md b/knowledge-base/common-code-examples-in-documentation-do-not-compile.md index f349ac257..cda77b883 100644 --- a/knowledge-base/common-code-examples-in-documentation-do-not-compile.md +++ b/knowledge-base/common-code-examples-in-documentation-do-not-compile.md @@ -11,13 +11,14 @@ res_type: kb --- ## Environment + - - - - - - + + + + + +
ProductTelerik REPL for Blazor
ProductUI for Blazor
diff --git a/knowledge-base/common-css-isolation.md b/knowledge-base/common-css-isolation.md index 8ccbaa98c..48297eaa9 100644 --- a/knowledge-base/common-css-isolation.md +++ b/knowledge-base/common-css-isolation.md @@ -10,8 +10,20 @@ ticketid: 1489739 res_type: kb --- +## Environment + + + + + + + + +
ProductUI for Blazor
+ ## Description -I'm wanting to leverage CSS isolation in my projects but am finding that it doesn't work with Telerik components. + +I want to leverage CSS isolation in my projects but am finding that it doesn't work with Telerik components. ## Steps to Reproduce diff --git a/knowledge-base/common-dynamic-refs.md b/knowledge-base/common-dynamic-refs.md index d33f08dd0..2db529d44 100644 --- a/knowledge-base/common-dynamic-refs.md +++ b/knowledge-base/common-dynamic-refs.md @@ -16,7 +16,7 @@ res_type: kb Product - Telerik UI for Blazor + UI for Blazor diff --git a/knowledge-base/common-icon-names-list.md b/knowledge-base/common-icon-names-list.md index 13a8127da..70d11adf3 100644 --- a/knowledge-base/common-icon-names-list.md +++ b/knowledge-base/common-icon-names-list.md @@ -10,6 +10,21 @@ ticketid: res_type: kb --- +## Environment + + + + + + + + + + + + +
ProductUI for Blazor
Version3.x
+ ## Description If you have used the obsolete `Telerik.Blazor.IconName` class, here is the list of icon names in its stead. The [Built-in Icons page]({%slug common-features-icons%}#icons-list) provides an up-to-date list of all available font icons in our themes. diff --git a/knowledge-base/common-kb-render-fragment-parameter-null.md b/knowledge-base/common-kb-render-fragment-parameter-null.md index 1c53e94ea..b401ad092 100644 --- a/knowledge-base/common-kb-render-fragment-parameter-null.md +++ b/knowledge-base/common-kb-render-fragment-parameter-null.md @@ -10,6 +10,16 @@ ticketid: 1449470 res_type: kb --- +## Environment + + + + + + + + +
ProductUI for Blazor
## Description diff --git a/knowledge-base/common-lazy-load-assemblies-wasm.md b/knowledge-base/common-lazy-load-assemblies-wasm.md index b81dc5a04..770452241 100644 --- a/knowledge-base/common-lazy-load-assemblies-wasm.md +++ b/knowledge-base/common-lazy-load-assemblies-wasm.md @@ -15,7 +15,11 @@ res_type: kb - + + + + + diff --git a/knowledge-base/common-net8-sections.md b/knowledge-base/common-net8-sections.md index 9d98c5ce6..8002cd091 100644 --- a/knowledge-base/common-net8-sections.md +++ b/knowledge-base/common-net8-sections.md @@ -15,7 +15,7 @@ res_type: kb - + diff --git a/knowledge-base/common-newtonsoft-breaks-datasourcerequest-serialization.md b/knowledge-base/common-newtonsoft-breaks-datasourcerequest-serialization.md index 63bb45494..826d755f2 100644 --- a/knowledge-base/common-newtonsoft-breaks-datasourcerequest-serialization.md +++ b/knowledge-base/common-newtonsoft-breaks-datasourcerequest-serialization.md @@ -11,13 +11,18 @@ res_type: kb --- ## Environment +
UI for Blazor versionProductUI for Blazor
Version 2.19.0 and above
ProductTelerik UI for BlazorUI for Blazor
Version
- - - - - - + + + + + + + + + +
Blazor application typeWebAssembly
ProductUI for Blazor
Blazor application typeWebAssembly
diff --git a/knowledge-base/common-panel-control.md b/knowledge-base/common-panel-control.md index 4a06edff5..d439c2ec9 100644 --- a/knowledge-base/common-panel-control.md +++ b/knowledge-base/common-panel-control.md @@ -11,12 +11,16 @@ res_type: kb --- ## Environment + - - + + + + + +
ProductUI for Blazor
- ## Description Is there a good equivalent in your control set or plans for new controls as a replacement for the Web Forms Panel control? We are trying to replicate UI that we had in our Web Forms project and we cannot find a good replacement for a panel. diff --git a/knowledge-base/common-partial-localization.md b/knowledge-base/common-partial-localization.md index 85d072173..858be2ac3 100644 --- a/knowledge-base/common-partial-localization.md +++ b/knowledge-base/common-partial-localization.md @@ -10,6 +10,16 @@ ticketid: 1494633 res_type: kb --- +## Environment + + + + + + + + +
ProductUI for Blazor
## Description @@ -17,8 +27,6 @@ I am using [localization]({%slug globalization-localization%}) for my components For example, the column menu stays in English, or is missing its texts altogether. Or, the filter option messages are not translated. - - Symptoms include: * Basically, localization is enabled but the messages for Grids (or other components) are not localized. diff --git a/knowledge-base/common-popup-causes-scroll-on-show.md b/knowledge-base/common-popup-causes-scroll-on-show.md index aefc08780..4e46e772b 100644 --- a/knowledge-base/common-popup-causes-scroll-on-show.md +++ b/knowledge-base/common-popup-causes-scroll-on-show.md @@ -10,7 +10,19 @@ ticketid: 1520791, 1520425 res_type: kb --- - +## Environment + + + + + + + + +
Product + ContextMenu for Blazor,
+ Window for Blazor +
## Description If I click a link to spawn a window and I'm currently scrolled up to the top of the page, the pop-up appears centered in the viewport (as desired), but if I am scrolled down, the browser (Edge & Chrome) scrolls up and places the window in the center of the viewport scrolled up (not where I was). diff --git a/knowledge-base/common-stack-grid-layout.md b/knowledge-base/common-stack-grid-layout.md index 6917c400c..4ca8f95e4 100644 --- a/knowledge-base/common-stack-grid-layout.md +++ b/knowledge-base/common-stack-grid-layout.md @@ -9,7 +9,18 @@ tags: res_type: kb --- - +## Environment + + + + + + + + +
ProductGrid for Blazor
+ +## Description I want to make grid and stack layouts like in XAML (WPF, Xamarin, UWP) and WinForms. In those frameworks, we use specific components for this. How do I do the same in Blazor? diff --git a/knowledge-base/common-themebuilder-json-from-scss.md b/knowledge-base/common-themebuilder-json-from-scss.md index d77779f2f..f04b42a7a 100644 --- a/knowledge-base/common-themebuilder-json-from-scss.md +++ b/knowledge-base/common-themebuilder-json-from-scss.md @@ -11,16 +11,16 @@ res_type: kb --- ## Environment + - - - - - - + + + + + +
ProductUI for Blazor, ThemeBuilder
ProductUI for Blazor
- ## Description I have older custom themes exported as SCSS (SASS) and JSON files with variables and values, which I created with previous versions of [the ThemeBuilder application](https://themebuilderapp.telerik.com). I want to import this SCSS file into ThemeBuilder to make some changes, but the Theme Builder now requires a ZIP file import. diff --git a/knowledge-base/common-toolbox.md b/knowledge-base/common-toolbox.md index ffcce041f..92333739e 100644 --- a/knowledge-base/common-toolbox.md +++ b/knowledge-base/common-toolbox.md @@ -10,8 +10,19 @@ ticketid: 1503556 res_type: kb --- +## Environment + + + + + + + + +
ProductUI for Blazor
## Description + I'm trying to build Blazor Apps, both Server and Web Assembly using Visual Studio Professional 2019. When I open a .razor component in design view, the Toolbox does not contain any (Telerik) tools. This is true whether I use the generic Blazor App template or any of the Telerik Blazor templates. How can add the Blazor tools I purchased from Telerik to the Toolbox? @@ -21,6 +32,7 @@ I have created a new Telerik Blazor project in Visual Studio. I can't see any o ![no components in the toolbox for blazor components](images/no-toolbox-components-in-blazor.png) ## Possible Cause + Generally speaking, ASP.NET MVC/Core doesn't have the same kind of toolbox & designer integration that you're used to with platforms like WPF and ASP.NET AJAX. For the most part, use of razor syntax based environments (like Blazor, MVC, Razor Pages) is explicitly not a drag/drop affair. This allows for great flexibility in the layouts and types of applications you create without hindering the IDE with additional tools that need maintenance. The razor syntax has moved away from the concept of a drag-and-drop IDE and the Rapid-Application-Design towards code-first application creation. @@ -28,6 +40,7 @@ For the most part, use of razor syntax based environments (like Blazor, MVC, Raz Especially in Blazor, nesting components is a very common practice and creating a design surface to allow drag-and-drop will require that the entire application layout is evaluated and rendered. This would be an expensive and difficult operations. ## Suggested Workarounds + While there isn't a toolbox available for Blazor in general, there are a few things you can do to speed up development: * Bookmark our documentation, especially components/feature you use often and copy the code snippets from the documentation in your projects as starting points. diff --git a/knowledge-base/common-upgrade-breaks-css-theme-styles.md b/knowledge-base/common-upgrade-breaks-css-theme-styles.md index 07adeab05..ba02024ef 100644 --- a/knowledge-base/common-upgrade-breaks-css-theme-styles.md +++ b/knowledge-base/common-upgrade-breaks-css-theme-styles.md @@ -16,7 +16,7 @@ res_type: kb Product - Telerik UI for Blazor + UI for Blazor diff --git a/knowledge-base/common-validation-error-in-tooltip.md b/knowledge-base/common-validation-error-in-tooltip.md index dd42f1a3b..e0da003ab 100644 --- a/knowledge-base/common-validation-error-in-tooltip.md +++ b/knowledge-base/common-validation-error-in-tooltip.md @@ -10,6 +10,17 @@ ticketid: 1454018 res_type: kb --- +## Environment + + + + + + + + +
ProductUI for Blazor
+ ## Description diff --git a/knowledge-base/common-wasm-prerendering.md b/knowledge-base/common-wasm-prerendering.md index 6263a78ea..337a14f28 100644 --- a/knowledge-base/common-wasm-prerendering.md +++ b/knowledge-base/common-wasm-prerendering.md @@ -9,6 +9,17 @@ tags: res_type: kb --- +## Environment + + + + + + + + +
ProductUI for Blazor
+ ## Description I want to use the web assembly server-side pre-rendering feature in .NET 5 - the `WebAssemblyPrerendered` mode. @@ -42,6 +53,3 @@ There are a couple of things specific to the Telerik components that you need to * Add other specific services to the `Server` project as well (such as localization services for the Telerik components, or other services for your app like data retrieval logic) and ensure they have an appropriate implementation that can work on the server. The last three steps are required so the server can also work with the Telerik components and render them. This is similar to using a server-side Blazor application - the first render happens on the server, like with a server-side Blazor app. - - - diff --git a/knowledge-base/components-with-same-name.md b/knowledge-base/components-with-same-name.md index 552075f74..2d0342c3e 100644 --- a/knowledge-base/components-with-same-name.md +++ b/knowledge-base/components-with-same-name.md @@ -10,6 +10,19 @@ ticketid: 1422474 res_type: kb --- +## Environment + + + + + + + + +
ProductUI for Blazor
+ +## Description + When creating components, make sure that you use unique names for them and their file name. If the class name matches another component, you may get strange results, for example: * You may get the Intellisense and features of one instead of the other, or a mix of both. @@ -26,5 +39,3 @@ You will get the intellisense from the Telerik grid, you will be able to define >note This [may be fixed in .NET Core 3.1 Preview 1](https://github.com/aspnet/AspNetCore/issues/13573) after our report. The **solution** is to ensure that the component names in the project are unique, both across components in different folders of your own making, and with components from third party libraries you may be using. - - diff --git a/knowledge-base/confirm-button-click-message-box.md b/knowledge-base/confirm-button-click-message-box.md index 70d70bfc9..e1fbc6939 100644 --- a/knowledge-base/confirm-button-click-message-box.md +++ b/knowledge-base/confirm-button-click-message-box.md @@ -9,6 +9,20 @@ tags: res_type: kb --- +## Environment + + + + + + + + +
Product + Dialog for Blazor,
+ Window for Blazor +
+ ## Description diff --git a/knowledge-base/dpl-allocate-memory-error.md b/knowledge-base/dpl-allocate-memory-error.md index a0af6655d..748369073 100644 --- a/knowledge-base/dpl-allocate-memory-error.md +++ b/knowledge-base/dpl-allocate-memory-error.md @@ -11,13 +11,14 @@ res_type: kb --- ## Environment + - - - - - - + + + + + +
ProductProgress® Telerik® UI for Blazor - Document Processing
ProductUI for Blazor
diff --git a/knowledge-base/drawer-as-side-navigation.md b/knowledge-base/drawer-as-side-navigation.md index d77a6053a..d7c212df2 100644 --- a/knowledge-base/drawer-as-side-navigation.md +++ b/knowledge-base/drawer-as-side-navigation.md @@ -9,6 +9,17 @@ tags: res_type: kb --- +## Environment + + + + + + + + +
ProductDrawer for Blazor
+ ## Description diff --git a/knowledge-base/drawer-click-in-dropdown-closes-drawer.md b/knowledge-base/drawer-click-in-dropdown-closes-drawer.md index 2e2fed340..ec597a035 100644 --- a/knowledge-base/drawer-click-in-dropdown-closes-drawer.md +++ b/knowledge-base/drawer-click-in-dropdown-closes-drawer.md @@ -14,12 +14,20 @@ res_type: kb - - - - - + +
ProductDrawer for Blazor
All components that use popups or dropdowns:
- AutoComplete, ComboBox, DropDownList, MultiSelect, DatePicker, DateRangePicker, DateTimePicker, DateTimePicker		Product + Drawer for Blazor,
+
+ AutoComplete for Blazor,
+ ComboBox for Blazor,
+ DropDownList for Blazor,
+ MultiColumnComboBox for Blazor,
+ MultiSelect for Blazor,
+ DatePicker for Blazor,
+ DateRangePicker for Blazor,
+ DateTimePicker for Blazor,
+ TimePicker for Blazor +
diff --git a/knowledge-base/drawer-template-as-side-navigation.md b/knowledge-base/drawer-template-as-side-navigation.md index 1e87a05e6..5a06e55a9 100644 --- a/knowledge-base/drawer-template-as-side-navigation.md +++ b/knowledge-base/drawer-template-as-side-navigation.md @@ -9,6 +9,17 @@ tags: res_type: kb --- +## Environment + + + + + + + + +
ProductDrawer for Blazor
+ ## Description diff --git a/knowledge-base/drawer-two-drawers-on-the-same-site.md b/knowledge-base/drawer-two-drawers-on-the-same-site.md index 3a907828b..55260c0cb 100644 --- a/knowledge-base/drawer-two-drawers-on-the-same-site.md +++ b/knowledge-base/drawer-two-drawers-on-the-same-site.md @@ -9,6 +9,17 @@ tags: res_type: kb --- +## Environment + + + + + + + + +
ProductDrawer for Blazor
+ ## Description diff --git a/knowledge-base/dropdowns-custom-item-background.md b/knowledge-base/dropdowns-custom-item-background.md index 056e4226a..911bdcc81 100644 --- a/knowledge-base/dropdowns-custom-item-background.md +++ b/knowledge-base/dropdowns-custom-item-background.md @@ -11,13 +11,19 @@ res_type: kb --- ## Environment + - - - - - - + + + + + +
ProductAutoComplete, ComboBox, DropDownList, MultiSelect for Blazor
Product + AutoComplete for Blazor,
+ ComboBox for Blazor,
+ DropDownList for Blazor,
+ MultiSelect for Blazor +
diff --git a/knowledge-base/editor-markdown.md b/knowledge-base/editor-markdown.md index 1c3b5a5d7..060a0ce99 100644 --- a/knowledge-base/editor-markdown.md +++ b/knowledge-base/editor-markdown.md @@ -9,6 +9,17 @@ tags: res_type: kb --- +## Environment + + + + + + + + +
ProductEditor for Blazor
+ ## Description diff --git a/knowledge-base/font-icons-not-rendering.md b/knowledge-base/font-icons-not-rendering.md index 9f993a92c..8d0f433da 100644 --- a/knowledge-base/font-icons-not-rendering.md +++ b/knowledge-base/font-icons-not-rendering.md @@ -14,12 +14,12 @@ res_type: kb - - + + - - + +
Product Version4.6.0ProductUI for Blazor
ProductProgress® Telerik® UI for BlazorProduct Version4.6.0
diff --git a/knowledge-base/form-chrome-autofill.md b/knowledge-base/form-chrome-autofill.md index bd19f446c..da3243172 100644 --- a/knowledge-base/form-chrome-autofill.md +++ b/knowledge-base/form-chrome-autofill.md @@ -10,13 +10,18 @@ res_type: kb --- ## Environment + - - - - - - + + + + + +
ProductForm for Blazor, all inputs (textboxes)
Product + Form for Blazor,
+ TextBox for Blazor,
+ TextArea for Blazor +
## Description diff --git a/knowledge-base/gauge-pointer-tooltip.md b/knowledge-base/gauge-pointer-tooltip.md index 51a74fcaf..9788dd085 100644 --- a/knowledge-base/gauge-pointer-tooltip.md +++ b/knowledge-base/gauge-pointer-tooltip.md @@ -15,10 +15,12 @@ res_type: kb Product - Arc Gauge for Blazor,
- Circular Gauge for Blazor,
- Linear Gauge for Blazor,
- Radial Gauge for Blazor + + ArcGauge for Blazor,
+ CircularGauge for Blazor,
+ LinearGauge for Blazor,
+ RadialGauge for Blazor + diff --git a/knowledge-base/grid-adjust-height-with-browser.md b/knowledge-base/grid-adjust-height-with-browser.md index e7998789f..adfae925c 100644 --- a/knowledge-base/grid-adjust-height-with-browser.md +++ b/knowledge-base/grid-adjust-height-with-browser.md @@ -9,6 +9,17 @@ tags: res_type: kb --- +## Environment + + + + + + + + +
ProductGrid for Blazor
+ ## Description diff --git a/knowledge-base/grid-autofit-columns.md b/knowledge-base/grid-autofit-columns.md index 4b0a82723..32e42a1b3 100644 --- a/knowledge-base/grid-autofit-columns.md +++ b/knowledge-base/grid-autofit-columns.md @@ -10,6 +10,16 @@ ticketid: 1568815 res_type: kb --- +## Environment + + + + + + + + +
ProductGrid for Blazor
## Description diff --git a/knowledge-base/grid-batch-edit.md b/knowledge-base/grid-batch-edit.md index c7ca5e407..cb8466fe0 100644 --- a/knowledge-base/grid-batch-edit.md +++ b/knowledge-base/grid-batch-edit.md @@ -10,6 +10,16 @@ ticketid: 1556263 res_type: kb --- +## Environment + + + + + + + + +
ProductGrid for Blazor
## Description @@ -18,8 +28,4 @@ How to edit several records in the grid at once and to only create one request t ## Solution -An example is available in the following project: [https://github.com/telerik/blazor-ui/tree/master/grid/batch-editing](https://github.com/telerik/blazor-ui/tree/master/grid/batch-editing) - -> Clicking on the "Save All" button while there is an open cell editor can cause a race condition with the browser events. As a result, the new value in the open cell editor may not be persisted. There are two ways to avoid this: -> * Use the `OnEdit` and `OnUpdate` events to enable the "Save All" button when the Grid is **not** in edit mode -> * [Check the Grid State]({%slug grid-state%}#initiate-editing-or-inserting-of-an-item) in the "Save All" click handler to see if the Grid is in edit mode. In this case, [call the OnUpdate handler manually]({%slug components/grid/editing/incell%}#editor-template) and apply the user changes to the Grid data. Unlike the linked example, there is no need to exit edit mode programmatically, because the Grid will do that. However, mind the possibility for the `OnUpdate` handler to execute twice. +An example is available on the Telerik UI for Blazor demo site: [Telerik Blazor Grid Batch Editing](https://demos.telerik.com/blazor-ui/grid/batch-editing) diff --git a/knowledge-base/grid-bind-navigation-property-complex-object.md b/knowledge-base/grid-bind-navigation-property-complex-object.md index adf4065e9..cbeccd4eb 100644 --- a/knowledge-base/grid-bind-navigation-property-complex-object.md +++ b/knowledge-base/grid-bind-navigation-property-complex-object.md @@ -10,6 +10,18 @@ ticketid: res_type: kb --- +## Environment + + + + + + + + +
ProductGrid for Blazor
+ + ## Description I bind the Grid to Data with complex objects in its model, not only primitive types. diff --git a/knowledge-base/grid-custom-edit-form.md b/knowledge-base/grid-custom-edit-form.md index aa9d537ee..e59a2108b 100644 --- a/knowledge-base/grid-custom-edit-form.md +++ b/knowledge-base/grid-custom-edit-form.md @@ -9,6 +9,17 @@ tags: res_type: kb --- +## Environment + + + + + + + + +
ProductGrid for Blazor
+ ## Description diff --git a/knowledge-base/grid-custommetadata-validation-issue.md b/knowledge-base/grid-custommetadata-validation-issue.md index 7f071a20c..942e18edb 100644 --- a/knowledge-base/grid-custommetadata-validation-issue.md +++ b/knowledge-base/grid-custommetadata-validation-issue.md @@ -10,11 +10,23 @@ ticketid: 1506280 res_type: kb --- +## Environment + + + + + + + + +
ProductGrid for Blazor
## Description + All of our Models are Generated via EF Scaffolding. We need to be able to specify our Validation criteria using the [MetadataTypeAttribute](https://docs.microsoft.com/en-us/dotnet/api/system.componentmodel.dataannotations.metadatatypeattribute?view=net-5.0) and partial classes, but the validation is not honored in the Telerik components. ## Possible Cause + The grid needs to create a new instance of the model for inserting or editing, and the only way to do that is to use `Activator.CreateInstance()`. This does not take into account the custom metadata type from the partial classes however, so the model that it returns does not have data annotations at all, and so - no validation or other attributes. >caption You can reproduce this behavior with the following simplistic markup without any Telerik components. @@ -75,4 +87,3 @@ The Telerik components cannot get an instance of the model in any other way, so * Create a custom edit form ([inline](https://demos.telerik.com/blazor-ui/grid/editing-custom-form) or [popup](https://github.com/telerik/blazor-ui/tree/master/grid/custom-popup-form)) where you can implement the model generation and validation as required in a way that works for your project. * If you have the same models and can create an instance that has the desired validation, you can try setting it through the [grid state]({%slug grid-state%}) to initiate insertion or editing for a particular model instance, rather than let the grid create it. - diff --git a/knowledge-base/grid-datasourcerequest-on-server.md b/knowledge-base/grid-datasourcerequest-on-server.md index a66108657..1ee63e06f 100644 --- a/knowledge-base/grid-datasourcerequest-on-server.md +++ b/knowledge-base/grid-datasourcerequest-on-server.md @@ -9,6 +9,17 @@ tags: res_type: kb --- +## Environment + + + + + + + + +
ProductGrid for Blazor
+ ## Description diff --git a/knowledge-base/grid-different-group-and-subgroup-header-styles b/knowledge-base/grid-different-group-and-subgroup-header-styles.md similarity index 96% rename from knowledge-base/grid-different-group-and-subgroup-header-styles rename to knowledge-base/grid-different-group-and-subgroup-header-styles.md index fca5f2d4d..42fbd30fa 100644 --- a/knowledge-base/grid-different-group-and-subgroup-header-styles +++ b/knowledge-base/grid-different-group-and-subgroup-header-styles.md @@ -11,16 +11,16 @@ res_type: kb --- ## Environment + - - - - - - + + + + + +
ProductGrid for Blazor
ProductGrid for Blazor
- ## Description By default, the group and subgroup headers are styled in the exact same way and it is hard to differentiate them. I would like to style my group headers slightly different than the subgroup headers. How to achieve this? diff --git a/knowledge-base/grid-dynamic-column-template.md b/knowledge-base/grid-dynamic-column-template.md index 395e88fc5..3f7bddaf9 100644 --- a/knowledge-base/grid-dynamic-column-template.md +++ b/knowledge-base/grid-dynamic-column-template.md @@ -11,13 +11,18 @@ res_type: kb --- ## Environment + - - - - - - + + + + + +
ProductAny Blazor component with a RenderFragment template, example with Telerik Grid for Blazor
Product + Grid for Blazor,
+ TreeList for Blazor,
+ UI for Blazor +
diff --git a/knowledge-base/grid-grpc.md b/knowledge-base/grid-grpc.md index f1bb40288..748a40f85 100644 --- a/knowledge-base/grid-grpc.md +++ b/knowledge-base/grid-grpc.md @@ -9,6 +9,17 @@ tags: res_type: kb --- +## Environment + + + + + + + + +
ProductUI for Blazor
+ ## Description diff --git a/knowledge-base/grid-import-excel.md b/knowledge-base/grid-import-excel.md index cc77dbf87..4de69e5dd 100644 --- a/knowledge-base/grid-import-excel.md +++ b/knowledge-base/grid-import-excel.md @@ -9,14 +9,14 @@ res_type: kb --- ## Environment + - - - - - - - + + + + + +
ProductTelerik® UI for Blazor GridTelerik® UI Document Processing Library
ProductGrid for Blazor
diff --git a/knowledge-base/grid-load-on-demand-hierarchy.md b/knowledge-base/grid-load-on-demand-hierarchy.md index 0562a0ef3..a50ec2aa6 100644 --- a/knowledge-base/grid-load-on-demand-hierarchy.md +++ b/knowledge-base/grid-load-on-demand-hierarchy.md @@ -9,6 +9,16 @@ tags: res_type: kb --- +## Environment + + + + + + + + +
ProductGrid for Blazor
## Description diff --git a/knowledge-base/grid-merge-cells.md b/knowledge-base/grid-merge-cells.md index 4a932ab4a..aac775a22 100644 --- a/knowledge-base/grid-merge-cells.md +++ b/knowledge-base/grid-merge-cells.md @@ -9,6 +9,16 @@ tags: res_type: kb --- +## Environment + + + + + + + + +
ProductGrid for Blazor
## Description diff --git a/knowledge-base/grid-multiselect-editor.md b/knowledge-base/grid-multiselect-editor.md index d6313a1df..ab133cc0a 100644 --- a/knowledge-base/grid-multiselect-editor.md +++ b/knowledge-base/grid-multiselect-editor.md @@ -10,6 +10,20 @@ ticketid: res_type: kb --- +## Environment + + + + + + + + +
Product + Grid for Blazor,
+ MultiSelect for Blazor +
+ ## Description I want to use a MultiSelect for a column editor in the Grid to let the user select and edit multiple values from a list in a single column. I want a multiselect column. diff --git a/knowledge-base/grid-odata.md b/knowledge-base/grid-odata.md index 23da3e46d..673643ca2 100644 --- a/knowledge-base/grid-odata.md +++ b/knowledge-base/grid-odata.md @@ -9,6 +9,17 @@ tags: res_type: kb --- +## Environment + + + + + + + + +
ProductGrid for Blazor
+ ## Description diff --git a/knowledge-base/grid-paste-from-excel.md b/knowledge-base/grid-paste-from-excel.md index 8f275923d..c41762c8e 100644 --- a/knowledge-base/grid-paste-from-excel.md +++ b/knowledge-base/grid-paste-from-excel.md @@ -9,6 +9,17 @@ tags: res_type: kb --- +## Environment + + + + + + + + +
ProductGrid for Blazor
+ ## Description diff --git a/knowledge-base/grid-persist-selection-across-pages.md b/knowledge-base/grid-persist-selection-across-pages.md index 907c3dfdd..0e9c3ebcf 100644 --- a/knowledge-base/grid-persist-selection-across-pages.md +++ b/knowledge-base/grid-persist-selection-across-pages.md @@ -9,6 +9,17 @@ tags: res_type: kb --- +## Environment + + + + + + + + +
ProductGrid for Blazor
+ ## Description diff --git a/knowledge-base/grid-pin-rows.md b/knowledge-base/grid-pin-rows.md index 857b56266..eaf4ebcf1 100644 --- a/knowledge-base/grid-pin-rows.md +++ b/knowledge-base/grid-pin-rows.md @@ -9,6 +9,17 @@ tags: grid, pin, rows, sticky, frozen, locked res_type: kb --- +## Environment + + + + + + + + +
ProductGrid for Blazor
+ ## Description I would like to pin one or more rows on top of the Grid so that they are always visible to the users. diff --git a/knowledge-base/grid-popup-edit-form-columns.md b/knowledge-base/grid-popup-edit-form-columns.md index 2acc2ad32..7e50f8b4f 100644 --- a/knowledge-base/grid-popup-edit-form-columns.md +++ b/knowledge-base/grid-popup-edit-form-columns.md @@ -10,12 +10,29 @@ ticketid: 1534563,1536862 res_type: kb --- +## Environment + + + + + + + + +
ProductGrid for Blazor
+ ## Description How do I display the Grid popup edit form in a multiple-column layout? How do I show a scrollbar if the number of Grid columns to edit is too large and overflows the page? ## Solution +Customize the Grid edit from through the [`GridPopupEditFormSettings` tag]({%slug components/grid/editing/popup%}#edit-form-customization). + +https://docs.telerik.com/blazor-ui/components/grid/editing/popup#edit-form-customization + +## Versions before 3.1.0 + Use the [`column-count` CSS style](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Columns) to apply a column-based layout in the Grid popup edit form. The following CSS rule targets TelerikForms inside TelerikWindows: ````css diff --git a/knowledge-base/grid-print.md b/knowledge-base/grid-print.md index 8e3275d93..1937c3d27 100644 --- a/knowledge-base/grid-print.md +++ b/knowledge-base/grid-print.md @@ -9,6 +9,17 @@ tags: res_type: kb --- +## Environment + + + + + + + + +
ProductGrid for Blazor
+ ## Description diff --git a/knowledge-base/grid-remote-validation.md b/knowledge-base/grid-remote-validation.md index 8469c62ca..030d42333 100644 --- a/knowledge-base/grid-remote-validation.md +++ b/knowledge-base/grid-remote-validation.md @@ -9,6 +9,17 @@ tags: res_type: kb --- +## Environment + + + + + + + + +
ProductGrid for Blazor
+ ## Description diff --git a/knowledge-base/grid-right-align-header-cells.md b/knowledge-base/grid-right-align-header-cells.md index 28011e0f8..34468cead 100644 --- a/knowledge-base/grid-right-align-header-cells.md +++ b/knowledge-base/grid-right-align-header-cells.md @@ -10,6 +10,20 @@ ticketid: res_type: kb --- +## Environment + + + + + + + + +
Product + Grid for Blazor,
+ TreeList for Blazor +
+ ## Description I have a Grid that displays numeric data. The numbers in the data cells are aligned to the right with the `TextAlign` column attribute. How do I align the text content of Grid header cells to the right? diff --git a/knowledge-base/grid-save-state-in-webassembly.md b/knowledge-base/grid-save-state-in-webassembly.md index 72f1d520a..c53896682 100644 --- a/knowledge-base/grid-save-state-in-webassembly.md +++ b/knowledge-base/grid-save-state-in-webassembly.md @@ -8,6 +8,17 @@ tags: grid,state,wasm,webassembly,save res_type: kb --- +## Environment + + + + + + + + +
ProductGrid for Blazor
+ ## Description diff --git a/knowledge-base/grid-three-level-hierarchy.md b/knowledge-base/grid-three-level-hierarchy.md index e2aed6157..3dcd5fd50 100644 --- a/knowledge-base/grid-three-level-hierarchy.md +++ b/knowledge-base/grid-three-level-hierarchy.md @@ -10,6 +10,17 @@ ticketid: 1432878 res_type: kb --- +## Environment + + + + + + + + +
ProductGrid for Blazor
+ ## Description I'm trying to see more than 1 level of hierarchy in my grid but i don't know how i would to such a thing with the current infrastructure. diff --git a/knowledge-base/grid-update-from-0-5-to-1-0.md b/knowledge-base/grid-update-from-0-5-to-1-0.md index d184d4ded..f9985ba02 100644 --- a/knowledge-base/grid-update-from-0-5-to-1-0.md +++ b/knowledge-base/grid-update-from-0-5-to-1-0.md @@ -10,6 +10,17 @@ ticketid: res_type: kb --- +## Environment + + + + + + + + +
ProductGrid for Blazor
+ There are some changes in the events and API of the Telerik Blazor Grid component between the 0.5.0 pre-release version and the 1.0.0 official version. We made them in order to provide better functionality, consistency and semantics of the way the component works. Here is a list of the changes: diff --git a/knowledge-base/icon-new-names.md b/knowledge-base/icon-new-names.md index 516a38754..c9343f6d1 100644 --- a/knowledge-base/icon-new-names.md +++ b/knowledge-base/icon-new-names.md @@ -15,12 +15,12 @@ res_type: kb - - + + - - + +
Product Version4.xProductUI for Blazor
ProductProgress® Telerik® UI for BlazorProduct Version4.x
diff --git a/knowledge-base/inputs-align-text-right.md b/knowledge-base/inputs-align-text-right.md index 61daaa2bf..9eb128dbf 100644 --- a/knowledge-base/inputs-align-text-right.md +++ b/knowledge-base/inputs-align-text-right.md @@ -11,16 +11,24 @@ res_type: kb --- ## Environment + - - - - - - + + + + + +
ProductTextBox for Blazor, NumericTextBox for Blazor, other inputs/form elements
Product + AutoComplete for Blazor,
+ ComboBox for Blazor
+ DatePicker for Blazor
+ DateTimePicker for Blazor
+ NumericTextBox for Blazor,
+ TextBox for Blazor,
+ TimePicker for Blazor +
- ## Description How to align the text to the right or center in my inputs (such as textbox and numeric textbox). diff --git a/knowledge-base/inputs-clear-selection-value.md b/knowledge-base/inputs-clear-selection-value.md index 7cc3c897c..88a67e9ed 100644 --- a/knowledge-base/inputs-clear-selection-value.md +++ b/knowledge-base/inputs-clear-selection-value.md @@ -11,13 +11,23 @@ res_type: kb --- ## Environment + - - - - - - + + + + + +
ProductComboBox for Blazor, DropDownList for Blazor, Textbox for Blazor, DatePicker for Blazor, all other inputs and date/time pickers for Blazor
Product + AutoComplete for Blazor,
+ ComboBox for Blazor
+ DatePicker for Blazor
+ DateTimePicker for Blazor
+ DropDownList for Blazor
+ NumericTextBox for Blazor,
+ TextBox for Blazor,
+ TimePicker for Blazor +
diff --git a/knowledge-base/inputs-floating-label.md b/knowledge-base/inputs-floating-label.md index 9614c5c55..e07adb4ec 100644 --- a/knowledge-base/inputs-floating-label.md +++ b/knowledge-base/inputs-floating-label.md @@ -10,17 +10,23 @@ res_type: kb --- ## Environment + - + diff --git a/knowledge-base/inputs-handle-keyboard-events.md b/knowledge-base/inputs-handle-keyboard-events.md index e27c62b52..78700a798 100644 --- a/knowledge-base/inputs-handle-keyboard-events.md +++ b/knowledge-base/inputs-handle-keyboard-events.md @@ -11,13 +11,24 @@ res_type: kb --- ## Environment +
Product - TextBox for Blazor,
+ AutoComplete for Blazor,
+ ComboBox for Blazor
+ DatePicker for Blazor
+ DateTimePicker for Blazor
+ DropDownList for Blazor
MaskedTextBox for Blazor,
- NumericTextBox for Blazor,
- other inputs/form elements + NumericTextBox for Blazor,
+ TextBox for Blazor,
+ TimePicker for Blazor
Version 3.0.0 and 3.0.1
- - - - - - + + + + + +
ProductTextBox for Blazor, NumericTextBox for Blazor, other inputs/form elements such as the Editor
Product + AutoComplete for Blazor,
+ ComboBox for Blazor
+ DatePicker for Blazor
+ DateTimePicker for Blazor
+ DropDownList for Blazor
+ MaskedTextBox for Blazor,
+ NumericTextBox for Blazor,
+ TextBox for Blazor,
+ TimePicker for Blazor +
diff --git a/knowledge-base/inputs-open-programmatically.md b/knowledge-base/inputs-open-programmatically.md index 98e5e6d38..b2a1e6cca 100644 --- a/knowledge-base/inputs-open-programmatically.md +++ b/knowledge-base/inputs-open-programmatically.md @@ -13,23 +13,23 @@ res_type: kb ## Environment - - - - + + + +
Product Version2.25 and later
Product - AutoComplete
- ComboBox
- DatePicker
- DateTimePicker
- DropDownList
- MultiColumnComboBox
- MultiSelect
- TimePicker
+ AutoComplete for Blazor,
+ ComboBox for Blazor,
+ DatePicker for Blazor,
+ DateTimePicker for Blazor,
+ DropDownList for Blazor,
+ MultiColumnComboBox for Blazor,
+ MultiSelect for Blazor,
+ TimePicker for Blazor
Product Version2.25 and later
diff --git a/knowledge-base/inputs-set-focus.md b/knowledge-base/inputs-set-focus.md index c76af24a1..12a055f9e 100644 --- a/knowledge-base/inputs-set-focus.md +++ b/knowledge-base/inputs-set-focus.md @@ -16,7 +16,16 @@ res_type: kb Product - All textbox, input and button components in Telerik UI for Blazor + + AutoComplete for Blazor,
+ ComboBox for Blazor,
+ DatePicker for Blazor,
+ DateTimePicker for Blazor,
+ DropDownList for Blazor,
+ MultiColumnComboBox for Blazor,
+ MultiSelect for Blazor,
+ TimePicker for Blazor + Product Version diff --git a/knowledge-base/inputs-validation-child-component.md b/knowledge-base/inputs-validation-child-component.md index 573208a3b..26c568b87 100644 --- a/knowledge-base/inputs-validation-child-component.md +++ b/knowledge-base/inputs-validation-child-component.md @@ -11,13 +11,23 @@ res_type: kb --- ## Environment + - - - - - - + + + + + +
ProductComboBox for Blazor, DropDownList for Blazor, AutoComplete for Blazor, other inputs/form elements
Product + AutoComplete for Blazor,
+ ComboBox for Blazor,
+ DatePicker for Blazor,
+ DateTimePicker for Blazor,
+ DropDownList for Blazor,
+ MultiColumnComboBox for Blazor,
+ MultiSelect for Blazor,
+ TimePicker for Blazor +
diff --git a/knowledge-base/jquery-kendo-in-blazor.md b/knowledge-base/jquery-kendo-in-blazor.md index a39397183..0390f68e1 100644 --- a/knowledge-base/jquery-kendo-in-blazor.md +++ b/knowledge-base/jquery-kendo-in-blazor.md @@ -10,13 +10,25 @@ ticketid: 1422791 res_type: kb --- +## Environment + + + + + + + + +
ProductUI for Blazor
## Description + While migrating an application to Blazor, you may not have time to implement all components, or there may yet be no native Blazor counterpart in the Telerik UI for Blazor suite. In such cases you may want to keep using jQuery widgets from Kendo UI in your Blazor project. We advise that you consider using only native Blazor components like the UI for Blazor suite, because this is how the framework is designed to operate. Widgets based on jQuery (such as Kendo UI) rely on direct DOM manipulation and this is something Blazor controls instead of you. ## Solution + One approach may be to [use Blazor components in an ASP.NET Core 3 application](https://www.telerik.com/blogs/integrating-blazor-components-with-asp-net-core-views). Whether this is feasible depends on your project path and if/how you are migrating from an older project. You can read more details about this in the [Telerik Blazor in ASP.NET Web Application]({%slug telerik-blazor-in-asp-net-app%}) article. Should you decide to use jQuery widgets from the Kendo UI suite, here are the things to keep in mind: @@ -33,6 +45,3 @@ Should you decide to use jQuery widgets from the Kendo UI suite, here are the th The project references a commercial version of UI for Blazor. If you only have a trial license, replace the reference to the NuGet package and to the JS Interop file [accordingly]({%slug getting-started/what-you-need%}). >note Such an integration is not supported by Telerik. - - - diff --git a/knowledge-base/keynotfoundexception-inputelementvalue.md b/knowledge-base/keynotfoundexception-inputelementvalue.md index 5d8b139b9..0549171ed 100644 --- a/knowledge-base/keynotfoundexception-inputelementvalue.md +++ b/knowledge-base/keynotfoundexception-inputelementvalue.md @@ -16,7 +16,7 @@ res_type: kb Product - Telerik UI for Blazor + UI for Blazor diff --git a/knowledge-base/listbox-filtering.md b/knowledge-base/listbox-filtering.md index ca2d78d7e..283cabb16 100644 --- a/knowledge-base/listbox-filtering.md +++ b/knowledge-base/listbox-filtering.md @@ -15,12 +15,12 @@ res_type: kb - - + + - - + +
Product Version4.6.0 and aboveProductListBox for Blazor
ProductProgress® Telerik® UI for BlazorProduct Version4.6.0 and above
diff --git a/knowledge-base/listview-searchbox.md b/knowledge-base/listview-searchbox.md index dd1ee1b30..3bd3f4522 100644 --- a/knowledge-base/listview-searchbox.md +++ b/knowledge-base/listview-searchbox.md @@ -10,6 +10,17 @@ ticketid: 1536554 res_type: kb --- +## Environment + + + + + + + + +
ProductListView for Blazor
+ ## Description How to implement a ListView seach box, similar to the [SearchBox in the Blazor Grid](https://demos.telerik.com/blazor-ui/grid/searchbox)? I would like to use a single input to search and filter in all data fields of the ListView data. diff --git a/knowledge-base/listview-validation.md b/knowledge-base/listview-validation.md index 2419eef34..51ba79d73 100644 --- a/knowledge-base/listview-validation.md +++ b/knowledge-base/listview-validation.md @@ -9,6 +9,17 @@ tags: res_type: kb --- +## Environment + + + + + + + + +
ProductListView for Blazor
+ ## Description diff --git a/knowledge-base/loading-sign-client-app.md b/knowledge-base/loading-sign-client-app.md index 1aa98404a..d4cca085e 100644 --- a/knowledge-base/loading-sign-client-app.md +++ b/knowledge-base/loading-sign-client-app.md @@ -10,6 +10,20 @@ ticketid: 1406319 res_type: kb --- +## Environment + + + + + + + + +
Product + Loader for Blazor,
+ LoaderContainer for Blazor,
+
+ ## Description While the client-side Blazor app is loading and spinning up, you may want to show a beautiful loading message to your users so they know something is happening. @@ -18,77 +32,4 @@ While the client-side Blazor app is loading and spinning up, you may want to sho ## Solution -To have a loading sign in a Blazor app, you must use HTML and CSS and put the desired content inside the `app` element. The Blazor framework will remove its contents and replace them with the actual application once it has fully loaded. - -The loading message cannot be a Blazor component, because it is shown before the actual SPA has initialized in the browser. - ->caption A sample collection of HTML and CSS that provides a loading message for a client-side Blazor app. Place this in your `wwwroot/index.html` file. - -```` - - - - - - - -
-

Telerik Blazor Loading Template

-
You can easily customize this loading sign to match your needs.
-
-
-
-
-
-
- - - -```` - ->tip You can put this CSS in your existing stylesheet. You can also customize the code, contents and appearance so they match your application design. You can even write it up using a pre-processor like SASS and take colors and variales from your main styles. - +Use the [Loader]({%slug loader-overview%}) or [LoaderContainer]({%slug loadercontainer-overview%}) component. diff --git a/knowledge-base/multiselect-add-new-item.md b/knowledge-base/multiselect-add-new-item.md index 73eb772bd..6ed143d89 100644 --- a/knowledge-base/multiselect-add-new-item.md +++ b/knowledge-base/multiselect-add-new-item.md @@ -10,6 +10,17 @@ ticketid: 1470173, 1496248, 1501053, 1534242, 1554788 res_type: kb --- +## Environment + + + + + + + + +
ProductMultiSelect for Blazor
+ ## Description diff --git a/knowledge-base/nest-render-fragment.md b/knowledge-base/nest-render-fragment.md index aa981103e..90c4fdefc 100644 --- a/knowledge-base/nest-render-fragment.md +++ b/knowledge-base/nest-render-fragment.md @@ -17,7 +17,7 @@ res_type: kb Product - UI for Blazor - all components that expose `RenderFragment`s (templates) with `context` + UI for Blazor diff --git a/knowledge-base/pdfviewer-sign-pdfs.md b/knowledge-base/pdfviewer-sign-pdfs.md index fb49d863f..a8499bbac 100644 --- a/knowledge-base/pdfviewer-sign-pdfs.md +++ b/knowledge-base/pdfviewer-sign-pdfs.md @@ -14,7 +14,7 @@ res_type: kb Product - RadPdfProcessing for Document Processing,
PdfViewer for Blazor + PdfViewer for Blazor diff --git a/knowledge-base/radiogroup-like-buttongroup.md b/knowledge-base/radiogroup-like-buttongroup.md index 1ed7144c0..900cf98bc 100644 --- a/knowledge-base/radiogroup-like-buttongroup.md +++ b/knowledge-base/radiogroup-like-buttongroup.md @@ -10,6 +10,17 @@ ticketid: 1547117 res_type: kb --- +## Environment + + + + + + + + +
ProductRadioGroup for Blazor
+ ## Description How to implement RadioGroup behavior, but style the label and radio input pairs like toggle buttons in a ButtonGroup? Similar to a radio group, only one button should be selected at a time. diff --git a/knowledge-base/requires-valueexpression.md b/knowledge-base/requires-valueexpression.md index 7d137f529..8aa09ca77 100644 --- a/knowledge-base/requires-valueexpression.md +++ b/knowledge-base/requires-valueexpression.md @@ -10,14 +10,27 @@ ticketid: 1451865 res_type: kb --- +## Environment + + + + + + + + +
ProductUI for Blazor
## Description + I have a Telerik input component (such as a texbox, or an autocomplete, or a dropdown) working fine on a component in my app. When I use this component elsewhere (like in a modal in a form), it starts throwing errors. ## Error Message + >warning Error SystemInvalidOperationException: Telerik.Blazor.Components.SomeComponent requires a value for 'ValueExpression'. ValueExpression is provided automatically when using 'bind-Value' ## Possible Cause + The most common reason for this error is a combination of the following: * The component does not use `@bind-Value="@myModel.MyField"`, but simply `Value="@myModel.MyField"`, or its `Value` is not even specified @@ -26,6 +39,7 @@ The most common reason for this error is a combination of the following: This error comes from the framework and applies to generic inputs as well, not only the Telerik components. At the time of writing, I was not able to find an official resource for the `ValueExpression` feature. The closest is the example for a `ValidationMessage` at [https://docs.microsoft.com/en-us/aspnet/core/blazor/forms-validation?view=aspnetcore-3.1#validation-summary-and-validation-message-components](https://docs.microsoft.com/en-us/aspnet/core/blazor/forms-validation?view=aspnetcore-3.1#validation-summary-and-validation-message-components). Hopefully, the validation documentation in MSDN will be updated to include information about this parameter in the future. ## Solution + There are three common ways to resolve such an error: * Use two-way binding - the `@bind-Value` syntax if you can. If you wrap our components inside a custom one for your application you need to implement both two-way data binding and `ValueExpression`, read this article for more information: [Validate a Telerik component as child control and apply invalid border ]({%slug inputs-kb-validate-child-component%}). If you need to handle the `ValueChanged` even to implement logic, see this article: [How to handle the ValueChanged event and use forms and validation]({%slug value-changed-validation-model%}). It shows how to use the `ValueExpression` parameter and also hints at using the Telerik-specific `OnChange` event that does not prevent two-way binding. @@ -43,4 +57,3 @@ There are three common ways to resolve such an error: * Move the `EditForm` inside the component that hosts all the input. This will make it throw the exception immediately, not only when used in a particular case. This will let you evaluate how to solve the situation according to the previous points, and can let you expose only relevant events/logic/parameters to its parents, instead of expecting them to provide a form and validator. * If you do not define a `Value` at all, consider whether such an input needs to be in the form in the first place (for example, putting an `` in an `EditForm` without defining the value and binding settings will throw the same error. - diff --git a/knowledge-base/root-component-null-reference.md b/knowledge-base/root-component-null-reference.md index 5f545f172..3a51f3a3a 100644 --- a/knowledge-base/root-component-null-reference.md +++ b/knowledge-base/root-component-null-reference.md @@ -10,11 +10,22 @@ ticketid: 1475025 res_type: kb --- +## Environment + + + + + + + + +
ProductUI for Blazor
+ + ## Description When running a Telerik Blazor application I receive an error similar to the following: - >warning `System.NullReferenceException`
> `at Telerik.Blazor.Components.RootComponent.TelerikRootComponentFragment.Dispose()` > `at Microsoft.AspNetCore.Components.Rendering.ComponentState.Dispose()` @@ -24,12 +35,11 @@ When running a Telerik Blazor application I receive an error similar to the foll >warning `Object reference not set to an instance of an object.` > `at Telerik.Blazor.Components.TelerikRootComponentFragmentBase.OnInitAsync()` - ## Possible Cause -The origin of this behavior is a missing `` from the `MainLayout.razor` file in the project. +The origin of this behavior is a missing [``]({%slug rootcomponent-overview%}) from the `MainLayout.razor` file in the project. You can reproduce this with the following snippet: @@ -82,4 +92,4 @@ Wrap the entire content of the `MainLayout.razor` file inside the ` -```` \ No newline at end of file +```` diff --git a/knowledge-base/scheduler-appointment-context-menu.md b/knowledge-base/scheduler-appointment-context-menu.md index 95d960e6e..5ff855a0e 100644 --- a/knowledge-base/scheduler-appointment-context-menu.md +++ b/knowledge-base/scheduler-appointment-context-menu.md @@ -9,6 +9,20 @@ tags: res_type: kb --- +## Environment + + + + + + + + +
Product + ContextMenu for Blazor,
+ Scheduler for Blazor +
+ ## Description diff --git a/knowledge-base/scheduler-custom-appointment-tooltips.md b/knowledge-base/scheduler-custom-appointment-tooltips.md index 274193b0f..09d15667b 100644 --- a/knowledge-base/scheduler-custom-appointment-tooltips.md +++ b/knowledge-base/scheduler-custom-appointment-tooltips.md @@ -9,6 +9,16 @@ tags: res_type: kb --- +## Environment + + + + + + + + +
ProductScheduler for Blazor
## Description diff --git a/knowledge-base/scheduler-custom-edit-form.md b/knowledge-base/scheduler-custom-edit-form.md index 798aeb3ae..ae627d01c 100644 --- a/knowledge-base/scheduler-custom-edit-form.md +++ b/knowledge-base/scheduler-custom-edit-form.md @@ -9,6 +9,17 @@ tags: res_type: kb --- +## Environment + + + + + + + + +
ProductScheduler for Blazor
+ ## Description diff --git a/knowledge-base/static-asset-conflicting-root-path.md b/knowledge-base/static-asset-conflicting-root-path.md index a14be1639..d96839090 100644 --- a/knowledge-base/static-asset-conflicting-root-path.md +++ b/knowledge-base/static-asset-conflicting-root-path.md @@ -10,6 +10,17 @@ ticketid: 1497405 res_type: kb --- +## Environment + + + + + + + + +
ProductUI for Blazor
+ ## Description @@ -17,8 +28,6 @@ res_type: kb >caution **The static web asset** 'C:\Users\____\.nuget\packages\telerik.ui.for.blazor\2.20.0\build\..\staticwebassets\css\kendo-theme-bootstrap\all.css' **has a conflicting web root path** '/wwwroot/_content/Telerik.UI.for.Blazor/css/kendo-theme-bootstrap/all.css' **with the project file 'wwwroot\_content\Telerik.UI.for.Blazor\css\kendo-theme-bootstrap\all.css'**. C:\Program Files\dotnet\sdk\5.0.100\Sdks\Microsoft.NET.Sdk.Razor\build\netstandard2.0\Microsoft.NET.Sdk.Razor.StaticWebAssets.targets 208 - - I cleaned the project, I also cleared the nuget packages cache but I am still getting these errors. @@ -29,11 +38,8 @@ The issue is that the project has the `_content` folder in the `wwwroot` folder ![Screenshot of duplicate _content folder in the project that should not be there](images/duplicate-content-folder-in-project.png) - - ## Solution Delete the `_content` folder from your `wwwroot` folder. The framework creates that folder build-time, and copies the static assets from the various packages you use to that folder automatically. So, you should not create and use it in your own project. - diff --git a/knowledge-base/switch-strecth-expand-resize.md b/knowledge-base/switch-strecth-expand-resize.md index c9b4ba977..62ee43d4a 100644 --- a/knowledge-base/switch-strecth-expand-resize.md +++ b/knowledge-base/switch-strecth-expand-resize.md @@ -10,6 +10,17 @@ ticketid: 1539464 res_type: kb --- +## Environment + + + + + + + + +
ProductSwitch for Blazor
+ ## Description How do I stretch the Switch horizontally, in order to see the whole dynamic on/off text labels? The goal is to expand the component and fit the complete text automatically inside the TelerikSwitch dynamically at runtime. Setting the width to a fixed value is not a viable solution. diff --git a/knowledge-base/tabstrip-dynamic-tabs.md b/knowledge-base/tabstrip-dynamic-tabs.md index ccfae1ab5..b2ae2f693 100644 --- a/knowledge-base/tabstrip-dynamic-tabs.md +++ b/knowledge-base/tabstrip-dynamic-tabs.md @@ -9,6 +9,17 @@ tags: res_type: kb --- +## Environment + + + + + + + + +
ProductTabStrip for Blazor
+ ## Description diff --git a/knowledge-base/tooltip-in-grid.md b/knowledge-base/tooltip-in-grid.md index 9410ffddb..55f9ceb8e 100644 --- a/knowledge-base/tooltip-in-grid.md +++ b/knowledge-base/tooltip-in-grid.md @@ -8,6 +8,20 @@ tags: telerik, blazor, grid, tooltip res_type: kb --- +## Environment + + + + + + + + +
Product + Grid for Blazor,
+ Tooltip for Blazor +
+ ## Description diff --git a/knowledge-base/typescript-exports-error.md b/knowledge-base/typescript-exports-error.md index d5fd0dc4a..7cbf2afb9 100644 --- a/knowledge-base/typescript-exports-error.md +++ b/knowledge-base/typescript-exports-error.md @@ -10,6 +10,18 @@ ticketid: 1483634 res_type: kb --- +## Environment + + + + + + + + +
ProductUI for Blazor
+ + ## Description Using TypeScript to write (and generate) JavaScript code used in the Blazor application can cause two types of errors - one where the default compiled result throws exceptions, an if a common workaround for that is added - it can lead to issues with the Telerik JS Interop file. diff --git a/knowledge-base/upload-form-validation.md b/knowledge-base/upload-form-validation.md index 509c03f3e..b4e0d9ce2 100644 --- a/knowledge-base/upload-form-validation.md +++ b/knowledge-base/upload-form-validation.md @@ -9,6 +9,20 @@ tags: res_type: kb --- +## Environment + + + + + + + + +
Product + Form for Blazor,
+ Upload for Blazor +
+ ## Description diff --git a/knowledge-base/value-changed-validation-model.md b/knowledge-base/value-changed-validation-model.md index a20f3650d..6e3f141bd 100644 --- a/knowledge-base/value-changed-validation-model.md +++ b/knowledge-base/value-changed-validation-model.md @@ -10,12 +10,23 @@ res_type: kb --- ## Environment + - - - - + + + +
ProductThe inputs from UI for Blazor
Product + AutoComplete for Blazor,
+ ComboBox for Blazor,
+ DatePicker for Blazor,
+ DateTimePicker for Blazor,
+ DropDownList for Blazor,
+ Form for Blazor,
+ MultiColumnComboBox for Blazor,
+ MultiSelect for Blazor,
+ TimePicker for Blazor +
diff --git a/knowledge-base/wasm-magic-word.md b/knowledge-base/wasm-magic-word.md index f4e8a6e56..180788418 100644 --- a/knowledge-base/wasm-magic-word.md +++ b/knowledge-base/wasm-magic-word.md @@ -11,28 +11,34 @@ res_type: kb --- ## Environment + - - - - - - - - - - + + + + + + + + + + + + + +
Hostingcloudflare.com integration with smarterasp.net, may affect others
EnvironmentWASM Blazor app
ProductUI for Blazor
Application typeWebAssembly
Hostingcloudflare.com integration with smarterasp.net, may affect others
## Description + Publishing a client-side (WASM) Blazor app may fail with messages similar to the error below. A particular environment is an ASP.NET Core hosted Blazor project hosted on smarterAsp.net with the automatic config which enabled caching and compacting with cloudflare.com. - ## Error Message + * WASM: wasm streaming compile failed: Failed to execute 'compile' on 'WebAssembly': Incorrect response MIME type. Expected 'application/wasm' * WASM: failed to asynchronously prepare wasm: CompileError: WebAssembly.instantiate(): expected magic word 00 61 73 6d, found ef bb bf 3c @+0 * CompileError: WebAssembly.instantiate(): expected magic word 00 61 73 6d, found ef bb bf 3c @+0 @@ -40,12 +46,14 @@ A particular environment is an ASP.NET Core hosted Blazor project hosted on smar ![failed to compile expected magic word](images/wasm-fail-to-compile-magic-word.png) ## Possible Cause + The errors indicate the following issues: * The MIME type for the `wasm` files is wrong - it must be `application/wasm` but the hosting environment used the wrong one * The wasm file is broken (for example, archived, compressed twice or otherwise truncated/modified). ## Solution + The general solution is to make sure that the application files are not tampered with and that you have the correct server settings as per Microsoft's documentation: [https://docs.microsoft.com/en-us/aspnet/core/host-and-deploy/blazor/webassembly?view=aspnetcore-3.1](https://docs.microsoft.com/en-us/aspnet/core/host-and-deploy/blazor/webassembly?view=aspnetcore-3.1) In the particular smarterasp.net hosting case, disabling the cloudflare integration resolved the issue. diff --git a/knowledge-base/window-expand-on-drag.md b/knowledge-base/window-expand-on-drag.md index 0399e0f7a..5d5db1fd0 100644 --- a/knowledge-base/window-expand-on-drag.md +++ b/knowledge-base/window-expand-on-drag.md @@ -10,6 +10,17 @@ ticketid: 1522796, 1524154 res_type: kb --- +## Environment + + + + + + + + +
ProductWindow for Blazor
+ ## Description I have a Window with no fixed width and the `Draggable` property is set to true. The Window contains a Grid. Initially the Window is rendered to be as wide as its content. diff --git a/knowledge-base/window-keep-content-when-closed.md b/knowledge-base/window-keep-content-when-closed.md index e95bc38d7..6d1b7455d 100644 --- a/knowledge-base/window-keep-content-when-closed.md +++ b/knowledge-base/window-keep-content-when-closed.md @@ -12,15 +12,17 @@ res_type: kb ## Environment - - - - - - + + + + + +
ProductProgress® Telerik® UI for Blazor Window
Progress® Telerik® UI for Blazor Dialog
Product + Dialog for Blazor,
+ Window for Blazor +
- ## Description When the `Visible` parameter is set to `false`, the Window content is disposed from the DOM. How can I keep the content in the DOM when the user closes the Window? How can I preserve the Window content upon closing? Is it possible to close or hide the Window with CSS? diff --git a/knowledge-base/wizard-skip-step.md b/knowledge-base/wizard-skip-step.md index ee3d11574..9cddd2675 100644 --- a/knowledge-base/wizard-skip-step.md +++ b/knowledge-base/wizard-skip-step.md @@ -10,6 +10,17 @@ ticketid: 1541661, 1544088 res_type: kb --- +## Environment + + + + + + + + +
ProductWizard for Blazor
+ ## Description How to skip one or more Wizard steps, based on the results of another step?