Rick de Graaf
Rick de Graaf

Reputation: 958

jquery plugin size and slice not working

I'm creating a jquery plugin for sorting and pagination a table (I know that there are loads of them and I tried a lot om them, but none so far fits my needs.)

Anyway, I have a lot of tables on my page and call my plugin with:

$('.data-table').tableSorterTwo();

Here is the plugin code:

(function($)
{
    $.fn.tableSorterTwo = function()
    {
        return this.each(function()
        {
            countRows($(this));
            hideRows($(this));
        });     
    };

    function countRows(element)
    {
        console.log($(element).find('tbody tr').size());
    }

    function hideRows(element)
    {
        $(element).find('tbody tr').hide().slice(0, 5).show();
    }
})(jQuery);

The weird thing is that size and slice are working unexpected and I can't pin down way.

I have this table with 6 rows; countRows returns 18. This happens for all tables. The result is the amount of rows multiplied by 3. Why is that?

Als the result of hideRows is unexpected. I want to show the first 5 rows of the table; but now (for every table) only the first 2 rows are displayed. Changing 5 to 10 results in 4 rows being shown.

Were are my errors? Messing with this for some time now, but I'm completely lost at the moment and every help/hint/suggestion is very welcome!

Upvotes: 0

Views: 200

Answers (1)

Jamiec
Jamiec

Reputation: 136154

As per my comment, I believe that Stack Overflow has been your teddy bear and the mere act of asking this question has lead you to fix it.

I can demonstrate that your code behaves as expected using the selector tbody tr, however the slight mistake of changing the selector to tbody td exhibits the behaviour you describe in the question for a table of 6 rows and 3 cells per row.

Upvotes: 1

Related Questions