From 32e912a8e73dc74d8fd33b862434ea35d34af877 Mon Sep 17 00:00:00 2001 From: Max Guglielmi Date: Thu, 11 Jun 2015 16:43:00 +1000 Subject: [PATCH] Started doco --- README.md | 179 ++++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 179 insertions(+) diff --git a/README.md b/README.md index c90b8ef4..2aa13ab6 100644 --- a/README.md +++ b/README.md @@ -84,3 +84,182 @@ grunt test-only:test.html,test-sort.html ## License MIT +## Documentation + +### Configuration + +#### Filters appearance + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
PropertyTypeDescriptionRemarksExample
base_pathstringnew defines the path to the script's directory (default: 'TableFilter/')var tfConfig = { base_path: 'myDir/' }
stylesheetstringnew defines the global stylesheet (default: 'filtergrid.css')var tfConfig = { stylesheet: 'myDir/myStylesheet.css' }
fixed_headersbooleanenables / disables fixed headers and table body scrolling (default + -false)Table needs to have thead and tbody tags + defined. Table headers are fixed with a light css solution. It doesn't + seem to work on browsers such as Opera and Chrome. In any case, it + is not the intent of this script to implement a fully tested solution + for generating fixed headers. A simple and easy alternative is to + place a table with same number of columns and widths above the data + table and use the external_flt_grid property to generate + filters in the corresponding columns (external_flt_grid_ids)! + Check this example.var tfConfig = { fixed_headers: true }
tbody_heightnumberdefines the height of the table body when fixed headers are enabled + (default - 200)var tfConfig = { fixed_headers: true, tbody_height: 300 }
filters_cell_tagstringspecifies the tag of the cell containing a filter ('td' / 'th')var tfConfig = { filters_cell_tag: 'th' }
col_widtharraythis property defines column widths. It accepts an array containing + width values (['150px','10%']) var tfConfig = { col_width: ["150px","15%",null,null] + }
inf_div_css_class string defines the css class of div containing paging elements, rows counter + etc.This div contains the paging elements, subdivided in 3 divs (left, + middle and right). var tfConfig = { inf_div_css_class: "myclass" }
left_div_css_class string defines the css class of left divThis div contains the rows counter var tfConfig = { left_div_css_class: "myclass" }
right_div_css_class string defines the css class of right divThis div contains the Clear button and the results + per page drop-down list if paging is enabled var tfConfig = { right_div_css_class: "myclass" }
middle_div_css_class string defines the css class of middle divThis div contains the pages drop-down list and paging navigation + buttons var tfConfig = { middle_div_css_class: "myclass" }
flts_row_css_class string defines the css class of filters rowvar tfConfig = { flts_row_css_class: "myclass" }
flt_css_classstring defines the css class of filters (inputs and selects) var tfConfig = { flt_css_class: "myclass" }
flt_small_css_class string defines the css class of smaller filters (if validation button + is generated in the same column of a filter) var tfConfig = { flt_small_css_class: "myclass" }
flt_multi_css_classstringdefines css class of multiple select filters var tfConfig = { flt_multi_css_class: "myclass" }
single_flt_css_classstringdefines the css class of the single filter when the single_search_filter property is on var tfConfig = { single_flt_css_class: "myclass" }
highlight_css_classstringdefines the css class of highlighted keywordsvar tfConfig = { highlight_css_class: "myclass" }
even_row_css_classstringdefines the css class for even rows var tfConfig = { even_row_css_class: "myclass" }
odd_row_css_classstringdefines the css class for odd rows var tfConfig = { odd_row_css_class: "myclass" }
input_watermark_css_classstringdefines the css class of the watermark in input filters (default - + fltWatermark) var tfConfig = { input_watermark_css_class: "myclass" }
active_columns_css_classstring defines the css class of the active column headers (default - + activeHeader) var tfConfig = { active_columns_css_class: "myclass" }
+ +