|
|
Create master detail components in Blazor Server (Detail CRUD Components) |
|
In the previous part of this article series you developed ListTeamMembers.razor component. Now you need to develop the remaining components namely ShowTeamMember.razor, InsertTeamMember.razor, and UpdateTeamMember.razor. You have already these empty component files in the Shared > TeamMembers folder. The UI rendered by the ShowTeamMember component is shown below.
|
|
Posted On : 20 Jun 2022 |
|
|
Create master detail components in Blazor Server (List of Team Members) |
|
In the preceding part of this article series you created master CRUD components namely ListTeams, ShowTeam, InsertTeam, and UpdateTeam. Continuing your development you will complete the detail CRUD components in this part. By the end of this part you will be able to see master-detail behavior and CRUD operations in action. So, let's get started with the detail components.
|
|
Posted On : 06 Jun 2022 |
|
|
Create master detail components in Blazor Server (Master CRUD Components) |
|
In the previous part of this article series you developed the List component that displays a list of Teams in a table. In this part you will create ShowTeam, InsertTeam, and UpdateTeam components to perform the CRUD operations on the Teams table.
The following figure shows how the ShowTeam component displays a Team in the browser.
|
|
Posted On : 19 May 2022 |
|
|
Create master detail components in Blazor Server (Project Structure) |
|
In the previous part of this series you were introduced to the UI and overall functioning of the master-detail Blazor Server app. You also created Team and TeamMembers tables and EF Core model. You have already created the Blazor Server project. Now it's time to kick start the component development. To build the master detail UI you could have but all the markup and the code in a single Razor component. |
|
Posted On : 06 May 2022 |
|
|
Create master detail components in Blazor Server (UI and Tables) |
|
Modern applications often prefer to use rich client side frameworks over traditional server side processing. ASP.NET Core provides Blazor (Server and WebAssembly) as a framework for building rich client side web apps. It would be interesting to see how the master detail user interface can be built using Blazor. To that end this multipart article series is going to show you in detail how Blazor Server can be put to use for developing master detail pages. |
|
Posted On : 21 Apr 2022 |
|
|
Show modal and non-modal dialogs in ASP.NET Core MVC and Blazor |
|
Many web apps accept user input through dialog boxes. There are multiple options when it comes to displaying a dialog box to the user. You can resort to plain JavaScript or you can use some plug-in to accomplish the task. However, in this article I am going to show a lesser known technique of displaying dialog boxes. The HTML |
|
Posted On : 03 Nov 2021 |
|
|
Understand Cascading Parameters and Cascading Values in Blazor |
|
In the previous article we discussed arbitrary parameters and attribute splatting. Now it's time to understand one more aspect of passing values to a Blazor component from the external world - Cascading Parameters and Cascading Values. In all the examples discussed so far, we explicitly set a parameter value from the parent component. This means if we want to pass a value to, say, ten components, we must set a parameter of all the ten components. In such cases Cascading Parameters and Cascading Values come handy. The remainder of this article discusses how. |
|
Posted On : 29 Sep 2021 |
|
|
Use Arbitrary Parameters and Attribute Splatting in Blazor |
|
In the previous article we discussed how parameters can be passed to Blazor component. In the examples discussed so far you created a fixed number of parameters (for example, Value parameter of the Message component) and assigned them some value from the parent component (Index.razor in our examples). What if you want to pass arbitrary number of parameters to a component? That means you won't the exact parameters at development time. The parent component (Index.razor) will set arbitrary parameters on a child component (Message.razor) when the child component is used. This article explores how this can be accomplished. |
|
Posted On : 22 Sep 2021 |
|
|
Pass Parameters to Blazor Components |
|
Blazor apps consist of one or more components. A component can receive data from an external source through parameters. In this article you will learn to add parameters to a Blazor component. You will also learn various ways of setting the parameter values.
Begin by creating a new Blazor Server App project in Visual Studio.
|
|
Posted On : 15 Sep 2021 |
|
|
Separate UI and Code in Blazor |
|
Blazor apps consist of one or more components. Components reside in .razor files and consist of UI markup and C# code. When you create a new Blazor server or WebAssembly project it stores component UI and code in a single file. However, at times this single file approach might not be adequate. Luckily, you can separate your UI markup and C# code easily. This article shows how. |
|
Posted On : 08 Sep 2021 |
|
|