{"id":2459,"date":"2024-08-08T05:16:00","date_gmt":"2024-08-08T05:16:00","guid":{"rendered":"https:\/\/staging.infragistics.com\/blogs\/?p=2459"},"modified":"2025-02-26T13:48:13","modified_gmt":"2025-02-26T13:48:13","slug":"ignite-ui-for-blazor-24-1","status":"publish","type":"post","link":"https:\/\/www.infragistics.com\/blogs\/ignite-ui-for-blazor-24-1","title":{"rendered":"What&#39;s New: Ignite UI for Blazor 24.1 Release"},"content":{"rendered":"\n<p><span style=\"font-family: inherit; font-size: inherit;\">Ignite UI for Blazor continues to deliver robust, high-performance solutions for developers looking to create modern, responsive web applications. Over the past few months, we&#8217;ve focused on continuous improvements to provide the tools and capabilities needed for building better UX and UIs. The latest enhancements include support for .NET 8.0, a Chart Highlight Filter, State Persistence, and several new components.<\/span><\/p>\n\n\n\n<p><span style=\"font-family: inherit; font-size: inherit;\">Let\u2019s take a closer look at all that\u2019s new.<\/span><\/p>\n\n\n\n<h2 class=\"wp-block-heading\" class=\"wp-block-heading\" id=\"version-23-2-97\">Version 23.2.97<\/h2>\n\n\n\n<h3 class=\"wp-block-heading\"><a href=\"\/products\/ignite-ui-blazor\/blazor\/components\/general-changelog-dv-blazor#23297-december-2023\">Changelog 23.2.97<\/a><\/h3>\n\n\n\n<h3 class=\"wp-block-heading\">State Persistence feature for Grid component<\/h3>\n\n\n\n<p>The Ignite UI for Blazor&nbsp;<a title=\"Documentation for State Persistence feature \" href=\"\/products\/ignite-ui-blazor\/blazor\/components\/grids\/grid\/state-persistence\">State Persistence<\/a>&nbsp;in&nbsp;<a title=\"Documentation for Blazor Data Grid\" href=\"\/products\/ignite-ui-blazor\/blazor\/components\/grids\/data-grid\">Blazor Data Grid<\/a>,&nbsp;<a title=\"Documentation for Blazor Tree Grid\" href=\"\/products\/ignite-ui-blazor\/blazor\/components\/grids\/tree-grid\/overview\">Blazor Tree Grid<\/a>&nbsp;and&nbsp;<a title=\"Documentation for Blazor Hierarchical Grid\" href=\"\/products\/ignite-ui-blazor\/blazor\/components\/grids\/hierarchical-grid\/overview\">Blazor Hierarchical Grid<\/a>&nbsp;allows developers to easily save and restore the grid state. When the&nbsp;<a class=\"external-link-parent\" href=\"\/blazor\/docs\/api\/api\/IgniteUI.Blazor.Controls.IgbGridState.html\">IgbGridState<\/a>&nbsp;is applied on the Blazor&nbsp;<a class=\"external-link-parent\" href=\"\/blazor\/docs\/api\/api\/IgniteUI.Blazor.Controls.IgbGrid.html\">IgbGrid<\/a>, it exposes the&nbsp;<code>GetState<\/code>,&nbsp;<code>GetStateAsString<\/code>,&nbsp;<code>ApplyState<\/code>&nbsp;and&nbsp;<code>ApplyStateFromString<\/code>&nbsp;methods that developers can use to achieve state persistence in any scenario. The supported features are:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><a title=\"Documentation for Data Grid sorting feature\" href=\"\/products\/ignite-ui-blazor\/blazor\/components\/grids\/grid\/sorting\">Sorting<\/a><\/li>\n\n\n\n<li><a title=\"Documentation for Data Grid filtering feature\" href=\"\/products\/ignite-ui-blazor\/blazor\/components\/grids\/grid\/filtering\">Filtering<\/a><\/li>\n\n\n\n<li><a title=\"Documentation for Data Grid Advanced filtering feature\" href=\"\/products\/ignite-ui-blazor\/blazor\/components\/grids\/grid\/advanced-filtering\">Advanced Filtering<\/a><\/li>\n\n\n\n<li><a title=\"Documentation for Data Grid paging feature\" href=\"\/products\/ignite-ui-blazor\/blazor\/components\/grids\/grid\/paging\">Paging<\/a><\/li>\n\n\n\n<li><a title=\"Documentation for Data Grid Cell Selection feature\" href=\"\/products\/ignite-ui-blazor\/blazor\/components\/grids\/grid\/cell-selection\">Cell Selection<\/a><\/li>\n\n\n\n<li><a title=\"Documentation for Data Grid Row Selection feature\" href=\"\/products\/ignite-ui-blazor\/blazor\/components\/grids\/grid\/row-selection\">Row Selection<\/a><\/li>\n\n\n\n<li><a title=\"Documentation for Data Grid Column Selection feature\" href=\"\/products\/ignite-ui-blazor\/blazor\/components\/grids\/grid\/column-selection\">Column Selection<\/a><\/li>\n\n\n\n<li><a title=\"Documentation for Data Grid Row Pinning feature\" href=\"\/products\/ignite-ui-blazor\/blazor\/components\/grids\/grid\/row-pinning\">Row Pinning<\/a><\/li>\n\n\n\n<li>Expansion<\/li>\n\n\n\n<li><a title=\"Documentation for Data Grid Group By feature\" href=\"\/products\/ignite-ui-blazor\/blazor\/components\/grids\/grid\/groupby\">Group By<\/a><\/li>\n\n\n\n<li>Columns\n<ul class=\"wp-block-list\">\n<li><a title=\"Documentation for Data Grid Multi-Column Headers feature\" href=\"\/products\/ignite-ui-blazor\/blazor\/components\/grids\/grid\/multi-column-headers\">Multi column headers<\/a><\/li>\n\n\n\n<li>Columns order<\/li>\n\n\n\n<li>Column properties defined by the `IColumnState` interface.<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"http:\/\/static.infragistics.com\/marketing\/Blogs\/Migration\/00\/00\/00\/09\/43\/Grid-State-Persistence.gif\" alt=\"Example of Blazor Grid State Persistence\" title=\"Example of Blazor Grid State Persistence\"\/><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\">Charts Toolbar<\/h3>\n\n\n\n<p>The <a href=\"\/products\/ignite-ui-blazor\/blazor\/components\/menus\/toolbar\">Blazor Toolbar component<\/a> is a companion container for UI operations to be used primarily with our charting components. The toolbar will dynamically update with a preset of properties and tool items when linked to our&nbsp;<a class=\"external-link-parent\" href=\"\/blazor\/docs\/api\/api\/IgniteUI.Blazor.Controls.IgbDataChart.html\"><code class=\"external-link\">IgbDataChart<\/code><\/a>&nbsp;or&nbsp;<a class=\"external-link-parent\" href=\"\/blazor\/docs\/api\/api\/IgniteUI.Blazor.Controls.IgbCategoryChart.html\"><code class=\"external-link\">IgbCategoryChart<\/code><\/a>&nbsp;components. You&#8217;ll be able to create custom tools for your project allowing end users to provide changes, offering an endless amount of customization.<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"http:\/\/static.infragistics.com\/marketing\/Blogs\/Migration\/00\/00\/00\/09\/43\/8713.Toolbar-Menu-component.gif\" alt=\"Example of Blazor Charts Toolbar component\" title=\"Example of Blazor Charts Toolbar component\"\/><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\" class=\"wp-block-heading\" id=\"version-23-2-110\">Version 23.2.110<\/h2>\n\n\n\n<h3 class=\"wp-block-heading\"><a href=\"\/products\/ignite-ui-blazor\/blazor\/components\/general-changelog-dv-blazor#232110-january-2024\">Changelog 23.2.110<\/a><\/h3>\n\n\n\n<h3 class=\"wp-block-heading\"><a href=\"https:\/\/devblogs.microsoft.com\/dotnet\/announcing-dotnet-8\/\" rel=\"noopener\">Support for .NET 8.0<\/a><\/h3>\n\n\n\n<h3 class=\"wp-block-heading\">Chart Highlight filter feature<\/h3>\n\n\n\n<p>The&nbsp;<a title=\"Documentation for Ignite UI Chart components\" href=\"\/products\/ignite-ui-blazor\/blazor\/components\/charts\/chart-overview\">Ignite UI for Blazor Chart<\/a>&nbsp;components support a&nbsp;<a title=\"Documentation for Ignite UI for Blazor chart highlight feature\" href=\"\/products\/ignite-ui-blazor\/blazor\/components\/charts\/features\/chart-highlight-filter\">data highlighting overlay<\/a>&nbsp;that can enhance the visualization of the series plotted in those charts by allowing you to view a subset of the data plotted. When enabled, this will highlight a subset of data while showing the total set with a reduced opacity in the case of column and area series types, and a dashed line in the case of line series types. This can help you to visualize things like target values versus actual values with your data set. This feature is demonstrated in the following example:<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"http:\/\/static.infragistics.com\/marketing\/Blogs\/Migration\/00\/00\/00\/09\/43\/5141.Chart-Highlight-Filter.gif\" alt=\"Example of Blazor Charts Highlight filter feature\" title=\"Example of Blazor Charts Highlight filter feature\"\/><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\" class=\"wp-block-heading\" id=\"version-23-2-189\">Version 23.2.189<\/h2>\n\n\n\n<h3 class=\"wp-block-heading\"><a href=\"\/products\/ignite-ui-blazor\/blazor\/components\/general-changelog-dv-blazor#232189-march-2024\">Changelog 23.2.189<\/a><\/h3>\n\n\n\n<h3 class=\"wp-block-heading\">Hierarchical Grid component<\/h3>\n\n\n\n<p>The Ignite UI for Blazor <a title=\"Documentation for Blazor Hierarchical Data Grid\" href=\"\/products\/ignite-ui-blazor\/blazor\/components\/grids\/hierarchical-grid\/overview\">Hierarchical Data Grid<\/a> is used to display and manipulate hierarchical tabular data. Quickly bind your data with very little code or use a variety of events to customize different behaviors. This component provides a rich set of features like data selection, excel style filtering, sorting, paging, templating, column moving, column pinning, export to Excel and CSV, and more. The Hierarchical Grid builds upon the Flat Grid Component and extends its functionality by allowing the users to expand or collapse the rows of the parent grid, revealing corresponding child grids, when more detailed information is needed.<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"http:\/\/static.infragistics.com\/marketing\/Blogs\/Migration\/00\/00\/00\/09\/43\/7446.Hierachical-Grid-Component.gif\" alt=\"Example of Blazor Hierarchical Data Grid Component\" title=\"Example of Blazor Hierarchical Data Grid Component\"\/><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\"><a href=\"\/products\/ignite-ui-blazor\/blazor\/components\/inputs\/text-area\">Text Area component<\/a><\/h3>\n\n\n\n<p>The Ignite UI for Blazor Text Area represents a multi-line plain-text editing control, useful when you want to allow users to enter a sizeable amount of free-form text, for example, a comment on a review or feedback form.<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"http:\/\/static.infragistics.com\/marketing\/Blogs\/Migration\/00\/00\/00\/09\/43\/02254.Text-Area-Component.gif\" alt=\"Example of Blazor Text Area Component\" title=\"Example of Blazor Text Area Component\"\/><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\"><a href=\"\/products\/ignite-ui-blazor\/blazor\/components\/inputs\/button-group\">Button Group component<\/a><\/h3>\n\n\n\n<p>The Blazor Button Group component is used to organize&nbsp;<a class=\"external-link-parent\" href=\"\/blazor\/docs\/api\/api\/IgniteUI.Blazor.Controls.IgbToggleButton.html\"><code class=\"external-link\">IgbToggleButton<\/code><\/a>s into styled button groups with horizontal\/vertical alignment, single\/multiple selection, and toggling.<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"http:\/\/static.infragistics.com\/marketing\/Blogs\/Migration\/00\/00\/00\/09\/43\/5468.Button-Group-Component.gif\" alt=\"Example of Blazor Button Group Component\" title=\"Example of Blazor Button Group Component\"\/><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\" class=\"wp-block-heading\" id=\"to-wrap-it-all-up\">To Wrap It All Up&#8230;<\/h2>\n\n\n\n<p>Seamlessly crafted for compatibility, Ignite UI for Blazor is the library that enables you to leverage the power of the latest technologies and major releases. Committed to providing you with the best Blazor UI toolkit and related insights, our goal is to equip you with more know-how, new features, enhanced performance, and improved stability. Some of the enhancements were added thanks to the requests from users like yourself through our&nbsp;<a href=\"https:\/\/github.com\/IgniteUI\/igniteui-blazor\" rel=\"noopener\">Ignite UI for Blazor GitHub<\/a>&nbsp;repository. With this in mind, we are always open to suggestions and feedback \u2013 it makes us grow and better respond to your development needs.<\/p>\n\n\n\n<p>If you need more details, we encourage you to check out our:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><a href=\"https:\/\/discord.com\/channels\/836634487483269200\/836636796229386241\" rel=\"noopener\">Discord channel<\/a><\/li>\n\n\n\n<li><a href=\"https:\/\/github.com\/IgniteUI\/igniteui-blazor\/discussions\" rel=\"noopener\">GitHub discussions<\/a><\/li>\n\n\n\n<li><a href=\"https:\/\/github.com\/IgniteUI\/igniteui-blazor\/blob\/master\/ROADMAP.md\" rel=\"noopener\">Roadmap<\/a><\/li>\n\n\n\n<li><a href=\"https:\/\/www.youtube.com\/channel\/UCiPzmz_UyRqQE0Tboc7n66g\" target=\"_blank\" rel=\"noopener noreferrer\">YouTube channel<\/a><\/li>\n\n\n\n<li><a href=\"https:\/\/twitter.com\/infragistics\" target=\"_blank\" rel=\"noopener noreferrer\">Twitter<\/a><\/li>\n<\/ul>\n\n\n\n<h2 class=\"wp-block-heading\" class=\"wp-block-heading\" id=\"in-addition\">In Addition<\/h2>\n\n\n\n<p>Follow\u00a0<a href=\"https:\/\/medium.com\/ignite-ui\" rel=\"noopener\">Ignite UI on Medium\u202f<\/a>to stay up to date and learn about the latest Blazor-related projects we are working on. Give us a star on\u202fGitHub\u202fand help us continue improving our product by addressing any concerns, questions, or feature requests in the\u202fissues\u202fsection.<\/p>\n\n\n\n<figure class=\"wp-block-image\"><a href=\"\/products\/ignite-ui-blazor\/download\"><img decoding=\"async\" src=\"https:\/\/static.infragistics.com\/marketing\/Blog-in-content-ads\/Ignite-UI-Blazor\/ignite-ui-blazor-you-get-ad.gif\" alt=\"Ignite UI for Blazor\"\/><\/a><\/figure>\n\n\n\n<p><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Discover the latest enhancements in Ignite UI for Blazor, including .NET 8.0 support, new chart features, state persistence, and more components.<\/p>\n","protected":false},"author":20,"featured_media":2547,"comment_status":"publish","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[8,12],"tags":[],"class_list":["post-2459","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-blazor","category-product-updates"],"_links":{"self":[{"href":"https:\/\/www.infragistics.com\/blogs\/wp-json\/wp\/v2\/posts\/2459","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.infragistics.com\/blogs\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.infragistics.com\/blogs\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.infragistics.com\/blogs\/wp-json\/wp\/v2\/users\/20"}],"replies":[{"embeddable":true,"href":"https:\/\/www.infragistics.com\/blogs\/wp-json\/wp\/v2\/comments?post=2459"}],"version-history":[{"count":2,"href":"https:\/\/www.infragistics.com\/blogs\/wp-json\/wp\/v2\/posts\/2459\/revisions"}],"predecessor-version":[{"id":2558,"href":"https:\/\/www.infragistics.com\/blogs\/wp-json\/wp\/v2\/posts\/2459\/revisions\/2558"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.infragistics.com\/blogs\/wp-json\/wp\/v2\/media\/2547"}],"wp:attachment":[{"href":"https:\/\/www.infragistics.com\/blogs\/wp-json\/wp\/v2\/media?parent=2459"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.infragistics.com\/blogs\/wp-json\/wp\/v2\/categories?post=2459"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.infragistics.com\/blogs\/wp-json\/wp\/v2\/tags?post=2459"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}