Skip to content

Latest commit

 

History

History
79 lines (59 loc) · 3.44 KB

README.md

File metadata and controls

79 lines (59 loc) · 3.44 KB
Raw

lite-datatable-js

lite-datatable-js - A light-weight javascript lib to "power-up" a HTML table.

Notable Features

  • Paging in HTML tables.

  • Configure the number of records per page.

  • Search input.

  • Fully customizable by adding css classes.

Requirements

jQuery.1.4+

Desktop Browser Support

IE9+, Firefox 4+, Chrome, Safari 4+, Opera 11+ (Other browsers may work, but I did not test on them)

Forking

If you find that you need a feature that LiteDataTable does not currently support, either let me know via the LiteDataTable issue tracker.

Usage

To just go with the default options simply do

 $(document).ready(function () {
	var liteDataTable = new LiteDataTable();
	liteDataTable.init({
		table: $('YOUR-TABLE-SELECTOR')
	});
 });

To provide optional settings, simply pass settings object to init function of LiteDataTable()

 $(document).ready(function () {
	var liteDataTable = new LiteDataTable();
	liteDataTable.init({
		table: $('YOUR-TABLE-SELECTOR'),
		recordsPerPage: 5,
		showSearchInput: false
	});
 });

Settings

  • recordsPerPage (int) (Set the number of lines per page. DEFAULT 10)
  • optionsRecordsPerPage (int[]) (Set the options to select of lines per page. DEFAULT [10, 50, 100])
  • captionLabelRecordsPerPage (string) (Set the caption to label of select of lines per page. DEFAULT 'Records per page:')
  • captionSearchInput (string) (Set the placeholder to input search text. DEFAULT 'Search')
  • captionButtonFirstPage (string) (Set the caption to button of first page. DEFAULT '<<')
  • captionButtonPreviousPage (string) (Set the caption to button of previous page. DEFAULT '<')
  • captionButtonNextPage (string) (Set the caption to button of next page. DEFAULT '>')
  • captionButtonLastPage (string) (Set the caption to button of last page. DEFAULT '>>')
  • showRecordsPerPage (boolean) (Set the visibility of configuration of lines per page. DEFAULT true)
  • showSearchInput (boolean) (Set the visibility of input search. DEFAULT true)
  • cssClassForRecordsPerPageContainer (string) (Set the CSS class to div container of records per page. DEFAULT '')
  • cssClassForLabelRecordsPerPage (string) (Set the CSS class to label of records per page. DEFAULT '')
  • cssClassForSelectRecordsPerPage (string) (Set the CSS class to select field of records per page. DEFAULT '')
  • cssClassForSearchTextContainer (string) (Set the CSS class to div container of input search. DEFAULT '')
  • cssClassForInputSearch (string) (Set the CSS class to input of search text. DEFAULT '')
  • cssClassForContainerTopFields (string) (Set the CSS class to div container for TOP elements (records per page and input search). DEFAULT '')
  • cssClassForContainerBottomFields (string) (Set the CSS class to div container for BOTTOM elements (buttons for pagination). DEFAULT '')
  • cssClassForButtonFirstPage (string) (Set the CSS class to button First Page. DEFAULT '')
  • cssClassForButtonPreviousPage (string) (Set the CSS class to button Previous Page. DEFAULT '')
  • cssClassForButtonNextPage (string) (Set the CSS class to button Next Page. DEFAULT '')
  • cssClassForButtonLastPage (string) (Set the CSS class to button Last Page. DEFAULT '')
  • cssClassForSpanCurrentPage (string) (Set the CSS class to span that displays current page and total of pages. DEFAULT '')