Este es el código para mostrar todos los nombres, y al final de este código pongo la función que he creado para realizar la búsqueda
Código Javascript :
var nombre = new Array();
nombre = [["Daniel",35],
["María",19],
["David",28],
["Carlos",32],
["Mario",26]];
var mostrar = 3;
var Pagify = function(pArray, pCounter)
{
var array = pArray;
var pointer = 0;
var btnPrevious;
var btnNext;
var btnFirst;
var btnLast;
var counter = pCounter;
var self = this;
this.canNext = function()
{
return (pointer + counter < array.length);
}
this.canPrevious = function()
{
return (pointer >= counter);
}
this.first = function()
{
pointer = 0;
self.show();
}
this.last = function()
{
var multiply = Math.floor(array.length / counter);
pointer = counter * multiply;
self.show();
}
this.next = function()
{
if (self.canNext())
{
pointer += counter;
self.show();
}
}
this.previous = function()
{
if (self.canPrevious())
{
pointer -= counter;
self.show();
}
}
this.setPreviousButton = function(buttonId)
{
btnPrevious = document.getElementById(buttonId);
btnPrevious.onclick = self.previous;
}
this.setFirstButton = function(buttonId)
{
btnFirst =document.getElementById(buttonId);
btnFirst.onclick = self.first;
}
this.setLastButton = function(buttonId)
{
btnLast = document.getElementById(buttonId);
btnLast.onclick = self.last;
}
this.setNextButton = function(buttonId)
{
btnNext =document.getElementById(buttonId);
btnNext.onclick = self.next;
}
this.show = function()
{
document.getElementById("lNombres").innerHTML = "";
for(var i = pointer; i < pointer + counter && i < array.length ; i++)
{
document.getElementById("lNombres").innerHTML+= i +" - "+array[i][0]+" ....."+array[i][1] + "<br>";
}
btnPrevious.disabled = !self.canPrevious();
btnNext.disabled = !self.canNext();
btnFirst.disabled = !self.canPrevious();
btnLast.disabled = !self.canNext();
}
}
window.onload = function()
{
var pagify = new Pagify(nombre, mostrar);
pagify.setPreviousButton("botanterior");
pagify.setNextButton("botsiguiente");
pagify.setFirstButton("botprimero");
pagify.setLastButton("botultimo");
pagify.show();
}
Este el el código para las búsquedas, la cuestión sería integrar las dos funciones
Código Javascript :
var encontrados=new Array();
function busca(buscar) {
encontrados=new Array();
for(var i=0; i<nombre.length; i++) {
var nodoLower=nombre[i][0].toLowerCase();
if(nodoLower.indexOf(buscar.toLowerCase())!=-1) {
encontrados.push(nombre[i]);
}
}
document.getElementById("lNombres").innerHTML+= i +" - "+array[i][0]+" ....."+array[i][1] + "<br>";
} Código HTML :
<body>
<span id="lNombres"></span><br>
<br>
<form id="formBusqueda" name="formBusqueda">
Nombre: <input name=text1 type="text" id="buscar" size="30" maxlength="25" value="" /> <button type="button" id="botbuscar" value="Buscar" onMouseDown="busca(document.getElementById('buscar').value)"><strong>Buscar</strong></button>
</form>
<br>
<input type="button" id="botprimero" value="Primero" />
<input type="button" id="botanterior" value="Anterior" />
<input type="button" id="botsiguiente" value="Siguiente" />
<input type="button" id="botultimo" value="Último" />
</body> 