0

estoy trabajando en un proyecto de CRUD de una tabla Empleados con Java y MySQL, con el patrón de diseño MVC en el IDE Eclipse, he creado dos vistas, una para enlistar la consulta de empleados y otra con el formulario para crear el empleado, también he creado el respectivo Controlador y Modelo de Empleado.

Esta es mi estructura:

introducir la descripción de la imagen aquí

En las vistas que he creado, se repite el código del head y footer. Pregunta: ¿existe una forma de fragmentar las vistas, es decir, en un archivo crear el head, en otro archivo iría el body correspondiente y en el otro archivo iría el footer, y en el momento dado de invocar la vista, que se haga el llamado de los tres archivos? De esta manera solo se crearía una vez el código del head y del footer.

He aquí el código de la vista del formulario para crear empleado

<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
<%@ page import="java.util.*, Controller.*, Model.*" %>

<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>


<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Listado de Empleados</title>

    <link rel="icon" href="./assets/img/icon.ico" type="image/x-icon"/>

    <!-- Fonts and icons -->
    <script src="./assets/js/plugin/webfont/webfont.min.js"></script>
    <script>
        WebFont.load({
            google: {"families":["Lato:300,400,700,900"]},
            custom: {"families":["Flaticon", "Font Awesome 5 Solid", "Font Awesome 5 Regular", "Font Awesome 5 Brands", "simple-line-icons"], urls: ['./assets/css/fonts.min.css']},
            active: function() {
                sessionStorage.fonts = true;
            }
        });
    </script>

    <!-- CSS Files -->
    <link rel="stylesheet" href="./assets/css/bootstrap.min.css">
    <link rel="stylesheet" href="./assets/css/atlantis.min.css">

    <!-- CSS Just for demo purpose, don't include it in your project -->
    <link rel="stylesheet" href="./assets/css/demo.css">

    <!--DataTable-->
    <link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.10.21/css/jquery.dataTables.min.css">
    <link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/buttons/1.6.2/css/buttons.dataTables.min.css">

    <!--DataTable-->
    <script src="https://code.jquery.com/jquery-3.5.1.js"></script>
    <script src="https://cdn.datatables.net/1.10.21/js/jquery.dataTables.min.js"></script>
    <script src="https://cdn.datatables.net/buttons/1.6.2/js/dataTables.buttons.min.js"></script>
    <script src="https://cdn.datatables.net/buttons/1.6.2/js/buttons.flash.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jszip/3.1.3/jszip.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.53/pdfmake.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.53/vfs_fonts.js"></script>
    <script src="https://cdn.datatables.net/buttons/1.6.2/js/buttons.html5.min.js"></script>
    <script src="https://cdn.datatables.net/buttons/1.6.2/js/buttons.print.min.js"></script>

</head>


<body class="body">

<div class="container-fluid">


