Filter Modal Component - Copy this Html, Bootstrap Component to your project

<div class="modal fade show d block" id="exampleModal" tabindex=" 1" role="dialog"> <div class="modal dialog" role="document"> <div class="modal content" style="width:auto"> <div class="modal header"> <h5 class="modal title">Filtri</h5> <button type="button" class="close" @onclick="CancellaFiltri">&times;</button> </div> <div class="modal body"> <div class="form group"> <label for="usernameFilter">Username:</label> <input id="usernameFilter" @bind="UsernameFilter" class="form control" placeholder="Filtra per username" /> </div> <div class="form group"> <label for="ruoloFilter">Ruolo:</label> <select id="ruoloFilter" @bind="RuoloFilter" class="form control"> <option value="">Tutti i ruoli</option> <option value="Administrator">Administrator</option> <option value="User">User</option> <option value="Manager">Manager</option> </select> </div> <div class="form group"> <label for="emailFilter">Email:</label> <input id="emailFilter" @bind="EmailFilter" class="form control" placeholder="Filtra per email" /> </div> <div class="form group"> <label for="lastNameFilter">Last Name:</label> <input id="lastNameFilter" @bind="LastNameFilter" class="form control" placeholder="Filter by last name" /> </div> <div class="form group"> <label for="enabledFilter">Enabled:</label> <select id="enabledFilter" @bind="EnabledFilter" class="form control"> <option value="">All</option> <option value="1">Yes</option> <option value="0">No</option> </select> </div> </div> <div class="popup footer"> <button @onclick="ApplicaFiltri" class="btn btn primary">Applica Filtri</button> <button @onclick="CancellaFiltri" class="btn btn danger">Cancella Filtri</button> </div> </div> </div> </div>