Scroller widget and checkbox

[sonthanh]

Hi,

is there anyway to use the automatically jump to top after sorting ( scroller_upAfterSort) is true but still prevent the scroll automatically up to top when click when checkbox #660 ?

Thanks in advance for your help ! Thanh

[Mottie]

Hi @sonthanh!

What you'll need to do is set the scroller_upAfterSort to false, then add the following code (demo):

$(function () {
    var $table = $('table');

    $table.on('sortEnd', function(){
        // scroll to top of tbody after sort
        $table.parent().animate({ scrollTop: 0 }, 'fast');
    });

    $table.tablesorter({
        theme: 'blackice',
        widgets: ['zebra', 'scroller'],
        widgetOptions: {
            scroller_height: 200,
            scroller_barWidth: 18,
            scroller_jumpToHeader: true,

            // don't scroll up after clicking on a checkbox
            scroller_upAfterSort: false
        },
        headers: {
            0: { sorter: 'checkbox' }
        },
        initialized: function (table) {

            // column containing all of the checkboxes (zero-based index)
            var columnWithCheckboxes = 0,
                // resort the table after the checkbox status has changed
                resort = false,

                ck, $hdrCheckbox,
                c = table.config,
                wo = c.widgetOptions,
                $t = $(table);

            $hdrCheckbox = $t
            // ==== make this work with the scroller widget ====
            .add($t.closest('.tablesorter-scroller'))

            // make checkbox in header set all others
            .find('thead th:eq(' + columnWithCheckboxes + ') input[type=checkbox]')
                .bind('change', function () {
                ck = this.checked;
                $t.children('tbody')
                    .find('tr td:nth-child(' + (columnWithCheckboxes + 1) + ') input')
                    .each(function () {
                    this.checked = ck;
                    $(this).trigger('change');
                });
                // make sure stickyHeader checkbox gets updated
                $hdrCheckbox.prop('checked', ck);
            })
                .bind('mouseup', function () {
                return false;
            });

            $t.find('tbody tr').each(function () {
                $(this)
                    .find('td:eq(' + columnWithCheckboxes + ')')
                    .find('input[type=checkbox]')
                    .bind('change', function () {
                    $t.trigger('updateCell', [$(this).closest('td')[0], resort]);
                });
            });
        }
    });
});

[sonthanh]

Thank you so much for really quick help. Could you please let me know when you plan to include this feature onto next release?

Thanh.

[Mottie]

Hi @sonthanh!

I wasn't really going to include that code in the plugin core... I might put it all into a separate file that can be loaded.

[sonthanh]

I see thank you so much for your quick help.