<div class="page-inner">
    <div class="page-header">
        <h4 class="page-title">Empleados</h4>
        <ul class="breadcrumbs">
            <li class="nav-home">
                <a href="#">
                    <i class="flaticon-home"></i>
                </a>
            </li>
            <li class="separator">
                <i class="flaticon-right-arrow"></i>
            </li>
            <li class="nav-item">
                <a href="#">Empleados</a>
            </li>
            <li class="separator">
                <i class="flaticon-right-arrow"></i>
            </li>
            <li class="nav-item">
                <a href="#">Contratar</a>
            </li>
        </ul>
    </div>
    
    
    
    
    <div class="container">
    <div class="col-md-12">
        <div class="card">
            <div class="card-header">
                <div class="card-title">Crear Empleado</div>
            </div>
            <div class="card-body">
                <form action="#" method="POST">

                    <div class="form-row">
                        <div class="form-group col-md-4">
                            <label>Numero de identificacion</label>
                            <input type="number" class="form-control" name="emp_cdl" placeholder="Cédula">
                        </div>
                        <div class="form-group col-md-4">
                            <label>Nombres</label>
                            <input type="text" class="form-control" name="emp_nmbr" placeholder="Nombres">
                        </div> 
                        <div class="form-group col-md-4">
                            <label>Apellidos</label>
                            <input type="text" class="form-control" name="emp_aplld" placeholder="Apellidos">
                        </div>

                    </div>

                    <div class="form-row">
                        <div class="form-group col-md-4">
                            <label>Dirección</label>
                            <input type="text" class="form-control" name="emp_drccn" placeholder="Dirección">
                        </div> 
                        <div class="form-group col-md-4">
                            <label>Teléfono</label>
                            <input type="number" class="form-control" name="emp_tlfn" placeholder="Teléfono">
                        </div> 
                        <div class="form-group col-md-4">
                            <label>Correo electrónico</label>
                            <input type="mail" class="form-control" name="emp_crr" placeholder="Correo electrónico">
                        </div> 

                    </div>
                    
                    <div class="form-row">
                        <div class="form-group col-md-4">
                            <label>Cargo</label>
                            <select class="form-control" name="emp_crg">
                                <option value="">Seleccione...</option>
                                <c:forEach var="tempCargo" items="${ListaCargos}">
                                <option value="${tempCargo.crg_id}">${tempCargo.crg_dscrpcn}</option>
                                </c:forEach>
                                
                            </select>
                        </div> 
                        <div class="form-group col-md-4">
                            <label>Fecha Nacimiento</label>
                            <input type="date" class="form-control" name="emp_fncmnt">
                        </div> 
                        <div class="form-group col-md-4">
                            <label>Fecha Ingreso</label>
                            <input type="date" class="form-control" name="emp_fingrs">
                        </div> 
                    </div>
                    
                    <div class="form-row">
                        <div class="form-group col-md-4">
                            <label>Nombre Contacto Emergencia</label>
                            <input type="text" class="form-control" name="emp_nmbrcntctmrgnc" placeholder="Contacto Emergencia">
                        </div> 
                        <div class="form-group col-md-4">
                            <label>Teléfono Contacto Emergencia</label>
                            <input type="number" class="form-control" name="emp_tlfncntctmrgnc">
                        </div> 
                        <div class="form-group col-md-4">
                            <label>Parentesco Contacto Emergencia</label>
                            <input type="text" class="form-control" name="emp_prntzccntctmrgnc">
                        </div> 
                    </div>
                    
                    <div class="form-row">
                        <div class="form-group col-md-4">
                            <label>Nivel Académico</label>
                            <input type="text" class="form-control" name="emp_nvlcdmc" placeholder="Nivel Académico">
                        </div> 
                        <div class="form-group col-md-4">
                            <label>Libreta Militar</label>
                            <input type="text" class="form-control" name="emp_lbrtmltr" placeholder="Libreta Militar">
                        </div> 
                        <div class="form-group col-md-4">
                            <label>Licencia Conducción</label>
                            <input type="text" class="form-control" name="emp_lcnccndccn" placeholder="Licencia Conducción">
                        </div> 
                    </div>
                    
                    <div class="form-row">
                        <div class="form-group col-md-4">
                            <label>Fecha Expedición Documento</label>
                            <input type="date" class="form-control" name="emp_fxpdc">
                        </div> 
                        <div class="form-group col-md-4">
                            <label>Lugar Expedición Documento</label>
                            <input type="text" class="form-control" name="emp_lgrxpdcn" placeholder="Lugar Expedición Documento">
                        </div> 
                        <div class="form-group col-md-4">
                            <label>Nombre Centro Medico</label>
                            <select class="form-control" name="emp_cmedico">
                                <option value="">Seleccione...</option>
                                <c:forEach var="tempCentroMedico" items="${ListaCentrosMedico}">
                                <option value="${tempCentroMedico.ctm_id}">${tempCentroMedico.ctm_nmbr}</option>
                                </c:forEach>
                                
                            </select>
                        </div> 
                    </div>
                    
                    <div class="form-row">
                        <div class="form-group col-md-4">
                            <label>Ciudad Empleado</label>
                            <input type="text" class="form-control" name="emp_ciudad" placeholder="Ciudad Empleado">
                        </div> 
                        <div class="form-group col-md-4">
                            <label>EPS</label>
                            <select class="form-control" name="emp_eps">
                                <option value="">Seleccione...</option>
                                <c:forEach var="tempEps" items="${ListaEps}">
                                <option value="${tempEps.eps_id}">${tempEps.eps_nmbr}</option>
                                </c:forEach>
                            </select>
                        </div> 

                        <div class="form-group col-md-4">
                            <label>Panadería</label>
                            <select class="form-control" name="emp_pndr">
                                <option value="">Seleccione...</option>
                                <c:forEach var="tempPan" items="${ListaPanaderias}">
                                <option value="${tempPan.pnd_id}">${tempPan.pnd_nmbr} </option>
                                </c:forEach>
                            </select>
                        </div> 
                    </div>
                    
                    <div class="form-row">
                        <div class="form-group col-md-4">
                            <label>Sueldo</label>
                            <input type="number" class="form-control" name="emp_sueldo" placeholder="Sueldo">
                        </div> 
                    </div>
                    
                    
                    <div class="card-action">
                        <a class="btn btn-secondary" href="#">Salir</a>
                        <button type="submit" class="btn btn-success">Registrar Empleado</button>
                    </div>
                </form>
            </div>
        </div>
    </div>
    </div>
