mirror of
https://github.com/koalyptus/TableFilter.git
synced 2024-06-08 17:02:30 +02:00
Updated 3.3 Filters visibility (markdown)
koalyptus
parent
f335c750ff
commit
2ae8d3543f
|
|
@ -1,2 +1,221 @@
|
|||
<p>To get the <code>filtersVisibility</code> extension instance:</p>
|
||||
<pre>var colOps = myTF.getExtension('filtersVisibility');</pre>
|
||||
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Property</th>
|
||||
<th>Type</th>
|
||||
<th>Description</th>
|
||||
<th>Remarks</th>
|
||||
<th>Example</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<th>target_id</th>
|
||||
<td>string</td>
|
||||
<td>defines the id of the container element that will contain the link/button showing / hiding filters row (default - null)</td>
|
||||
<td></td>
|
||||
<td>
|
||||
<code>var tfConfig = {
|
||||
extensions: [{
|
||||
name: 'filtersVisibility',
|
||||
target_id: 'my_container_id'
|
||||
}]
|
||||
};</code>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>enable_icon</th>
|
||||
<td>boolean</td>
|
||||
<td>enable/disable default icon placed just before the link (default - true)</td>
|
||||
<td></td>
|
||||
<td>
|
||||
<code>var tfConfig = {
|
||||
extensions: [{
|
||||
name: 'filtersVisibility',
|
||||
enable_icon: false
|
||||
}]
|
||||
};</code>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>btn_text</th>
|
||||
<td>string</td>
|
||||
<td>sets the text of the link showing / hiding filters row (default - '')</td>
|
||||
<td></td>
|
||||
<td>
|
||||
<code>var tfConfig = {
|
||||
extensions: [{
|
||||
name: 'filtersVisibility',
|
||||
btn_text: 'Filters'
|
||||
}]
|
||||
};</code>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>btn_html</th>
|
||||
<td>string</td>
|
||||
<td>defines the HTML of the button showing / hiding filters row (default - null) </td>
|
||||
<td>note that the <code>onclick</code> event is added automatically to the html element and may overwrite any associated click event</td>
|
||||
<td>
|
||||
<code>var tfConfig = {
|
||||
extensions: [{
|
||||
name: 'filtersVisibility',
|
||||
btn_html: '<button>Filters</button>'
|
||||
}]
|
||||
};</code>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>btn_css_class</th>
|
||||
<td>string</td>
|
||||
<td>defines the css class of the link showing / hiding filters row (default - 'btnExpClpFlt')</td>
|
||||
<td></td>
|
||||
<td>
|
||||
<code>var tfConfig = {
|
||||
extensions: [{
|
||||
name: 'filtersVisibility',
|
||||
btn_css_class: 'my-css-class'
|
||||
}]
|
||||
};</code>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>cont_css_class</th>
|
||||
<td>string</td>
|
||||
<td>defines the css class of the container (default - 'expClpFlt')</td>
|
||||
<td></td>
|
||||
<td>
|
||||
<code>var tfConfig = {
|
||||
extensions: [{
|
||||
name: 'filtersVisibility',
|
||||
cont_css_class: 'my-css-class'
|
||||
}]
|
||||
};</code>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>filters_row_index</th>
|
||||
<td>number</td>
|
||||
<td>Only with external filters, it specifies which row contains the filters (default - 1)</td>
|
||||
<td></td>
|
||||
<td>
|
||||
<code>var tfConfig = {
|
||||
grid_layout: true,
|
||||
extensions: [{
|
||||
name: 'filtersVisibility',
|
||||
filters_row_index: 0
|
||||
}]
|
||||
};</code>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>visible_at_start</th>
|
||||
<td>boolean</td>
|
||||
<td>Set filters row visibility at start</td>
|
||||
<td></td>
|
||||
<td>
|
||||
<code>var tfConfig = {
|
||||
extensions: [{
|
||||
name: 'filtersVisibility',
|
||||
visible_at_start: false
|
||||
}]
|
||||
};</code>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>on_before_show</th>
|
||||
<td>function</td>
|
||||
<td>callback fired before the filters' row is displayed</td>
|
||||
<td>
|
||||
1 parameter:
|
||||
<ul>
|
||||
<li>
|
||||
o is the current TableFilter instance
|
||||
</li>
|
||||
</ul>
|
||||
</td>
|
||||
<td>
|
||||
<code>var tfConfig = {
|
||||
extensions: [{
|
||||
name: 'filtersVisibility',
|
||||
on_before_show: function(o) {
|
||||
console.log(o.id);
|
||||
}
|
||||
}]
|
||||
};</code>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>on_after_show</th>
|
||||
<td>function</td>
|
||||
<td>callback fired after filters' row is displayed</td>
|
||||
<td>
|
||||
1 parameter:
|
||||
<ul>
|
||||
<li>
|
||||
o is the current TableFilter instance
|
||||
</li>
|
||||
</ul>
|
||||
</td>
|
||||
<td>
|
||||
<code>var tfConfig = {
|
||||
extensions: [{
|
||||
name: 'filtersVisibility',
|
||||
on_after_show: function(o) {
|
||||
console.log(o.id);
|
||||
}
|
||||
}]
|
||||
};</code>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>on_before_hide</th>
|
||||
<td>function</td>
|
||||
<td>callback fired before the filters' row is hidden</td>
|
||||
<td>
|
||||
1 parameter:
|
||||
<ul>
|
||||
<li>
|
||||
o is the current TableFilter instance
|
||||
</li>
|
||||
</ul>
|
||||
</td>
|
||||
<td>
|
||||
<code>var tfConfig = {
|
||||
extensions: [{
|
||||
name: 'filtersVisibility',
|
||||
on_before_hide: function(o) {
|
||||
console.log(o.id);
|
||||
}
|
||||
}]
|
||||
};</code>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>on_after_hide</th>
|
||||
<td>function</td>
|
||||
<td>callback fired after the filters' row is hidden</td>
|
||||
<td>
|
||||
1 parameter:
|
||||
<ul>
|
||||
<li>
|
||||
o is the current TableFilter instance
|
||||
</li>
|
||||
</ul>
|
||||
</td>
|
||||
<td>
|
||||
<code>var tfConfig = {
|
||||
extensions: [{
|
||||
name: 'filtersVisibility',
|
||||
on_after_hide: function(o) {
|
||||
console.log(o.id);
|
||||
}
|
||||
}]
|
||||
};</code>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
|
|
|
|||
Loading…
Reference in a new issue