-
-
Notifications
You must be signed in to change notification settings - Fork 534
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
DataGrid: Support Multiple items on DataGridSelectColumn (#5848)
* DataGridSelectColumn | Initial support for Multiple * Select Column | Multiple | Support value types * DataGridColumn | Virtual FormatDisplayValue | Add StringBuilder * Docs | Example for DataGridSelectColumn Multiple feature * Revert Dashboard and EmployeeData to original * Release notes * Docs.csproj | Remove redudant content lines * Revert back csproj back to original format | Remove only just redudant lines * remove extra line * Revert "remove extra line" This reverts commit 48bc339. * Revert "Revert back csproj back to original format | Remove only just redudant lines" This reverts commit a2bf34b. * Revert "Docs.csproj | Remove redudant content lines" This reverts commit 6d0ab29. * Docs.csproj | Remove redudant content lines * Cleaner concatenation * Formating * Highlights * regions * Fix new line --------- Co-authored-by: Mladen Macanovic <[email protected]>
- Loading branch information
1 parent
ed5935f
commit 0fb58ba
Showing
12 changed files
with
429 additions
and
16 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
71 changes: 71 additions & 0 deletions
71
...ise.Docs/Pages/Docs/Extensions/DataGrid/Code/DataGridSelectColumnMultipleExampleCode.html
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,71 @@ | ||
| <div class="blazorise-codeblock"> | ||
| <div class="html"><pre> | ||
| <span class="htmlTagDelimiter"><</span><span class="htmlElementName">DataGrid</span> <span class="htmlAttributeName">TItem</span><span class="htmlOperator">=</span><span class="quot">"</span><span class="htmlAttributeValue">EmployeeActivity</span><span class="quot">"</span> <span class="htmlAttributeName">Data</span><span class="htmlOperator">=</span><span class="quot">"</span><span class="sharpVariable"><span class="atSign">@</span>employeeList</span><span class="quot">"</span> <span class="htmlAttributeName">PageSize</span><span class="htmlOperator">=</span><span class="quot">"</span><span class="htmlAttributeValue">5</span><span class="quot">"</span> <span class="htmlAttributeName">Responsive</span> <span class="htmlAttributeName">Editable</span><span class="htmlTagDelimiter">></span> | ||
| <span class="htmlTagDelimiter"><</span><span class="htmlElementName">DataGridSelectColumn</span> <span class="htmlAttributeName">TItem</span><span class="htmlOperator">=</span><span class="quot">"</span><span class="htmlAttributeValue">EmployeeActivity</span><span class="quot">"</span> <span class="htmlAttributeName">Field</span><span class="htmlOperator">=</span><span class="quot">"</span><span class="htmlAttributeValue"><span class="atSign">@</span>nameof( EmployeeActivity.Activities )</span><span class="quot">"</span> | ||
| <span class="htmlAttributeName">Caption</span><span class="htmlOperator">=</span><span class="quot">"</span><span class="htmlAttributeValue">Activity</span><span class="quot">"</span> | ||
| <span class="htmlAttributeName">Editable</span> | ||
| <span class="htmlAttributeName">Multiple</span> | ||
| <span class="htmlAttributeName">Data</span><span class="htmlOperator">=</span><span class="quot">"</span><span class="htmlAttributeValue">activities</span><span class="quot">"</span> | ||
| <span class="htmlAttributeName">ValueField</span><span class="htmlOperator">=</span><span class="quot">"</span><span class="htmlAttributeValue">(x) => ((Activity)x).Code</span><span class="quot">"</span> | ||
| <span class="htmlAttributeName">TextField</span><span class="htmlOperator">=</span><span class="quot">"</span><span class="htmlAttributeValue">(x) => ((Activity)x).Description</span><span class="quot">"</span> <span class="htmlTagDelimiter">/></span> | ||
| <span class="htmlTagDelimiter"><</span><span class="htmlElementName">DataGridCommandColumn</span> <span class="htmlTagDelimiter">/></span> | ||
| <span class="htmlTagDelimiter"></</span><span class="htmlElementName">DataGrid</span><span class="htmlTagDelimiter">></span> | ||
| </pre></div> | ||
| <div class="csharp"><pre> | ||
| <span class="atSign">@</span>code { | ||
| [Inject] | ||
| <span class="keyword">public</span> EmployeeData EmployeeData { <span class="keyword">get</span>; <span class="keyword">set</span>; } | ||
| <span class="keyword">private</span> List<EmployeeActivity> employeeList; | ||
|
|
||
| <span class="keyword">protected</span> <span class="keyword">override</span> <span class="keyword">async</span> Task OnInitializedAsync() | ||
| { | ||
| employeeList = (<span class="keyword">await</span> EmployeeData.GetDataAsync()).Select(x => <span class="keyword">new</span> EmployeeActivity(x) | ||
| { | ||
| Activities = activities | ||
| .OrderBy(x => Random.Shared.Next()) | ||
| .Take(Random.Shared.Next(<span class="number">5</span>)) | ||
| .Select(x => x.Code).ToArray() | ||
| }).ToList(); | ||
|
|
||
| <span class="keyword">await</span> <span class="keyword">base</span>.OnInitializedAsync(); | ||
| } | ||
|
|
||
| <span class="keyword">private</span> List<Activity> activities = <span class="keyword">new</span> List<Activity> | ||
| { | ||
| <span class="keyword">new</span> Activity { Code = <span class="string">"MEET"</span>, Description = <span class="string">"Meeting"</span> }, | ||
| <span class="keyword">new</span> Activity { Code = <span class="string">"TRAIN"</span>, Description = <span class="string">"Training"</span> }, | ||
| <span class="keyword">new</span> Activity { Code = <span class="string">"CODE"</span>, Description = <span class="string">"Coding"</span> }, | ||
| <span class="keyword">new</span> Activity { Code = <span class="string">"R&D"</span>, Description = <span class="string">"Research"</span> }, | ||
| <span class="keyword">new</span> Activity { Code = <span class="string">"TEST"</span>, Description = <span class="string">"Testing"</span> }, | ||
| }; | ||
|
|
||
| <span class="keyword">public</span> <span class="keyword">class</span> EmployeeActivity : Employee | ||
| { | ||
| <span class="keyword">public</span> <span class="keyword">string</span>[] Activities { <span class="keyword">get</span>; <span class="keyword">set</span>; } | ||
|
|
||
| <span class="keyword">public</span> EmployeeActivity(Employee employee) | ||
| { | ||
| <span class="keyword">this</span>.City = employee.City; | ||
| <span class="keyword">this</span>.Email = employee.Email; | ||
| <span class="keyword">this</span>.FirstName = employee.FirstName; | ||
| <span class="keyword">this</span>.LastName = employee.LastName; | ||
| <span class="keyword">this</span>.Salary = employee.Salary; | ||
| <span class="keyword">this</span>.DateOfBirth = employee.DateOfBirth; | ||
| <span class="keyword">this</span>.Gender = employee.Gender; | ||
| <span class="keyword">this</span>.Childrens = employee.Childrens; | ||
| <span class="keyword">this</span>.Id = employee.Id; | ||
| <span class="keyword">this</span>.Zip = employee.Zip; | ||
| <span class="keyword">this</span>.Tax = employee.Tax; | ||
| <span class="keyword">this</span>.Salaries = employee.Salaries; | ||
| <span class="keyword">this</span>.IsActive = employee.IsActive; | ||
| } | ||
| } | ||
|
|
||
| <span class="keyword">public</span> <span class="keyword">class</span> Activity | ||
| { | ||
| <span class="keyword">public</span> <span class="keyword">string</span> Code { <span class="keyword">get</span>; <span class="keyword">set</span>; } | ||
| <span class="keyword">public</span> <span class="keyword">string</span> Description { <span class="keyword">get</span>; <span class="keyword">set</span>; } | ||
| } | ||
| } | ||
| </pre></div> | ||
| </div> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
68 changes: 68 additions & 0 deletions
68
...se.Docs/Pages/Docs/Extensions/DataGrid/Examples/DataGridSelectColumnMultipleExample.razor
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,68 @@ | ||
| @namespace Blazorise.Docs.Docs.Examples | ||
|
|
||
| <DataGrid TItem="EmployeeActivity" Data="@employeeList" PageSize="5" Responsive Editable> | ||
| <DataGridSelectColumn TItem="EmployeeActivity" Field="@nameof( EmployeeActivity.Activities )" | ||
| Caption="Activity" | ||
| Editable | ||
| Multiple | ||
| Data="activities" | ||
| ValueField="(x) => ((Activity)x).Code" | ||
| TextField="(x) => ((Activity)x).Description" /> | ||
| <DataGridCommandColumn /> | ||
| </DataGrid> | ||
|
|
||
| @code { | ||
| [Inject] | ||
| public EmployeeData EmployeeData { get; set; } | ||
| private List<EmployeeActivity> employeeList; | ||
|
|
||
| protected override async Task OnInitializedAsync() | ||
| { | ||
| employeeList = (await EmployeeData.GetDataAsync()).Select(x => new EmployeeActivity(x) | ||
| { | ||
| Activities = activities | ||
| .OrderBy(x => Random.Shared.Next()) | ||
| .Take(Random.Shared.Next(5)) | ||
| .Select(x => x.Code).ToArray() | ||
| }).ToList(); | ||
|
|
||
| await base.OnInitializedAsync(); | ||
| } | ||
|
|
||
| private List<Activity> activities = new List<Activity> | ||
| { | ||
| new Activity { Code = "MEET", Description = "Meeting" }, | ||
| new Activity { Code = "TRAIN", Description = "Training" }, | ||
| new Activity { Code = "CODE", Description = "Coding" }, | ||
| new Activity { Code = "R&D", Description = "Research" }, | ||
| new Activity { Code = "TEST", Description = "Testing" }, | ||
| }; | ||
|
|
||
| public class EmployeeActivity : Employee | ||
| { | ||
| public string[] Activities { get; set; } | ||
|
|
||
| public EmployeeActivity(Employee employee) | ||
| { | ||
| this.City = employee.City; | ||
| this.Email = employee.Email; | ||
| this.FirstName = employee.FirstName; | ||
| this.LastName = employee.LastName; | ||
| this.Salary = employee.Salary; | ||
| this.DateOfBirth = employee.DateOfBirth; | ||
| this.Gender = employee.Gender; | ||
| this.Childrens = employee.Childrens; | ||
| this.Id = employee.Id; | ||
| this.Zip = employee.Zip; | ||
| this.Tax = employee.Tax; | ||
| this.Salaries = employee.Salaries; | ||
| this.IsActive = employee.IsActive; | ||
| } | ||
| } | ||
|
|
||
| public class Activity | ||
| { | ||
| public string Code { get; set; } | ||
| public string Description { get; set; } | ||
| } | ||
| } |
107 changes: 107 additions & 0 deletions
107
Documentation/Blazorise.Docs/Pages/News/2025-05-01-release-notes-200.razor
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,107 @@ | ||
| @page "/news/release-notes/200" | ||
|
|
||
| <Seo Canonical="news/release-notes/200" Title="Blazorise v2.0" Description="Welcome to the Blazorise 2.0 release, packed with exciting new features, optimizations, and support for the latest .NET framework." ImageUrl="img/news/200/v200.png" /> | ||
|
|
||
| <NewsPageImage Source="img/news/200/v200.png" Text="Blazorise v2.0" /> | ||
|
|
||
| <NewsPageTitle> | ||
| Announcing Blazorise 2.0 - [CodeName] | ||
| </NewsPageTitle> | ||
|
|
||
| <Paragraph> | ||
| Welcome to the Blazorise 2.0 release, packed with exciting new features, optimizations, and support for the latest .NET framework. Dive into the highlights below to explore how Blazorise 2.0 can enhance your applications. | ||
| </Paragraph> | ||
|
|
||
| <NewsPageSubtitle> | ||
| Key Blazorise 1.0 Highlights 💡 | ||
| </NewsPageSubtitle> | ||
|
|
||
| <Paragraph> | ||
| Here's a summary of what's new in this release: | ||
| </Paragraph> | ||
|
|
||
| <UnorderedList> | ||
| <UnorderedListItem> | ||
| <Paragraph> | ||
| <Strong>DataGridSelectColumn</Strong>: Multiple support | ||
| </Paragraph> | ||
| </UnorderedListItem> | ||
| </UnorderedList> | ||
|
|
||
| <Paragraph> | ||
| Dive into each section for a comprehensive overview of these features and learn how they can enhance your projects. We value your feedback and encourage you to share your thoughts as we continue to refine and improve Blazorise. | ||
| </Paragraph> | ||
|
|
||
| <NewsPageSubtitle> | ||
| Upgrading from 1.7.x to 2.0 👨🔧 | ||
| </NewsPageSubtitle> | ||
|
|
||
| <Paragraph> | ||
| Upgrade your Blazorise application seamlessly with the following steps: | ||
| </Paragraph> | ||
|
|
||
| <OrderedList> | ||
| <OrderedListItem> | ||
| <Paragraph> | ||
| Update all <Strong>Blazorise.*</Strong> package references to <Strong>2.0</Strong>. | ||
| </Paragraph> | ||
| </OrderedListItem> | ||
| <OrderedListItem> | ||
| <Paragraph> | ||
| Blazorise should now work without any major breaking change to the API, but there are some necessary changes that we had to do to make Blazorise better. Continue reading the Migration section for more details. | ||
| </Paragraph> | ||
| </OrderedListItem> | ||
| </OrderedList> | ||
|
|
||
| <NewsPageSubtitle> | ||
| Migration Notes 🛠 | ||
| </NewsPageSubtitle> | ||
|
|
||
| <Paragraph> | ||
| A few API changes and behavior updates have been introduced in Blazorise 2.0 to improve consistency and functionality. Here’s a summary: | ||
| </Paragraph> | ||
|
|
||
| <Paragraph> | ||
| <OrderedList> | ||
| <OrderedListItem> | ||
| <Paragraph> | ||
| </Paragraph> | ||
| <UnorderedList> | ||
| <UnorderedListItem> | ||
| <Paragraph> | ||
| </Paragraph> | ||
| </UnorderedListItem> | ||
| </UnorderedList> | ||
| </OrderedListItem> | ||
| </OrderedList> | ||
| </Paragraph> | ||
|
|
||
| <NewsPageSubtitle> | ||
| New Features & Enhancements 🚀 | ||
| </NewsPageSubtitle> | ||
|
|
||
| <Heading Size="HeadingSize.Is3"> | ||
| DataGrid | ||
| </Heading> | ||
|
|
||
| <Heading Size="HeadingSize.Is4"> | ||
| DataGridSelectColumn Multiple support | ||
| </Heading> | ||
|
|
||
| <Paragraph> | ||
| You may now allow multiple values to be selected in the <Code>DataGridSelectColumn</Code>. Set the new <Code>Multiple</Code> parameter to <Code>true</Code> to enable this feature. Please bind the corresponding array to successfully bind the multiple values. | ||
| </Paragraph> | ||
|
|
||
| <NewsPageSubtitle> | ||
| Final Notes | ||
| </NewsPageSubtitle> | ||
|
|
||
| <Paragraph> | ||
|
|
||
| </Paragraph> | ||
|
|
||
| <Paragraph> | ||
| As always, your feedback is invaluable in guiding future Blazorise development. We encourage you to try out the new features and let us know your thoughts. Thank you for your continued support and enthusiasm for Blazorise, and we look forward to bringing you even more enhancements in future updates! | ||
| </Paragraph> | ||
|
|
||
| <NewsPagePostInfo UserName="Mladen Macanović" ImageName="mladen" PostedOn="" Read="7 min" /> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.