</div>


</div>


<script>
    $(document).ready(function() {
        $('#empleado').DataTable( {
            dom: 'Bfrtip',
            lengthMenu: [
            [ 10, 25, 50, 100, -1 ],
            [ '10 Filas', '25 Filas', '50 Filas','100 Filas', 'Mostrar Todos' ]
            ],
            buttons: [
            {
                extend: 'pageLength',
                text: 'Filtrar # Filas'
            },
            {
                extend: 'copy',
                text: 'Copiar al Portapapeles'
            },
            {
                extend: 'csv',
                text: 'Exportar CSV'
            },
            {
                extend: 'excel',
                text: 'Exportar Excel'
            },
            {
                extend: 'pdf',
                text: 'Exportar Pdf'
            },
            {
                extend: 'print',
                text: 'Imprimir Tabla'
            }
            ],
            "language": {
                "url": "//cdn.datatables.net/plug-ins/9dcbecd42ad/i18n/Spanish.json"
            }
        } );
    } );
</script>



<script src="./assets/js/core/jquery.3.2.1.min.js"></script>
<script src="./assets/js/core/popper.min.js"></script>
<script src="./assets/js/core/bootstrap.min.js"></script>

<!-- jQuery UI -->
<script src="./assets/js/plugin/jquery-ui-1.12.1.custom/jquery-ui.min.js"></script>
<script src="./assets/js/plugin/jquery-ui-touch-punch/jquery.ui.touch-punch.min.js"></script>

<!-- jQuery Scrollbar -->
<script src="./assets/js/plugin/jquery-scrollbar/jquery.scrollbar.min.js"></script>


<!-- Chart JS -->
<script src="./assets/js/plugin/chart.js/chart.min.js"></script>

<!-- jQuery Sparkline -->
<script src="./assets/js/plugin/jquery.sparkline/jquery.sparkline.min.js"></script>

<!-- Chart Circle -->
<script src="./assets/js/plugin/chart-circle/circles.min.js"></script>

<!-- Datatables -->
<script src="./assets/js/plugin/datatables/datatables.min.js"></script>

<!-- Bootstrap Notify -->
<script src="./assets/js/plugin/bootstrap-notify/bootstrap-notify.min.js"></script>

<!-- jQuery Vector Maps -->
<script src="./assets/js/plugin/jqvmap/jquery.vmap.min.js"></script>
<script src="./assets/js/plugin/jqvmap/maps/jquery.vmap.world.js"></script>

<!-- Sweet Alert -->
<script src="./assets/js/plugin/sweetalert/sweetalert.min.js"></script>

