corrade-nucleus-nucleons – Blame information for rev 24
?pathlinks?
Rev | Author | Line No. | Line |
---|---|---|---|
20 | office | 1 | # Table Filter Control |
2 | |||
3 | Use Plugin: [bootstrap-table-filter-control](https://github.com/wenzhixin/bootstrap-table/tree/master/src/extensions/filter-control) </br> |
||
4 | Dependence if you use the datepicker option: [bootstrap-datepicker](https://github.com/eternicode/bootstrap-datepicker) v1.4.0 |
||
5 | |||
6 | ## Usage |
||
7 | |||
8 | ```html |
||
9 | <link rel="stylesheet" type="text/css" href="extensions/filter-control/bootstrap-table-filter-control.css"> |
||
10 | <script src="extensions/filter-control/bootstrap-table-filter-control.js"></script> |
||
11 | ``` |
||
12 | |||
13 | ## Options |
||
14 | |||
15 | ### filterControl |
||
16 | |||
17 | * type: Boolean |
||
18 | * description: Set true to add an `input` or `select` into the column. |
||
19 | * default: `false` |
||
20 | |||
21 | ### filterShowClear |
||
22 | |||
23 | * type: Boolean |
||
24 | * description: Set true to add a button to clear all the controls added by this plugin. |
||
25 | * default: `false` |
||
26 | |||
27 | ### alignmentSelectControlOptions |
||
28 | |||
29 | * type: String |
||
30 | * description: Set the alignemnt of the select control options. Use Use `left`, `right` or `auto`. |
||
31 | * default: `undefined` |
||
32 | |||
33 | ### hideUnusedSelectOptions |
||
34 | |||
35 | * type: Boolean |
||
36 | * description: Set to true in order to hide the options that are not in the table. This option does not work on server-side pagination. |
||
37 | * default: `false` |
||
38 | |||
39 | ## Column options |
||
40 | |||
41 | ### filterControl |
||
42 | |||
43 | * type: String |
||
44 | * description: Set `input`: show an input control, `select`: show a select control, `datepicker`: show a datepicker control. |
||
45 | * default: `undefined` |
||
46 | |||
47 | ### filterData |
||
48 | |||
49 | * type: String |
||
50 | * description: Set custom select filter values, use `var:variable` to load from a variable or `url:http://www.example.com/data.json` to load from a remote json file or `jso:{key:data}` to load from a json string. |
||
51 | * default: `undefined` |
||
52 | |||
53 | ### filterDatepickerOptions |
||
54 | * type: Object |
||
55 | * description: If the datepicker option is set use this option to configure the datepicker with the native options. Use this way: `data-filter-datepicker-options='{"autoclose":true, "clearBtn": true, "todayHighlight": true}'`. |
||
56 | * default: `undefined` |
||
57 | |||
58 | ### filterStrictSearch |
||
59 | * type: Boolean |
||
60 | * description: Set to true if you want to use the strict search mode. |
||
61 | * default: `false` |
||
62 | |||
63 | ### filterStartsWithSearch |
||
64 | * type: Boolean |
||
65 | * description: Set to true if you want to use the starts with search mode. |
||
66 | * default: `false` |
||
67 | |||
68 | ### filterControlPlaceholder |
||
69 | * type: String |
||
70 | * description: Set this in order to show a placeholder only in the input filter control. |
||
71 | * default: `` |
||
72 | |||
73 | ### Icons |
||
74 | * clear: 'glyphicon-trash icon-clear' |
||
75 | |||
76 | ## Locale |
||
77 | |||
78 | ### formatClearFilters |
||
79 | * type: Function |
||
80 | * default: `function () { return "Clear Filters";}` |
||
81 | |||
82 | ## Events |
||
83 | |||
84 | ### onColumnSearch(column-search.bs.table) |
||
85 | |||
86 | * Fired when we are searching into the column data |