Posts

Dynamically Create and Delete Elements in Blazor

Image
This blog is going to explain how to create and delete elements in Blazor. Let's see step by step Step 1: Create Dynamic Element The code for creating dynamic elements is shown below. I created a class named Movie with the fields Name, ReleasedYear, and CoProduction. Inside the for loop, three textboxes were added to collect movie information. I also included a button to generate a new row of text boxes. @page   "/" < h4 > Dynamic Elements </ h4 > < style >      body  {          font-size :  12px ;     }        table  {          width :  50%   !important ;     } </ style >   < table   class = "table" >      < thead >          < tr >              < th > Movie Name </ th >              < th > Release Year </ th >              < th > Co Production </ th >          </ tr >      </ thead >      < tbody >          @for  ( int   i  =  0 ;  i  

Templated Component with RenderFragment in Blazor

Image
What RenderFragment is and how to use it in an application will be covered in this blog. The component and content are rendered with the aid of the RenderFragment. Reusing the components is made easier by the templated component. RenderFragment and RenderFragment<T> are the two different sorts of render elements. RenderFragment - It is a just a simple razor content RenderFragment<T> - It allows parameters within the razor content. The context keyword helps to set a parameter within the razor content. Let's start by looking at a simple RenderFragment example. The code for the child component is as follows. In this case, ChildContent is declared as RenderFragment. The UI segment is rendered by this RenderFragment. additionally, the @ChildContent is put within the <div> element. Child.razor < h3 >Child</ h3 > < div   class = "alert alert-primary" >      @ ChildContent </ div > @ code   {     [ Parameter ]      public