<!-- Atlantis JS -->
<script src="./assets/js/atlantis.min.js"></script>

<!-- Atlantis DEMO methods, don't include it in your project! 
<script src="./assets/js/setting-demo.js"></script>
<script src="./assets/js/demo.js"></script>-->
<script src="./assets/js/core/global.js"></script>
<script>
    Circles.create({
        id:'circles-1',
        radius:45,
        value:60,
        maxValue:100,
        width:7,
        text: 5,
        colors:['#f1f1f1', '#FF9E27'],
        duration:400,
        wrpClass:'circles-wrp',
        textClass:'circles-text',
        styleWrapper:true,
        styleText:true
    })

    Circles.create({
        id:'circles-2',
        radius:45,
        value:70,
        maxValue:100,
        width:7,
        text: 36,
        colors:['#f1f1f1', '#2BB930'],
        duration:400,
        wrpClass:'circles-wrp',
        textClass:'circles-text',
        styleWrapper:true,
        styleText:true
    })

    Circles.create({
        id:'circles-3',
        radius:45,
        value:40,
        maxValue:100,
        width:7,
        text: 12,
        colors:['#f1f1f1', '#F25961'],
        duration:400,
        wrpClass:'circles-wrp',
        textClass:'circles-text',
        styleWrapper:true,
        styleText:true
    })

    var totalIncomeChart = document.getElementById('totalIncomeChart').getContext('2d');

    var mytotalIncomeChart = new Chart(totalIncomeChart, {
        type: 'bar',
        data: {
            labels: ["S", "M", "T", "W", "T", "F", "S", "S", "M", "T"],
            datasets : [{
                label: "Total Income",
                backgroundColor: '#ff9e27',
                borderColor: 'rgb(23, 125, 255)',
                data: [6, 4, 9, 5, 4, 6, 4, 3, 8, 10],
            }],
        },
        options: {
            responsive: true,
            maintainAspectRatio: false,
            legend: {
                display: false,
            },
            scales: {
                yAxes: [{
                    ticks: {
                            display: false //this will remove only the label
                        },
                        gridLines : {
                            drawBorder: false,
                            display : false
                        }
                    }],
                    xAxes : [ {
                        gridLines : {
                            drawBorder: false,
                            display : false
                        }
                    }]
                },
            }
        });

    $('#lineChart').sparkline([105,103,123,100,95,105,115], {
        type: 'line',
        height: '70',
        width: '100%',
        lineWidth: '2',
        lineColor: '#ffa534',
        fillColor: 'rgba(255, 165, 52, .14)'
    });
</script>



<!--DataTable-->
<script src="https://code.jquery.com/jquery-3.5.1.js"></script>
<script src="https://cdn.datatables.net/1.10.21/js/jquery.dataTables.min.js"></script>
<script src="https://cdn.datatables.net/buttons/1.6.2/js/dataTables.buttons.min.js"></script>
<script src="https://cdn.datatables.net/buttons/1.6.2/js/buttons.flash.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jszip/3.1.3/jszip.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.53/pdfmake.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.53/vfs_fonts.js"></script>
<script src="https://cdn.datatables.net/buttons/1.6.2/js/buttons.html5.min.js"></script>
<script src="https://cdn.datatables.net/buttons/1.6.2/js/buttons.print.min.js"></script>


</body>
</html>

Aquí el código de la vista de enlistar empleados

<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
<%@ page import="java.util.*, Controller.*, Model.*" %>

<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>


<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Listado de Empleados</title>

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">

