https://github.com/reisraff/tabling

https://github.com/reisraff/tabling

Last synced: 7 months ago
JSON representation

• Host: GitHub
• URL: https://github.com/reisraff/tabling
• Owner: reisraff
• License: mit
• Created: 2017-03-08T14:55:19.000Z (over 8 years ago)
• Default Branch: master
• Last Pushed: 2021-01-27T19:09:37.000Z (over 4 years ago)
• Last Synced: 2025-01-18T05:14:26.440Z (9 months ago)
• Language: JavaScript
• Size: 37.1 KB
• Stars: 1
• Watchers: 4
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

          
# Tabling

The tool to generate a pagination with a pure js, no jQuery required.

## Simple Usage

HTML file

```html



  


    

    

  


  

    

      

        Id

        Name

        Email

        Actions

      

    

    

      

        

        

        

        

          edit

          delete

          view

        

      

    

  

  
Page  of 



  


    


      
<<

      
<

      
%page%

      
>

      
>>

    

  



  var data = {

    page: 1,

    perPage: 5,

  };

  var table = tabling({

    elementId : 'table-1',

    endingpointUrl : 'example/data.json'

  });

  table.on('keyup', function (el, e) {

    data.search = el.value;

    table.request();

  });

  table.setRequestHandler(function () {

    return {

      headers : [

        {

          header: 'Content-type',

          value: 'application/json'

        }

      ],

      data: data

    };

  });

  table.setResponseHandler(function (response) {

    response = JSON.parse(response);

    table.flush();

    table.addLines(response.data);

    table.setPagination(response.meta.pagination);

    document.getElementById("currentPage").innerHTML = response.meta.pagination.currentPage;

    document.getElementById("totalPages").innerHTML = response.meta.pagination.totalPages;

  });

  table.setPaginationHandler(function (page) {

    data.page = page;

    table.request();

  });

  table.setSortingHandler(function (sort) {

    console.log(sort);

  });

  table.init();

```

## Full Doc

[DOC.md](https://github.com/vixtech/tabling/blob/master/DOC.md)