CODEWITHSUNDEEP
javascriptjquerydatatablesyadcf
mistaq
mistaq

Reputation: 385

YADCF - filtering using hidden columns

Going through this jsFiddle, I wanted to know the YADCF equivalent of hidden columns, as shown in use for the standard DataTables, to enable for filtering from hidden columns (DataTable's targets seems to be equivalent to YADCF's column number).

Below is the code I have for a table where I want to hide the first column, yet still allow filtering from it.

$(document).ready(function() {
  'use strict';
  var foodTable = $('#foodTable').DataTable({
  });
  yadcf.init(foodTable, [{
      column_number: 0,
      filter_type: "select",
      visible: "false"
    },
    {
      column_number: 1,
      filter_type: "select"
    }
  ], {
    cumulative_filtering: true,
  });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdn.datatables.net/1.10.15/js/jquery.dataTables.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/yadcf/0.9.1/jquery.dataTables.yadcf.js"></script>
<table id="foodTable">
  <thead>
    <tr>
      <th>Category</th>
      <th>Type</th>
      <th>Subtype</th>
      <th>Comments</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>Fruit</td>
      <td>Apple</td>
      <td>Fuji</td>
      <td>Very sweet apple</td>
    </tr>
    <tr>
      <td>Vegetable</td>
      <td>Pumpkin</td>
      <td>Butternut</td>
      <td>Very fibrous pumpkin</td>
    </tr>
  </tbody>
</table>

Upvotes: 1

Views: 1074

Answers (1)

Daniel
Daniel

Reputation: 37061

You should place the filter of the hidden column out side of the table, for that purpose you can use filter_container_id (read docs)

for example

yadcf.init(oTable, [{
    column_number: 0,
    filter_container_id: "myId",
    column_data_type: "html",
    filter_type: "multi_select"
},{
    column_number: 1,
    filter_type: "multi_select"
}], "footer");

See working jsfiddle

<div id="myId">
</div>

As to the cumulative_filtering you should use more recent version of yadcf (see change log)

Upvotes: 1

Related Questions