<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script>

    <link rel="icon" href="./assets/img/icon.ico" type="image/x-icon"/>

    <!-- Fonts and icons -->
    <script src="./assets/js/plugin/webfont/webfont.min.js"></script>
    <script>
        WebFont.load({
            google: {"families":["Lato:300,400,700,900"]},
            custom: {"families":["Flaticon", "Font Awesome 5 Solid", "Font Awesome 5 Regular", "Font Awesome 5 Brands", "simple-line-icons"], urls: ['./assets/css/fonts.min.css']},
            active: function() {
                sessionStorage.fonts = true;
            }
        });
    </script>

    <!-- CSS Files -->
    <link rel="stylesheet" href="./assets/css/bootstrap.min.css">
    <link rel="stylesheet" href="./assets/css/atlantis.min.css">

    <!-- CSS Just for demo purpose, don't include it in your project -->
    <link rel="stylesheet" href="./assets/css/demo.css">

    <!--DataTable-->
    <link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.10.21/css/jquery.dataTables.min.css">
    <link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/buttons/1.6.2/css/buttons.dataTables.min.css">

    <!--DataTable-->
    <script src="https://code.jquery.com/jquery-3.5.1.js"></script>
    <script src="https://cdn.datatables.net/1.10.21/js/jquery.dataTables.min.js"></script>
    <script src="https://cdn.datatables.net/buttons/1.6.2/js/dataTables.buttons.min.js"></script>
    <script src="https://cdn.datatables.net/buttons/1.6.2/js/buttons.flash.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jszip/3.1.3/jszip.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.53/pdfmake.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.53/vfs_fonts.js"></script>
    <script src="https://cdn.datatables.net/buttons/1.6.2/js/buttons.html5.min.js"></script>
    <script src="https://cdn.datatables.net/buttons/1.6.2/js/buttons.print.min.js"></script>

</head>


<body class="body">

<div class="container-fluid">

<div class="page-inner">

    <div class="page-header">
        
        <div class="row" >
                <div class="col-md-10">
                    <h4 class="page-title"><i class="fas fa-users"></i> Empleados</h4>
                </div>
                <div class="col-md-2">
                <input type="button" class="btn btn-success" value="Nuevo Empleado" onclick="window.location.href='Controller_Empleado?instruccion=contratar'"/>
                </div>
            </div>
        
        
        <ul class="breadcrumbs">
            <li class="nav-home">
                <a href="#">
                    <i class="flaticon-home"></i>
                </a>
            </li>
            <li class="separator">
                <i class="flaticon-right-arrow"></i>
            </li>
            <li class="nav-item">
                <a href="#">Empleados</a>
            </li>
            <li class="separator">
                <i class="flaticon-right-arrow"></i>
            </li>
            <li class="nav-item">
                <a href="#">Consultar Empleados</a>
            </li>
        </ul>
    </div>

</div>



    <table id="empleado" class="display table" style="width:100%">
        <thead class="bg-primary text-white">
        
            <tr class="thead-light">
                <th>Nombres y Apellidos</th>
                <th>Cédula</th>
                <th>Teléfono</th>
                <th>Dirección</th>
                <th>Ciudad</th>
                <th>Cargo</th>
                <th>Fecha Ingreso</th>
                <th>Fecha Retiro</th>
                <th>Panadería</th>
                <th>Editar</th>
                <th>Eliminar</th>
            </tr>
        </thead>
        <tbody class="tbody" id="tbodyConsultarProveedor">
             
            <c:forEach var="tempEmp" items="${ListaEmpleados}">
            
                <c:url var="linkTemp" value="Controller_Empleado">
                    <c:param name="instruccion" value="cargar"></c:param>
                    <c:param name="CEmpleado" value="${tempEmp.emp_cdl}"></c:param>
                </c:url>
                
                <c:url var="linkTempDelete" value="Controller_Empleado">
                    <c:param name="instruccion" value="eliminar"></c:param>
                    <c:param name="CEmpleado" value="${tempEmp.emp_cdl}"></c:param>
                </c:url>
                
                <tr >   
                    <td> ${tempEmp.emp_nmbr} ${tempEmp.emp_aplld} </td>
                    <td>${tempEmp.emp_cdl }</td>
                    <td>${tempEmp.emp_tlfn }</td>
                    <td>${tempEmp.emp_drccn }</td>
                    <td>${tempEmp.emp_ciudad }</td>
                    <td>${tempEmp.emp_crg }</td>
                    <td>${tempEmp.emp_fingrs }</td>
                    <td>${tempEmp.emp_frtr }</td>
                    <td>${tempEmp.emp_pndr }</td>
                    <td><a href="${linkTemp}">Actualizar</a></td>
                    <td><a href="${linkTempDelete}">Eliminar</a></td>
                </tr>
            </c:forEach>
        </tbody>
        <tfoot class="bg-primary text-white">
            <tr class="thead-light">
                <th>Nombres y Apellidos</th>
                <th>Cédula</th>
                <th>Teléfono</th>
                <th>Dirección</th>
                <th>Ciudad</th>
                <th>Cargo</th>
                <th>Fecha Ingreso</th>
                <th>Fecha Retiro</th>
                <th>Panadería</th>
                <th>Editar</th>
                <th>Eliminar</th>
            </tr>
        </tfoot>    
    </table>
