Dynami c загрузить больше кнопки на нескольких столах - PullRequest
0 голосов
/ 28 января 2020

У меня есть две стандартные таблицы (возможно, больше в будущем) с более чем 100 строками в каждой. Я вставил кнопку загрузки больше для каждой таблицы в 8 строк.

Работает только одна кнопка (первая таблица). Я предполагаю, что мне нужно назначить этот код для КАЖДОЙ таблицы, чтобы он работал? Но не знаете, как это сделать?

ОБНОВЛЕНИЕ:

Мне удалось заставить каждую кнопку управлять своей таблицей, однако у меня есть другая проблема сейчас же.

Когда я нажимаю одну кнопку load-more, она загружает следующие 8 строк должным образом, когда я нажимаю другую кнопку load-more, она загружает следующие 8 строк, которые были загружены в предыдущую таблицу, поэтому он прыгает с 8 до 17, 18, 19 ... и т. д. c

Вы можете увидеть здесь в этом коде ручки:
https://codepen.io/pixelboutiqueuk-the-lessful/pen/JjogZXa?editors=1000

Это это то, что у меня сейчас есть после многих настроек:

         // load more buttons
    var songTotalRows = $('.songs-table tr').length;
    if ( songTotalRows > 8 ) {
        $('.songs-table').after('<div class="load-more"><input id="song-show" type="button" value="Load More" /></div>');
    }

    var albumTotalRows = $('.album-table tr').length;
    if ( albumTotalRows > 8 ) {
        $('.album-table').after('<div class="load-more"><input id="album-show" type="button" value="Load More" /></div>');
    }

    var totalrowshidden;
    var rows2display=8;
    var rem=0;
    var rowCount=0;
    var forCntr;
    var forCntr1;
    var MaxCntr=0;

    $('.hide').click(function() {
        var rowCount = $('.spotify-table tr').length;
        rowCount=rowCount/2;
        rowCount=Math.round(rowCount)

        for (var i = 0; i < rowCount; i++) {
            $('tr:nth-child('+ i +')').hide(300); 
        }                            
    });

    $('#song-show').click(function() {
        rowCount = $('.songs-table tr').length;
        MaxCntr=forStarter+rows2display;

        if (forStarter<=$('.songs-table tr').length) {
            for (var i = forStarter; i < MaxCntr; i++) {
             $('.songs-table tr:nth-child('+ i +')').show(200);
            }
            forStarter=forStarter+rows2display
        } else {
            $('#song-show').hide();
        }
    });

    $('#album-show').click(function() {
        rowCount = $('.album-table tr').length;
        MaxCntr=forStarter+rows2display;

        if (forStarter<=$('.album-table tr').length) {
            for (var i = forStarter; i < MaxCntr; i++) {
             $('.album-table tr:nth-child('+ i +')').show(200);
            }
            forStarter=forStarter+rows2display
        } else {
            $('#album-show').hide();
        }
    });

    var rowCount = $('.spotify-table tr').length;
    for (var i = $('.spotify-table tr').length; i > rows2display; i--) {
        rem=rem+1
        $('.spotify-table tr:nth-child('+ i +')').hide(200);
    }

    forCntr=$('.spotify-table tr').length-rem;
    forStarter=forCntr+1
...