Add Show Columns Table example.

docs/data3.json

@@ -0,0 +1,191 @@
+[
+    {
+        "id": 0,
+        "name": "test0",
+        "price": "$0",
+        "column1": "c10",
+        "column2": "c20",
+        "column3": "c30",
+        "column4": "c40"
+    },
+    {
+        "id": 1,
+        "name": "test1",
+        "price": "$1",
+        "column1": "c10",
+        "column2": "c20",
+        "column3": "c30",
+        "column4": "c40"
+    },
+    {
+        "id": 2,
+        "name": "test2",
+        "price": "$2",
+        "column1": "c10",
+        "column2": "c20",
+        "column3": "c30",
+        "column4": "c40"
+    },
+    {
+        "id": 3,
+        "name": "test3",
+        "price": "$3",
+        "column1": "c10",
+        "column2": "c20",
+        "column3": "c30",
+        "column4": "c40"
+    },
+    {
+        "id": 4,
+        "name": "test4",
+        "price": "$4",
+        "column1": "c10",
+        "column2": "c20",
+        "column3": "c30",
+        "column4": "c40"
+    },
+    {
+        "id": 5,
+        "name": "test5",
+        "price": "$5",
+        "column1": "c10",
+        "column2": "c20",
+        "column3": "c30",
+        "column4": "c40"
+    },
+    {
+        "id": 6,
+        "name": "test6",
+        "price": "$6",
+        "column1": "c10",
+        "column2": "c20",
+        "column3": "c30",
+        "column4": "c40"
+    },
+    {
+        "id": 7,
+        "name": "test7",
+        "price": "$7",
+        "column1": "c10",
+        "column2": "c20",
+        "column3": "c30",
+        "column4": "c40"
+    },
+    {
+        "id": 8,
+        "name": "test8",
+        "price": "$8",
+        "column1": "c10",
+        "column2": "c20",
+        "column3": "c30",
+        "column4": "c40"
+    },
+    {
+        "id": 9,
+        "name": "test9",
+        "price": "$9",
+        "column1": "c10",
+        "column2": "c20",
+        "column3": "c30",
+        "column4": "c40"
+    },
+    {
+        "id": 10,
+        "name": "test10",
+        "price": "$10",
+        "column1": "c10",
+        "column2": "c20",
+        "column3": "c30",
+        "column4": "c40"
+    },
+    {
+        "id": 11,
+        "name": "test11",
+        "price": "$11",
+        "column1": "c10",
+        "column2": "c20",
+        "column3": "c30",
+        "column4": "c40"
+    },
+    {
+        "id": 12,
+        "name": "test12",
+        "price": "$12",
+        "column1": "c10",
+        "column2": "c20",
+        "column3": "c30",
+        "column4": "c40"
+    },
+    {
+        "id": 13,
+        "name": "test13",
+        "price": "$13",
+        "column1": "c10",
+        "column2": "c20",
+        "column3": "c30",
+        "column4": "c40"
+    },
+    {
+        "id": 14,
+        "name": "test14",
+        "price": "$14",
+        "column1": "c10",
+        "column2": "c20",
+        "column3": "c30",
+        "column4": "c40"
+    },
+    {
+        "id": 15,
+        "name": "test15",
+        "price": "$15",
+        "column1": "c10",
+        "column2": "c20",
+        "column3": "c30",
+        "column4": "c40"
+    },
+    {
+        "id": 16,
+        "name": "test16",
+        "price": "$16",
+        "column1": "c10",
+        "column2": "c20",
+        "column3": "c30",
+        "column4": "c40"
+    },
+    {
+        "id": 17,
+        "name": "test17",
+        "price": "$17",
+        "column1": "c10",
+        "column2": "c20",
+        "column3": "c30",
+        "column4": "c40"
+    },
+    {
+        "id": 18,
+        "name": "test18",
+        "price": "$18",
+        "column1": "c10",
+        "column2": "c20",
+        "column3": "c30",
+        "column4": "c40"
+    },
+    {
+        "id": 19,
+        "name": "test19",
+        "price": "$19",
+        "column1": "c10",
+        "column2": "c20",
+        "column3": "c30",
+        "column4": "c40"
+    },
+    {
+        "id": 20,
+        "name": "test20",
+        "price": "$20",
+        "column1": "c10",
+        "column2": "c20",
+        "column3": "c30",
+        "column4": "c40"
+    }
+]

docs/examples.html

@@ -63,6 +63,7 @@
                     <li><a href="#custom-sort-table">Custom Sort Table</a></li>
                     <li><a href="#format-table">Format Table</a></li>
                     <li><a href="#hide-header-table">Hide Header Table</a></li>
+                    <li><a href="#show-columns-table">Show Columns Table</a></li>
                     <li><a href="#radio-table">Radio Table</a></li>
                     <li><a href="#checkbox-table">Checkbox Table</a></li>
                     <li><a href="#pagination-table">Pagination Table</a></li>
@@ -262,6 +263,29 @@
 
             <div>
                 <div class="page-header">
+                    <h1 id="show-columns-table">Show Columns Table</h1>
+                </div>
+                <div class="bs-example">
+                    <table data-toggle="table" data-url="data3.json" data-height="246" data-show-columns="true">
+                        <thead>
+                        <tr>
+                            <th data-field="state" data-radio="true"></th>
+                            <th data-field="id">ID</th>
+                            <th data-field="name">Name</th>
+                            <th data-field="price">Price</th>
+                            <th data-field="column1">Columns1</th>
+                            <th data-field="column2" data-visible="false">Columns2</th>
+                            <th data-field="column3">Columns3</th>
+                            <th data-field="column4" data-visible="false">Columns4</th>
+                        </tr>
+                        </thead>
+                    </table>
+                </div>
+                <div class="highlight"><pre><code class="language-html"></code></pre></div>
+            </div>
+
+            <div>
+                <div class="page-header">
                     <h1 id="radio-table">Radio Table</h1>
                 </div>
                 <div class="bs-example">