{%block dashboard %}
<script>
  
    $(function(){
        $('#listamodulos').html('<img class="loading" width="16" src="{{asset('loadings/spin.GIF')}}" />');

        $('#listamodulos').load('{{path("ListamodulosxProyecto",{'idproyectos':idproyectos})}}',{},function(){
            $(".loading").hide();
        });        

        $("#multiModulos").click(function(){

            if ($("#multiModulos").prop( "checked") == true)
                $("#idmodulos").attr({'multiple':true, size:30});
            else{
                $("#idmodulos").removeAttr('multiple size');
                $("#multiModulos").prop( "checked", false );
            }
        });
    });
  
    $("#incluirModulo").click(function(){
      var idrol = $('#idrol').val();
      var idmodulos = $('#idmodulos').val();
      
      $.ajax({
        type:"GET",
        async:true,
        url:"{{path('IncluirModulos',{'idproyectos':idproyectos})}}",
        data:{$idrol: idrol, $idmodulos : idmodulos }
      }).done(function(msj){
          $("#modulos").load("{{ path('modulos_proyectos',{'idproyectos':idproyectos})}}");
      });
})

</script> 

        <div class="col-lg-4 col-xs-12   main">
                <div class="form-group">
                        <label>Seleccione Módulo</label>
                        <select class="form-control" id="idmodulos">
                            {% for modulo in modulos %}
                            <option value="{{ modulo.idmodule }}">
                                {{ modulo.modulo | upper }}
                            </option>
                                {% endfor %}

                        </select>
                        <input type="checkbox" id="multiModulos">Múltiples Módulos
                </div>
                <div class="form-group">
                        <label>Seleccione Rol</label>
                        <select class="form-control" id="idrol">
                            {% for rol in roles %}
                            <option value="{{ rol.rol }}">
                                {{ rol.rol }}
                            </option>
                                {% endfor %}

                        </select>
                    </div>                            
             <button class="btn btn-info" id="incluirModulo" >Incluir</button>
        </div>
                            
        <div class="col-lg-4 col-xs-12   main">
            <div class="form-group">
                    <label>Lista de Módulo Incluidos</label>
                    <div id="listamodulos"  class=" table-bordered" style="   height: 150px;  overflow-y: scroll; "></div>
             </div>
        </div>                            
    <div class=" col-xs-12 col-lg-12 col-md-12" id="confiProyectos"></div>
{% endblock %}