Ir para conteúdo
Fórum CódigoFonte.net
Entre para seguir isso  
JOERENNER

FIXAR PRIMEIRA COLUNA

Recommended Posts

OLÁ CAROS AMIGOS. PRECISO QUE EM UMA TABELA A PRIMEIRA COLUNA CHAMADA ALUNO FIQUE FIXA. E QUE O RESTO CONTINUE O MESMO.

SEGUE ABAIXO OS CÓDIGOS:

 

<!DOCTYPE html>
<html>
<title>LISTA DE ALUNO</title>

    <thead>
                        
<head>
    <meta http-equiv="Content-type" content="text/html; charset=utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=no">
    <title>LISTA DE ALUNO.</title>
    <link rel="shortcut icon" type="image/png" href="/media/images/favicon.png">
    <link rel="alternate" type="application/rss+xml" title="RSS 2.0" href="http://www.datatables.net/rss.xml">
    <link rel="stylesheet" type="text/css" href="/media/css/site-examples.css?_=19472395a2969da78c8a4c707e72123a">
    <link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.10.19/css/jquery.dataTables.min.css">
    <style type="text/css" class="init">
    
    tfoot input {
        width: 125%;
        padding: 1px;
        box-sizing: border-box;
    }

    </style>
    <script type="text/javascript" src="/media/js/site.js?_=5e8f232afab336abc1a1b65046a73460"></script>
    <script type="text/javascript" src="/media/js/dynamic.php?comments-page=examples%2Fapi%2Fmulti_filter.html" async></script>
    <script type="text/javascript" language="javascript" src="https://code.jquery.com/jquery-3.3.1.js"></script>
    <script type="text/javascript" language="javascript" src="https://cdn.datatables.net/1.10.19/js/jquery.dataTables.min.js"></script>
    <script type="text/javascript" language="javascript" src="../resources/demo.js"></script>
    <script type="text/javascript" class="init">
    

$(document).ready(function() {
    // Setup - add a text input to each footer cell
    $('#example tfoot th').each( function () {
        var title = $(this).text();
        $(this).html( '<input type="text" placeholder="procurar'+title+'" />' );
    } );

    // DataTable
    var table = $('#example').DataTable();

    // Apply the search
    table.columns().every( function () {
        var that = this;

        $( 'input', this.footer() ).on( 'keyup change', function () {
            if ( that.search() !== this.value ) {
                that
                    .search( this.value )
                    .draw();
            }
        } );
    } );
} );

 
    </script>
</head>
<body class="wide comments example">
    <a name="top" id="top"></a>
    <div class="fw-background">
        <div></div>
                
                </div>
            </div>
        </div>
        
            </div>
        </div>
        <div class="fw-body">
            <div class="content">
                
                </div>
                <table id="example" class="display" style="width:100%">

                    <thead>
                        <tr>
                    <th>ALUNO</th>
                                        <th>CURSO</th>
                    <th>PERIODO</th>
                    <th>MATERIA</th>
                                        <th>BIMESTRE</th>
                                        <th>NOTAS</th>
                    
                                        
                                        
                                        

                </tr>
                    </thead>
                    

                    

</tbody>

<TR>
<TD>JORGE</TD>
<TD>ADMINISTRAÇÃO</TD>
<TD>NOITE</TD>
<TD>CONTABILIDADE</TD>
<TD>SEGUNDO</TD>
<TD>7</TD>

<TR>
<TD>PEDRO</TD>
<TD>ADMINISTRAÇÃO</TD>
<TD>MANHÃ</TD>
<TD>GESTÃO</TD>
<TD>TERDEIRO</TD>
<TD>9</TD>

</TR>


</tbody>


                    <tfoot>
                        <tr>
                    <th>ALUNO</th>
                                        <th>CURSO</th>
                    <th>PERIODO</th>
                    <th>MATERIA</th>
                                        <th>BIMESTRE</th>
                                        <th>NOTAS</th>
                    
                                        
                                        

                                        </tr>
                    </tfoot>
<thead>
                    <th>ALUNO</th>
                                        <th>CURSO</th>
                    <th>PERIODO</th>
                    <th>MATERIA</th>
                                        <th>BIMESTRE</th>
                                        <th>NOTAS</th>
                    
                                        
                                        

                                        </tr>
                    </thead>

 
<html>


</html>

Compartilhar este post


Link para o post
Compartilhar em outros sites

Crie uma conta ou entre para comentar

Você precisar ser um membro para fazer um comentário

Criar uma conta

Crie uma nova conta em nossa comunidade. É fácil!

Crie uma nova conta

Entrar

Já tem uma conta? Faça o login.

Entrar Agora
Entre para seguir isso  

×