<div class=""  style="padding-top:1cm;">
    <div class="form-group">
        <div class="input-group">
            <span class="input-group-addon"><i class="fa fa-search"></i></span>
            <input type="text" class="form-control" id="inputAsistente" style="height: 35px !important; text-transform: uppercase;" placeholder="buscar Asistente..">
        </div>
    </div>
</div>
<div class="contenedor">
    <div id="listaAsistentes" style="width:100%; height: 600px; overflow: scroll;" >
        <?php foreach ($Asistentes as $colaborador): ?>
        <?php
        
        $dirFoto = DIR_SICAM32.$colaborador->colaboradorFOTO ;
        if( is_file($dirFoto) ){
            $urlFoto = URL_SICAM32.$colaborador->colaboradorFOTO ;
        }else{
            $urlFoto = URL_SICAM32."archivo/colaboradores/fotos/sin-foto.png" ;
        }
        ?>
        
            <div class="panel panel-default"  id="panel">
                <div class="panel-body">
                    <div class="row">
                    <div class="col-md-3" style="">
                        <img src="<?= $urlFoto ?>" class="img-thumbnail" />
                    </div>
                    <div class="col-md-9" style="padding-left: 0px; padding-right: 0px;">
                        <div>
                            <h4><?= $colaborador->personaNOMBRES ?> <?= $colaborador->personaAPELLIDOS ?></h4> 
                            <h5>Identificación: <?= $colaborador->personaIDENTIFICACION ?></h5> 
                        </div>
                    </div>
                    </div>
                </div>
            </div>
        <?php endforeach; ?>
    </div>
</div>

<script type="text/javascript">
$(document).ready(function(){
    $("#inputAsistente").on("keyup", function() {
        var value = $(this).val().toUpperCase();
        $("#listaAsistentes #panel").filter(function() {
            $(this).toggle($(this).text().toUpperCase().indexOf(value) > -1)
        });
    });
});
</script>