</div>


<script>
    $(document).ready(function() {
        $('#empleado').DataTable( {
            dom: 'Bfrtip',
            lengthMenu: [
            [ 10, 25, 50, 100, -1 ],
            [ '10 Filas', '25 Filas', '50 Filas','100 Filas', 'Mostrar Todos' ]
            ],
            buttons: [
            {
                extend: 'pageLength',
                text: 'Filtrar # Filas'
            },
            {
                extend: 'copy',
                text: 'Copiar al Portapapeles'
            },
            {
                extend: 'csv',
                text: 'Exportar CSV'
            },
            {
                extend: 'excel',
                text: 'Exportar Excel'
            },
            {
                extend: 'pdf',
                text: 'Exportar Pdf'
            },
            {
                extend: 'print',
                text: 'Imprimir Tabla'
            }
            ],
            "language": {
                "url": "//cdn.datatables.net/plug-ins/9dcbecd42ad/i18n/Spanish.json"
            }
        } );
    } );
</script>



<script src="./assets/js/core/jquery.3.2.1.min.js"></script>
<script src="./assets/js/core/popper.min.js"></script>
<script src="./assets/js/core/bootstrap.min.js"></script>

<!-- jQuery UI -->
<script src="./assets/js/plugin/jquery-ui-1.12.1.custom/jquery-ui.min.js"></script>
<script src="./assets/js/plugin/jquery-ui-touch-punch/jquery.ui.touch-punch.min.js"></script>

<!-- jQuery Scrollbar -->
<script src="./assets/js/plugin/jquery-scrollbar/jquery.scrollbar.min.js"></script>


<!-- Chart JS -->
<script src="./assets/js/plugin/chart.js/chart.min.js"></script>

<!-- jQuery Sparkline -->
<script src="./assets/js/plugin/jquery.sparkline/jquery.sparkline.min.js"></script>

<!-- Chart Circle -->
<script src="./assets/js/plugin/chart-circle/circles.min.js"></script>

<!-- Datatables -->
<script src="./assets/js/plugin/datatables/datatables.min.js"></script>

<!-- Bootstrap Notify -->
<script src="./assets/js/plugin/bootstrap-notify/bootstrap-notify.min.js"></script>

<!-- jQuery Vector Maps -->
<script src="./assets/js/plugin/jqvmap/jquery.vmap.min.js"></script>
<script src="./assets/js/plugin/jqvmap/maps/jquery.vmap.world.js"></script>

<!-- Sweet Alert -->
<script src="./assets/js/plugin/sweetalert/sweetalert.min.js"></script>

<!-- Atlantis JS -->
<script src="./assets/js/atlantis.min.js"></script>

