Filtering on click

[tduchateau]

Hi Daniel,

Do you have any idea about how I could change the default behaviour of filtering on keyup and replace it by a click?
The goal is to delegate the action of filtering to an extra button, as shown is the following example:

Regards,
Thibault

[vedmack]

Doesn't look too intuitive (IMO), at least not when the filter is located above the column (maybe if it was in far away form/location it would make more sense). Can't think about something right now, will comment again later on

[vedmack]

I guess that a new property can be added, something like 'externally_triggered' that will remove the filter action from the filters and you will use the exFilterColumn later on.

[tduchateau]

Doesn't look too intuitive (IMO), at least not when the filter is located above the column

Absolutely. Much more intuitive when using an external form.

To go a bit further, what do you think of a exFilterAllColumns as exResetAllFilters? It would be used as a shortcut for multiple calls of exFilterColumn, one for each filtered column.

[vedmack]

exFilterColumn can already handle filtering multiple columns at once, see docs https://github.com/vedmack/yadcf/blob/master/lab/jquery.dataTables.yadcf.js#L186

[tduchateau]

exFilterColumn can already handle filtering multiple columns at once, see docs https://github.com/vedmack/yadcf/blob/master/lab/jquery.dataTables.yadcf.js#L186

Indeed! Thanks!

Looking forward the externally_triggered option :-)

[tduchateau]

Hi Daniel,

Any update on this one? Or any idea when do you plan to work on it?

[vedmack]

Hopefully in the following days, after current version will go final. so just to be sure I got you, you are planning to place bunch of filters into some form and let the user to play with them and them user has to click so button "filter now" and only then the table will get filtered based on the values in the filters?

[tduchateau]

Hopefully in the following days, after current version will go final

Great!

so just to be sure I got you, you are planning to place bunch of filters into some form and let the user to play with them and them user has to click so button "filter now" and only then the table will get filtered based on the values in the filters?

Absolutely.
If it can be of any help, the fork of jquery-datatables-column-filter I've used so far lives here: https://github.com/tduchateau/jquery-datatables-column-filter/.

Note:

• the sPlaceHolder parameter, that can be set to none, meaning that filtering controls are external. See here: https://github.com/tduchateau/jquery-datatables-column-filter/blob/master/media/js/jquery.dataTables.columnFilter.js#L17
• the sFilteringTrigger parameter which is used to bound keyup events only if its value equals "immediate"
• the data-column-name attribute added on all filtering controls, then used by the legacy fnMultiFilter plugin so that all columns can be filtered in one call depending on values set in the filtering controls (or cleared thanks to fnFilterClear)

Hope it helps!

[tduchateau]

And to be more visual...

[vedmack]

Just saying that there wont be individual reset buttons for filters when you will use the externally_triggered mode and... externally_triggered will be applied to all filters, you wont be able to mix filters that will work as normal and some that will be triggered externally , what do you think?
p.s this will be the next feature that I'll add to yadcf

[tduchateau]

Just saying that there wont be individual reset buttons for filters when you will use the externally_triggered mode and... externally_triggered will be applied to all filters, you wont be able to mix filters that will work as normal and some that will be triggered externally , what do you think?

Makes a lot of sense to me.

p.s this will be the next feature that I'll add to yadcf

<3

[vedmack]

Working on it, till now added to select / multi_select / text / auto_complete , you can see it on http://yadcf-showcase.appspot.com/dom_source_externally_triggered.html

[tduchateau]

Looks great Daniel!
I'm giving a try with the v0.8.8.beta.3 and encountering an issue with yadcf.exFilterExternallyTriggered(oTable_myTableId);.
While debugging, I realized that the selector property is null in:

function exFilterExternallyTriggered(table_arg) {
    var columnsObj = getOptions(table_arg.selector)
    ...
}

Any idea?

Note that the exFilterExternallyTriggered is bound to a link using .click( handler ):

var oTable_myTableId;
var oTable_myTableId_params = {
    "dom": "l0rtip",
    "columns": [{
        "defaultContent": "",
        "name": "id",
        "data": "id"
    }, {
        "defaultContent": "",
        "name": "firstName",
        "data": "firstName"
    }, {
        "defaultContent": "",
        "name": "lastName",
        "data": "lastName"
    }, {
        "defaultContent": "",
        "name": "city",
        "data": "address.town.name"
    }, {
        "defaultContent": "",
        "name": "mail",
        "data": "mail"
    }],
    "processing": true
};
$(document).ready(function() {
    $.fn.dataTable.ext.feature.push({
        "fnInit": function(settings) {
            var container = document.createElement('div');
            $(container).attr('style', 'float:right;');
            $(container).html('<a id="filterButton" class="btn btn-primary">Apply filters</a>            <a id="filterClearButton" class="btn btn-inverse">Clear filters</a>');
            return container;
        },
        "cFeature": "0",
        "sFeature": "Group0"
    });
    oTable_myTableId = $('#myTableId').DataTable(oTable_myTableId_params);
    yadcf.init(oTable_myTableId, [{
        "externally_triggered": true,
        "column_number": 1,
        "filter_type": "select"
    }, {
        "externally_triggered": true,
        "column_number": 2,
        "filter_type": "text"
    }, {
        "externally_triggered": true,
        "column_number": 3,
        "filter_type": "text"
    }], 'header');
    $('#filterButton').click(function() {
        yadcf.exFilterExternallyTriggered(oTable_myTableId);
    });
    $('#filterClearButton').click(function() {
        yadcf.exResetAllFilters(oTable_myTableId);
    });
});

[vedmack]

that issue should be solved in 0.8.8.beta.4

[tduchateau]

It's working great with the v0.8.8.beta.4.
Tested using a DOM source and only with select and text filter types.

Now I'm encountering another issue with an AJAX source which contains a null object. Actually the exact same issue as #113. Let me try to provide an example...

[vedmack]

I haven't tuned this feature for ajax yet, so I think you better delay your tests on ajax

[tduchateau]

Alright! (but still trying to provide an example :-))

[vedmack]

Should work now for all filter types with dom/ajax/server... let me know how it goes for you... only thing left is to make a better looking showcase page - will pull the filters out of the table into some form...

[tduchateau]

Thanks Daniel. I'll test it as soon as I can and get back to you.

[vedmack]

Actually I forgot that I planned to move the externally_triggered into the table init function instead of setting it for each column (so you better test it after I do that)

[vedmack]

externally_triggered can be set for yadcf constructor /init (and not per column) , see showcase http://yadcf-showcase.appspot.com/dom_source_externally_triggered.html

[tduchateau]

You mean now it can be set using both the constructor and column definitions?
Using constructor init is like a shortcut right?

[vedmack]

Yep

[vedmack]

Updated the showcase externally triggered page a bit