Call blazor component on button click event

Question

Hi I have a child componenet positiongrid and I want to invoike this coponent on button click inside parent compoenet

Parent Compoenent Code below

 <div class="form-group col-md-3">
        <button class="btn btn-primary" @onclick="DisplayPositionRefGrid">
          Create
        </button>
    </div>
</div>


   <div class="form-row" id="divPositionRefGrid" hidden="@HideGrid">
       <div class="form-group col-md-12">
           <PositionRefGrid>

           </PositionRefGrid>

          
       </div>
   </div>

The issue is that the child component loading at the same time when the parent is loading but I want to load the child component on button click method 'DisplayPositionRefGrid'

M.Hassan · Accepted Answer · 2021-01-13 08:27:53Z

2

Use Boolean variable to conditionally display the child component.

<div class="form-group col-md-3">
        <button class="btn btn-primary" @onclick="DisplayPositionRefGrid">
          Create
        </button>
    </div>


@if (ShowGrid )
{
   <div class="form-row" id="divPositionRefGrid" hidden="@HideGrid">
       <div class="form-group col-md-12">
           <PositionRefGrid>

           </PositionRefGrid>

          
       </div>
   </div>
}

@code{

private bool ShowGrid {get;set;}

void DisplayPositionRefGrid()
{
  ShowGrid =true;

//other stuf
//...
}
}

Try it online

edited Jan 13, 2021 at 8:27

answered Jan 13, 2021 at 8:11

M.Hassan

11.2k5 gold badges74 silver badges96 bronze badges

Sign up to request clarification or add additional context in comments.

6 Comments

sandeep.mishra Over a year ago

I donot show /Hid ethe grid . I want to load the grid on button click as the grid will take some paramter from the parent compoennet and then when create button clicked the grid will dis[play

M.Hassan Over a year ago

Pass the parameters of the grid from the parent in the html code (if it have Parameter in the child component) e.g <PositionRefGrid data="employee" Display="wide">

sandeep.mishra Over a year ago

I want to restrict the gridview rows by slecting it from parent.That is hwy I want to create the grid on button click.Can you help me on this

M.Hassan Over a year ago

What is the package components are you using for GridView?

sandeep.mishra Over a year ago

Thanks a lot M.Hassan .The solution you provided worked for me

|

Collectives™ on Stack Overflow

Call blazor component on button click event

1 Answer 1

6 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

6 Comments

Your Answer

Sign up or log in

Post as a guest

Related