There are meant to be 10 rows on the page, I want to skip to the next 20 on the click of the next button.
<body>
<div class="navigation">
<span class="previous" id="previous">⟵Previous </span>
<span class="next" id="Next">Next ⟶</span>
</div>
<script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
<script src="main.js"></script>
</body>
javascript code where I fetch the api
let rows = "";
fetch("https://api.coinlore.com/api/tickers/?start=0&limit=10")
.then(response => {
return response.json();
})
I have tried this for the pagination
$(document).ready(function() {
var currentRow = 1;
$('#patentResults tr').click(function(e) {
e.preventDefault();
var currentRow = +$(this).attr("data-index");
console.log('row clicked ', currentRow);
$('#rowPosition').attr('data-value', currentRow);
});
});
$('#previous').click(function(e) {
e.preventDefault();
var currentPos = +$('#rowPosition').attr("data-value");
console.log(currentPos);
currentPos = currentPos - 1;
$('#rowPosition').attr('data-value', currentPos);
$('#patentResults tr').attr("data-index", currentPos).click();
});
$('#next').click(function(e) {
e.preventDefault();
var currentPos = +$('#rowPosition').attr("data-value");
console.log(currentPos);
currentPos = currentPos + 1;
$('#rowPosition').attr('data-value', currentPos);
$('#patentResults tr').attr("data-index", currentPos).click();
});