How To Rewind A List Of Strings Sorted

Question

How To Rewind A List Of Strings Sorted

Navigation

#1 by (1 votes)
#2 by (0 votes)

0

Let's suppose, I click the More button and I go ahead with A - Z .

Now I want to go back from Z - A clicking the Minus button.

Code:

var i = 0;    
var j = 0;
var n = 0;      

function prox(){
j++;
i += 20; 
barra = texto.split("|");
document.getElementById('lista').innerHTML = ' ';
for ( x = n; x < i; x++ ){
  if(barra[x]){
document.getElementById('lista').innerHTML += "<br>"+barra[x]+"<br>";
	}
}
if (j) {n = i}
}

function ante(){
j--;
i -= 20; 

barra = texto.split("|").reverse();
document.getElementById('lista').innerHTML = ' ';
for ( p = n; p > i; p-- ){
  if(barra[p]){
document.getElementById('lista').innerHTML += "<br>"+barra[p]+"<br>";
	}
}
if (j) {n = i}
}

texto = 

// clique 1 - listagem 1
"|A|"+
"|B|"+
"|C|"+
"|D|"+
"|E|"+

// clique 2 - listagem 2
"|F|"+
"|G|"+
"|H|"+
"|I|"+
"|J|"+

// clique 3 - listagem 3
"|K|"+
"|L|"+
"|M|"+
"|N|"+
"|O|"+

// clique 4 - listagem 4
"|P|"+
"|Q|"+
"|R|"+
"|S|"+
"|T|"+

// clique 5 - listagem 5
"|U|"+
"|V|"+
"|W|"+
"|X|"+
"|Y|"+
"|Z|";

<div id="lista"></div>

<hr color=silver size=1>

<a onclick="ante();">&#171 Menos</a>

&nbsp;
|
&nbsp;

<a onclick="prox();">Mais &#187</a>

But this Minus button is not responding correctly!

javascript html css

asked by anonymous 25.06.2016 / 02:14

2 answers

0

In addition to the response from @MagicHat , I'll give a similar one.

Now, coupled with a comment from @Miguel to the operation of my script, I was sure that after some time without abandoning code, it would solve the reason.

The way was to remove the barra = texto.split("|").reverse(); line from the ante() function and add another inversion routine. Check out:

Code

var i = 0;    
var j = 0;
var n = 0;      

function prox(){

j++;

i += 20; 

barra = texto.split("|");

document.getElementById('txt').innerHTML = ' ';

for ( x = n; x < i; x++ ){

  if(barra[x]){

document.getElementById('txt').innerHTML +=  "<br>"+barra[x]+"<br>";

	}
}

if (j) {n = i}

}

function ante(){

j--;

i -= 20; 

document.getElementById('txt').innerHTML = ' ';

for ( p = n; p > i; p-- ){

  if(barra[p]){

document.getElementById('txt').innerHTML += barra[p];

	}
}

if (j) {n = i}

}

texto = 

// clique 1 - listagem 1
"|A|"+
"|B|"+
"|C|"+
"|D|"+
"|E|"+

// clique 2 - listagem 2
"|F|"+
"|G|"+
"|H|"+
"|I|"+
"|J|"+

// clique 3 - listagem 3
"|K|"+
"|L|"+
"|M|"+
"|N|"+
"|O|"+

// clique 4 - listagem 4
"|P|"+
"|Q|"+
"|R|"+
"|S|"+
"|T|"+

// clique 5 - listagem 5
"|U|"+
"|V|"+
"|W|"+
"|X|"+
"|Y|"+
"|Z|";


/* Rotina que faz a inversão de Baixo pra Cima */

function troca() 
{
var listar = document.getElementById('txt');

listar.innerHTML = listar.innerHTML.split('').reverse().join(' ').replace(/\s/g, "<br><br>");
}

<span id='txt'></span>

<hr color=gray size=1>

<center>

<button onclick="ante();troca()"> Anterior</button>

&nbsp; | &nbsp;

<button onclick="prox();">Proximo</button>

</center>

29.06.2016 / 09:06

Generate random class with JQuery Put Youtube video as site background

score 1 · Accepted Answer

Now I'm a papaya with sugar, there adapts to your need, see if it serves ...

<body onload="load();">
    <div>
	    <button type="button" id="volta" onclick="voltaPag()" value="volta" />&#171</button>
	    <button type="button" id="prox" onclick="proxPag()" value="prox" />&#187</button>
	    <div id="lista"></div>
    </div>
</body>
<script type="text/javascript">
    var lista = new Array("|A|","|B|","|C|","|D|","|E|","|F|","|G|","|H|","|I|","|J|","|K|","|L|","|M|","|N|","|O|","|P|","|Q|","|R|","|S|","|T|","|U|","|V|","|W|","|X|","|Y|","|Z|");
    var pagLista = new Array();
    var currentPage = 0;
    var numPorPag = 5;
    var numPag = 0;
    
    
function geraLista() {
	aLen = lista.length;
	text = "<ul>";
    for (x = 0; x < aLen; x++){
    text += "<li>" + lista[x] + "</li>";
}
text += "</ul>";
document.getElementById("lista").innerHTML = text;
numPag = getnumPag();
}

function getnumPag() {
    return Math.ceil(lista.length / numPorPag);
}

function proxPag() {
    currentPage += 1;
    loadLista();
}

function voltaPag() {
    currentPage -= 1;
    loadLista();
}

function loadLista() {
    var begin = ((currentPage - 1) * numPorPag);
    var end = begin + numPorPag;

    pagLista = lista.slice(begin, end);
    desList();
    check();
}
    
function desList() {
    document.getElementById("lista").innerHTML = "";
    for (r = 0; r < pagLista.length; r++) {
        document.getElementById("lista").innerHTML += pagLista[r] +"</br>";
    }
}

function check() {
    document.getElementById("prox").disabled = currentPage == numPag ? true : false;
    document.getElementById("volta").disabled = currentPage == 0 ? true : false;
}

function load() {
    geraLista();
    loadLista();
}
    

</script>

If you forget to validate the response ... vlw ¯ \ _ (ツ) _ / ¯