Custom HTML in filter-widget created tr?

[Nadoedalo]

Can I somehow add custom html in js-generated tr? Or disable that generation and use pre-generated filter inputs that will be just handled after initialize?
Basic thing that I want is to have mass delete records from row, that will be new collumn with 'Actions' label, the next - width actually actions and the data will go with checkboxes.
Have seen of how to change input to select, but I want to have set of my buttons instead, that will have actually no use for the filtering.
I know that I can replace content afterwards with js, but having more flexible tool is always better than having lots of fixes.

[Mottie]

Hi @Nadoedalo!

I'm really not sure what you're asking. Do you want to add a new header custom header row? Did you want to use the filter input at all? Or just modify the contents of one cell? Maybe some code or something to help me conceptualize what you want would help.

[Nadoedalo]

Sorry for not very clear message - its end of the day and english is not my native. And yes, hi @Mottie and everyone.

I want to have my custom controls, like it was done for sorttable, but for filtering, and not in default place
http://tablesorter.com/docs/example-trigger-sort.html
that is for basics, better would be also controlling content of the specific td(that is generated by filter widget and has for now only input/select tags) in order to delete unused filter inputs and place, for example - some action buttons.

Something like this. Want to place "filtering tr" to the custom controls and be able to move action button to the lower TD(that was generated by filter widget)
PS the controls are default from 'pager' addon, I just highlighted the area

[Mottie]

Don't worry about your English, you speak better than I can speak Ukrainian ;P

If I understand what you are trying to do, I think you should try using the filter_formatter function. Check out this demo:

$('table').tablesorter({
    theme: 'blackice',
    widgets: ['zebra', 'filter'],
    widgetOptions: {

        // add custom filter elements to the filter row
        filter_formatter: {
            0: function ($cell, indx) {
                $cell
                    .append('<button type="button">x</button>')
                    .find('button')
                    .on('click', function () {
                        alert("Header button has been clicked");
                    });
                // no need to return reference to a hidden filter input
                return $('<input type="hidden">');
            }
        }

    }
})
// bind to the buttons within the table (using delegated events)
.find('tbody').on('click', 'button', function () {
    alert("button inside the table clicked");
});

[Nadoedalo]

Yep, that thing is what I was looking for in my first post.
But can I move filtering tr out of the table? Something like external controls, but for filters?
Something like this http://jsfiddle.net/Nadoedalo/abkNM/747/ but working =)
PS also I'm woking on multilanguage date parser for format like "17 may 2013, friday 22:26:38", I know how to develop it and seems that I can share this parser with project. I'm new on GitHub, how can I do that(rtfm, yeah)? And do you need that at all?

[Mottie]

What about this... it basically moves the entire filter row (demo).

Although, you could probably do the same thing with a custom layout & use the new $.tablesorter.setFilters() function (added in v2.9+).

[Nadoedalo]

Thanks for your support, that is exactly what I was looking for, but seems its still not enough.
Now I need to save the default text-filter input and add custom date range filter outside of the table, using existing date picking plugin(basically will need to depend only on correct format in input).
Seems that I will need to rework "uiDatepicker" from filter-formatter widgets for my needs. Any tips of how to bind external fields in order to make filtering?
EDIT something like #84 - with external controls, but for date range(the actual date in ms must be formed from "data-date" tag)
EDIT2 seems that http://jsfiddle.net/abkNM/741/ is not working properly - actual filtering gives nothing, and in jquery.ui and html5 demo all is working fine in default fields. How to fix that? Seems that filter_options is actually waiting reference, so return $('').appendTo($cell); will fix the problem.

[Mottie]

Oops, I ended up updating the code I shared above with this new demo" http://jsfiddle.net/abkNM/766/

All I had to do was change return; to return $('<input type="hidden">');

I'm working on a new demo for you with external controls.

[Mottie]

Sorry, I forgot to mention that in v2.10.7 I added some beta-testing demos which include this one that sets up an external filter using the select2 plugin.

I won't be able to followup on this for a few months, so hopefully that demo will show you how to resolve your issue.

[Mottie]

I'm guessing this issue has been resolved, so I'm going to close it. If you continue to have problems, please feel free to continue this discussion.