<!-- Atlantis DEMO methods, don't include it in your project! 
<script src="./assets/js/setting-demo.js"></script>
<script src="./assets/js/demo.js"></script>-->
<script src="./assets/js/core/global.js"></script>
<script>
    Circles.create({
        id:'circles-1',
        radius:45,
        value:60,
        maxValue:100,
        width:7,
        text: 5,
        colors:['#f1f1f1', '#FF9E27'],
        duration:400,
        wrpClass:'circles-wrp',
        textClass:'circles-text',
        styleWrapper:true,
        styleText:true
    })

    Circles.create({
        id:'circles-2',
        radius:45,
        value:70,
        maxValue:100,
        width:7,
        text: 36,
        colors:['#f1f1f1', '#2BB930'],
        duration:400,
        wrpClass:'circles-wrp',
        textClass:'circles-text',
        styleWrapper:true,
        styleText:true
    })

    Circles.create({
        id:'circles-3',
        radius:45,
        value:40,
        maxValue:100,
        width:7,
        text: 12,
        colors:['#f1f1f1', '#F25961'],
        duration:400,
        wrpClass:'circles-wrp',
        textClass:'circles-text',
        styleWrapper:true,
        styleText:true
    })

    var totalIncomeChart = document.getElementById('totalIncomeChart').getContext('2d');

    var mytotalIncomeChart = new Chart(totalIncomeChart, {
        type: 'bar',
        data: {
            labels: ["S", "M", "T", "W", "T", "F", "S", "S", "M", "T"],
            datasets : [{
                label: "Total Income",
                backgroundColor: '#ff9e27',
                borderColor: 'rgb(23, 125, 255)',
                data: [6, 4, 9, 5, 4, 6, 4, 3, 8, 10],
            }],
        },
        options: {
            responsive: true,
            maintainAspectRatio: false,
            legend: {
                display: false,
            },
            scales: {
                yAxes: [{
                    ticks: {
                            display: false //this will remove only the label
                        },
                        gridLines : {
                            drawBorder: false,
                            display : false
                        }
                    }],
                    xAxes : [ {
                        gridLines : {
                            drawBorder: false,
                            display : false
                        }
                    }]
                },
            }
        });

    $('#lineChart').sparkline([105,103,123,100,95,105,115], {
        type: 'line',
        height: '70',
        width: '100%',
        lineWidth: '2',
        lineColor: '#ffa534',
        fillColor: 'rgba(255, 165, 52, .14)'
    });
</script>



<!--DataTable-->
<script src="https://code.jquery.com/jquery-3.5.1.js"></script>
<script src="https://cdn.datatables.net/1.10.21/js/jquery.dataTables.min.js"></script>
<script src="https://cdn.datatables.net/buttons/1.6.2/js/dataTables.buttons.min.js"></script>
<script src="https://cdn.datatables.net/buttons/1.6.2/js/buttons.flash.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jszip/3.1.3/jszip.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.53/pdfmake.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.53/vfs_fonts.js"></script>
<script src="https://cdn.datatables.net/buttons/1.6.2/js/buttons.html5.min.js"></script>
<script src="https://cdn.datatables.net/buttons/1.6.2/js/buttons.print.min.js"></script>


</body>
</html>
 


  [1]: https://i.stack.imgur.com/w50Ue.png
3
  • Bienvenido a SOe. ¿Te refieres a include (hay dos versiones, como directiva y como tag)? Puedes ver más detalles en esta pregunta del sitio en inglés
    – SJuan76
    el 11 ene. 2021 a las 0:36
  • En el controlador tengo esta estructura: private void contratar(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { List<Cargo> cargos=new ArrayList<>(); try{ cargos=modelCargo.getCargos(); //Agregar lista de empleados al request request.setAttribute("ListaCargos", cargos); }catch(Exception e){ e.printStackTrace(); } RequestDispatcher miDispatcher=request.getRequestDispatcher("view/empleado/insertar_empleado.jsp"); miDispatcher.forward(request, response); }
    – Alejandro
    el 11 ene. 2021 a las 3:16
  • Estoy mostrando el contenido de estas vistas en un index que tiene la etiqueta iframe: <iframe name="myFrame" style="height:100%; width:100%;Border:0"> </iframe> El llamado para que el contenido se muestre en ese espacio lo hago así: <a href="Controller_Empleado?instruccion=contratar" target="myFrame"><span class="sub-item">Contratar</span></a>
    – Alejandro
    el 11 ene. 2021 a las 3:22

0

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Examina otras preguntas con la etiqueta o formula tu propia pregunta.