Add custom filter field to jQuery Datatable

Question

I am using a custom filter by using external form, like in this link. However, I can't create my custom filter field even I try adding similar code to the index.html page.

here is my additional filter column:

<div id="renderingEngineFilter" class="filterOption"></div>
<div id="browserFilter" class="filterOption"></div>
<div id="platformsFilter" class="filterOption"></div>
<div id="engineVersionFilter" class="filterOption range"></div>
<div id="cssGradeFilter" class="filterOption"></div>
<div id="customFilter"></div> <!-- this one -->

and I add it to my jQuery function like this:

$(document).ready( function () {
    $('#example').dataTable({
        "bJQueryUI": true,
        "sPaginationType": "full_numbers"
    })
    .columnFilter({
        aoColumns: [
            { type:"select", sSelector: "#renderingEngineFilter" },
            { sSelector: "#browserFilter" },
            { sSelector: "#platformsFilter" },
            { type:"number-range", sSelector: "#engineVersionFilter" },
            { type:"select", values : ["A", "B", "C", "X"], sSelector: "#cssGradeFilter" },
            { type:"select", values : ["vannkorn", "ravy", "rayuth"], sSelector: "#customFilter"}    //here is where I add it
        ]
    });
});

Unfortunately, It does not show this custom field. Please help.

codeandcloud · Accepted Answer · 2012-05-28 11:06:54Z

1

This is because your table, I am sure only has 5 columns and so you cannot apply a sixth filter there. If you look closely you can see that the columnFilter is done at aoColumns

answered May 28, 2012 at 11:06

codeandcloud

55.5k47 gold badges169 silver badges259 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Add custom filter field to jQuery Datatable

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related