<div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
    <input class="mdl-textfield__input" type="text" id="userSearchText" [value]=""
           [formControl]="searchUser"/>
    <label class="mdl-textfield__label" for="userSearchText">Search user</label>
</div>
<ul class='mdl-list'>
    <li class="mdl-list__item fix-element-user-list" *ngFor="let user of userList">
        <span class="mdl-list__item-primary-content mdl-button mdl-js-button mdl-js-ripple-effect"
              (click)="onRowClick(user)" id="user-{{user.id}}">
            <i class="material-icons md-light people-search__icon">face</i>
                {{getDisplayUser(user)}}
        </span>
    </li>
    <div *ngIf="userList?.length === 0" id="no-user-found">
        No user found to involve
    </div>
</ul>
