Place pagination in table

Asked

Viewed 276 times

1

My understanding of javascript very little wanted help to add pagination in table html css materialize

    <table class="striped" id="id_tabela">
      <thead>
          <tr>
              <th>Nome do Cliente</th>                    
              <th>Email</th>                    
              <th>Telefone</th>
              <th>Editar</th>
              <th>Excluir</th>                        
           </tr>
        </thead>
    <tbody>
    <?php include_once 'criar/read.php'; ?>
    </tbody>
    </table>
    <ul class="pagination" id="id_tabela">
        <li class="disabled"><a href="#!"><i class="material-icons">chevron_left</i></a></li>
        <li class="active"><a href="#!">1</a></li>
        <li class="waves-effect"><a href="#!">2</a></li>
        <li class="waves-effect"><a href="#!">3</a></li>
        <li class="waves-effect"><a href="#!">4</a></li>
        <li class="waves-effect"><a href="#!">5</a></li>
        <li class="waves-effect"><a href="#!"><i class="material-icons">chevron_right</i></a></li>
</ul>

<script type="text/javascript" src="https://raw.githubusercontent.com/pinzon1992/materialize_table_pagination/master/js/pagination.js">

<script type="text/javascript">
          $(document).ready(function(){
            $('#id_tabela').pageMe({
              pagerSelector:'#myPager',
              activeColor: 'green',
              prevText:'Anterior',
              nextText:'Siguiente',
              showPrevNext:true,
              hidePageNumbers:false,
              perPage:10
            });

              // Write on keyup event of keyword input element
                    /*$("#search").keyup(function(){

                        _this = this;
                        // Show only matching TR, hide rest of them
                        $.each($("#tabla tbody tr"), function() {
                                alert("Encontrado");
                                if($(this).text().toLowerCase().indexOf($(_this).val().toLowerCase()) === -1)
                                     $(this).hide();
                                else
                                     $(this).show();
                        });
                    }); */
          });
</script>
  • Could also add your Javascript code and describe what was the difficulty found?

  • Be can help me I appreciate

  • But what do you need help with? Put what you have asked into the question and describe your difficulty. If you do not put anything, it will seem that you want us to do it for you.

  • thanks for attention I think I’ll solve only error in class I think I solve

No answers

Browser other questions tagged

You are not signed in. Login or sign up in order to post.