mirror of
https://github.com/koalyptus/TableFilter.git
synced 2024-05-21 15:56:40 +02:00
Update index.html
This commit is contained in:
parent
04fb9ad44e
commit
f82a63f32d
413
index.html
413
index.html
|
@ -2,419 +2,8 @@
|
|||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<title>Home | TableFilter</title>
|
||||
|
||||
<!-- Bootstrap core CSS -->
|
||||
<link rel="stylesheet" href="assets/css/bootstrap.min.css">
|
||||
|
||||
<!-- Bootstrap theme -->
|
||||
<link href="assets/css/bootstrap-theme.min.css" rel="stylesheet">
|
||||
|
||||
<!-- Custom styles for this template -->
|
||||
<link href="assets/css/theme.css" rel="stylesheet">
|
||||
|
||||
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
|
||||
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
|
||||
<!--[if lt IE 9]>
|
||||
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
|
||||
<script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
|
||||
<![endif]-->
|
||||
<meta http-equiv="refresh" content="0;URL='https://www.tablefilter.com'" >
|
||||
</head>
|
||||
<body>
|
||||
|
||||
|
||||
<!-- Fixed navbar -->
|
||||
<div class="navbar navbar-inverse navbar-fixed-top" role="navigation">
|
||||
<div class="container">
|
||||
<div class="navbar-header">
|
||||
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
|
||||
<span class="sr-only">Toggle navigation</span>
|
||||
<span class="icon-bar"></span>
|
||||
<span class="icon-bar"></span>
|
||||
<span class="icon-bar"></span>
|
||||
</button>
|
||||
<a class="navbar-brand" href="./">TableFilter</a>
|
||||
</div>
|
||||
<div class="navbar-collapse collapse">
|
||||
<ul class="nav navbar-nav">
|
||||
<!-- you can exclude pages using {{#isnt}} helper: {{#isnt data.title 'Blog'}} -->
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<li>
|
||||
<a href="examples.html">Examples</a>
|
||||
</li>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
</ul>
|
||||
|
||||
<ul class="nav navbar-nav navbar-right">
|
||||
<li class="dropdown">
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Github <b class="caret"></b></a>
|
||||
<ul class="dropdown-menu">
|
||||
<li>
|
||||
<a href="https://github.com/koalyptus/TableFilter">Repo</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="https://github.com/koalyptus/TableFilter/wiki">Wiki</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./docs" target="_blank">Docs</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div><!--/.nav-collapse -->
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="container theme-showcase" role="main">
|
||||
|
||||
|
||||
|
||||
|
||||
<p><a href="https://travis-ci.org/koalyptus/TableFilter"><img src="https://api.travis-ci.org/koalyptus/TableFilter.svg?branch=master" alt="Build Status"></a>
|
||||
<a href="https://koalyptus.github.io/TableFilter/docs/source.html"><img src="https://koalyptus.github.io/TableFilter/docs/badge.svg" alt="Document"></a>
|
||||
<a href="https://codecov.io/gh/koalyptus/TableFilter"><img src="https://codecov.io/gh/koalyptus/TableFilter/branch/master/graph/badge.svg" alt="codecov"></a>
|
||||
<a href="https://greenkeeper.io/"><img src="https://badges.greenkeeper.io/koalyptus/TableFilter.svg" alt="Greenkeeper badge"></a></p>
|
||||
<h1 id="tablefilter">TableFilter</h1>
|
||||
<blockquote>
|
||||
<p>A Javascript library making HTML tables filterable</p>
|
||||
</blockquote>
|
||||
<p>TableFilter is a modernised version of the <a href="http://tablefilter.free.fr">HTML Table Filter generator</a> javascript plugin.
|
||||
This library adds to any html table a "filter by column" feature that enables
|
||||
users to filter and limit the data displayed within a long table. By default, the script automatically adds a filter grid bar at the top of the desired table.</p>
|
||||
<h2 id="features">Features</h2>
|
||||
<ul>
|
||||
<li>Convert a regular HTML table into an advanced grid component providing:<ul>
|
||||
<li>Advanced columns filtering model</li>
|
||||
<li>Sorting and pagination capabilities</li>
|
||||
<li>Complete selection model (<a href="http://codecanyon.net/item/ezedittable-enhance-html-tables/2425123?ref=koalyptus">ezEditTable</a> extension)</li>
|
||||
<li>Extended keyboard navigation (<a href="http://codecanyon.net/item/ezedittable-enhance-html-tables/2425123?ref=koalyptus">ezEditTable</a> extension)</li>
|
||||
<li>Inline cell or row editing (<a href="http://codecanyon.net/item/ezedittable-enhance-html-tables/2425123?ref=koalyptus">ezEditTable</a> extension)</li>
|
||||
<li>Row insertion or deleting (<a href="http://codecanyon.net/item/ezedittable-enhance-html-tables/2425123?ref=koalyptus">ezEditTable</a> extension)</li>
|
||||
<li>And even more features...</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li>Attach to an existing HTML table</li>
|
||||
<li>Integration with any server-side technology as this is a pure client-side
|
||||
solution</li>
|
||||
<li>Exhaustive documentation and poweful API</li>
|
||||
</ul>
|
||||
<h2 id="getting-started">Getting started</h2>
|
||||
<ul>
|
||||
<li><p>Clone the repo using Git:</p>
|
||||
<pre><code class="language-shell">git clone https://github.com/koalyptus/TableFilter.git</code></pre>
|
||||
</li>
|
||||
<li><p>You can <a href="https://github.com/koalyptus/TableFilter/archive/master.zip">download</a> this repository.</p>
|
||||
</li>
|
||||
<li><p>TableFilter is available on <a href="https://www.npmjs.com/package/tablefilter">npm repository</a>, you can install it from the command line using the following command:</p>
|
||||
<pre><code class="language-shell">npm install tablefilter --save-dev</code></pre>
|
||||
</li>
|
||||
<li>or get the future features from the <code>next</code> release channel:<pre><code class="language-shell">npm install tablefilter@next --save-dev</code></pre>
|
||||
</li>
|
||||
<li>Alternatively you can also <a href="https://unpkg.com/tablefilter/">access these files from unpkg CDN</a>, download them or point your package manager to them.</li>
|
||||
</ul>
|
||||
<h2 id="setup">Setup</h2>
|
||||
<h3 id="using-modules">Using modules</h3>
|
||||
<p>Require <code>TableFilter</code>:</p>
|
||||
<pre><code class="language-javascript"><span class="comment">// ES2015 modules</span>
|
||||
import TableFilter from <span class="string">'tablefilter'</span>;
|
||||
|
||||
<span class="comment">// CommonJS or AMD modules</span>
|
||||
<span class="keyword">var</span> TableFilter = require(<span class="string">'tablefilter'</span>);</code></pre>
|
||||
<h3 id="using-distribution-scripts">Using distribution scripts</h3>
|
||||
<p>If you are not using a module system, you can reference the distribution scripts directly in your html pages:</p>
|
||||
<pre><code class="language-html"><script src="path_to/node_modules/tablefilter/dist/tablefilter/tablefilter.js"></script></code></pre>
|
||||
<h3 id="placing-manually-the-distribution-scripts-in-your-project">Placing manually the distribution scripts in your project</h3>
|
||||
<p>Copy the <code>tablefilter</code> directory under <code>dist</code> and place it at desired location in your project. Then include the main js file in your page:</p>
|
||||
<pre><code class="language-shell"><script src="path/to/my/scripts/tablefilter/tablefilter.js"></script></code></pre>
|
||||
<h3 id="usage">Usage</h3>
|
||||
<p>Place the following snippet just under the HTML table and always define a <code>base_path</code> property in the configuration object to reflect the path to the script</p>
|
||||
<pre><code class="language-shell"><script>
|
||||
var tf = new TableFilter(document.querySelector('.my-table'), {
|
||||
base_path: 'path/to/my/scripts/tablefilter/'
|
||||
});
|
||||
tf.init();
|
||||
</script></code></pre>
|
||||
<p>If the <code>base_path</code> property is not specified, it will default to <code>/tablefilter</code> directory:</p>
|
||||
<pre><code class="language-shell">your-page.html
|
||||
|— tablefilter</code></pre>
|
||||
<h2 id="development">Development</h2>
|
||||
<p>This project requires node.js and Grunt to be installed:</p>
|
||||
<ul>
|
||||
<li>install <a href="https://nodejs.org/">node.js</a></li>
|
||||
<li>install <a href="http://gruntjs.com/getting-started">Grunt</a> from the command line using npm (comes with node.js):<pre><code class="language-shell">npm install -g grunt-cli</code></pre>
|
||||
Once <code>Grunt</code> is sorted out you can follow the instructions below.
|
||||
Start by installing any dependencies.</li>
|
||||
</ul>
|
||||
<pre><code class="language-shell">npm install</code></pre>
|
||||
<p>Use</p>
|
||||
<pre><code class="language-shell">npm run dev</code></pre>
|
||||
<p>command to launch a build / watch cycle and start the local
|
||||
sever on port <code>8080</code>.</p>
|
||||
<p>Use</p>
|
||||
<pre><code class="language-shell">npm run build</code></pre>
|
||||
<p>command to generate a production build.</p>
|
||||
<p>The</p>
|
||||
<pre><code class="language-shell">npm run dist</code></pre>
|
||||
<p>command will create a production build, run the tests and finally generate
|
||||
the demos:</p>
|
||||
<p>To run all the tests and generate the coverage report:</p>
|
||||
<pre><code class="language-shell">npm test</code></pre>
|
||||
<p>or to run specific test(s):</p>
|
||||
<pre><code class="language-shell">grunt test-only:test.html
|
||||
grunt test-only:test.html,test-sort.html</code></pre>
|
||||
<p>to view the coverage report(s), open the <code>index.html</code> under the
|
||||
<code>report/coverage</code> folder or
|
||||
<a href="https://codecov.io/gh/koalyptus/TableFilter">online</a>.</p>
|
||||
<h2 id="demos">Demos</h2>
|
||||
<p>Check out the online <a href="http://koalyptus.github.io/TableFilter/examples">examples</a>
|
||||
or generate the demos locally:</p>
|
||||
<pre><code class="language-shell">npm run build:demos</code></pre>
|
||||
<p>then run the local webserver:</p>
|
||||
<pre><code class="language-shell">npm start</code></pre>
|
||||
<p>then pick a demo from:</p>
|
||||
<pre><code class="language-shell">http://localhost:8080/demos/</code></pre>
|
||||
<h2 id="documentation">Documentation</h2>
|
||||
<p>Find exhaustive documentation on the configuration options in the <a href="https://github.com/koalyptus/TableFilter/wiki">WIKI</a> section.</p>
|
||||
<p>Autogenerated documentation of the ES6 modules is available on the website: <a href="http://koalyptus.github.io/TableFilter/docs">docs</a></p>
|
||||
<p>If you previously used the HTML Table Filter Generator plugin, verify the configuration
|
||||
options you are using are still supported: <a href="https://github.com/koalyptus/TableFilter/wiki/Obsolete">Obsolete</a></p>
|
||||
<p>Run this task to generate the documentation in the <code>docs/docs</code> directory:</p>
|
||||
<pre><code class="language-shell">npm run esdoc</code></pre>
|
||||
<h2 id="support">Support</h2>
|
||||
<ul>
|
||||
<li>GitHub for <a href="https://github.com/koalyptus/TableFilter/blob/master/CONTRIBUTING.md#reporting-bugs">reporting bugs</a> and <a href="https://github.com/koalyptus/TableFilter/blob/master/CONTRIBUTING.md#suggesting-enhancements-and-features">feature requests</a>.</li>
|
||||
</ul>
|
||||
<h2 id="license">License</h2>
|
||||
<p><a href="LICENSE">MIT</a></p>
|
||||
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
<nav class="navbar navbar-default navbar-bottom">
|
||||
<div class="container">
|
||||
<ul class="nav navbar-nav">
|
||||
<li>
|
||||
<a href="https://github.com/koalyptus/TableFilter">Repo</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="https://github.com/koalyptus/TableFilter/wiki">Wiki</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./docs" target="_blank">Docs</a>
|
||||
</li>
|
||||
</ul>
|
||||
<ul class="nav navbar-nav navbar-right">
|
||||
<li>
|
||||
<p>
|
||||
<form action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_blank">
|
||||
<input type="hidden" name="cmd" value="_donations">
|
||||
<input type="hidden" name="business" value="maxgug@hotmail.com">
|
||||
<input type="hidden" name="lc" value="BM">
|
||||
<input type="hidden" name="item_name" value="TableFilter">
|
||||
<input type="hidden" name="no_note" value="0">
|
||||
<input type="hidden" name="currency_code" value="USD">
|
||||
<input type="hidden" name="bn" value="PP-DonationsBF:btn_donate_LG.gif:NonHosted">
|
||||
<input type="image" src="https://www.paypalobjects.com/en_US/i/btn/btn_donate_LG.gif" border="0" name="submit" alt="PayPal - The safer, easier way to pay online!">
|
||||
<img alt="" border="0" src="https://www.paypalobjects.com/en_AU/i/scr/pixel.gif" width="1" height="1">
|
||||
</form>
|
||||
</p>
|
||||
</li>
|
||||
<li>
|
||||
|
||||
<a href="https://flattr.com/submit/auto?user_id=koalyptus&
|
||||
url=https%3A%2F%2Fgithub.com%2Fkoalyptus%2FTablefilter">
|
||||
<img src="https://api.flattr.com/button/flattr-badge-large.png"
|
||||
alt="TableFilter - A Javascript library making HTML tables filterable
|
||||
and a bit more" />
|
||||
</a>
|
||||
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
|
||||
<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
|
||||
<script src="https://code.jquery.com/jquery.min.js"></script>
|
||||
<!-- Include all compiled plugins (below), or include individual files as needed -->
|
||||
<script src="assets/js/bootstrap.min.js"></script>
|
||||
|
||||
<script src="assets/js/github-fork-me.js"></script>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<!--
|
||||
DO NOT COPY: NOT PART OF TABLEFILTER
|
||||
-->
|
||||
<link rel="stylesheet" href="assets/js/highlight/styles/monokai-sublime.css">
|
||||
<script src="assets/js/highlight/highlight.pack.js"></script>
|
||||
<script>hljs.initHighlightingOnLoad();</script>
|
||||
<!-- -->
|
||||
|
||||
|
||||
<script type="text/javascript"
|
||||
src="//s7.addthis.com/js/300/addthis_widget.js#pubid=maxgug"
|
||||
async="async"></script>
|
||||
|
||||
<script>
|
||||
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
|
||||
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
|
||||
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
|
||||
})(window,document,'script','//www.google-analytics.com/analytics.js','ga');
|
||||
|
||||
ga('create', 'UA-68429903-1', 'auto');
|
||||
ga('send', 'pageview');
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
Loading…
Reference in a new issue