Hola a todos
Tengo un formulario con dos Arrays en unos van los usuarios y en otro la edad, correspondiente de cada uno.
He hecho un formulario de búsqueda donde al introducir un nombre si lo encuentra me lo muestra en un input y si no, sale un mensaje, hasta ahí bien, pero necesito varias cosas que no he conseguido todavía:
Que en la búsqueda no tenga en cuenta mayúsculas y minúsculas, tal como está tengo que introducir el nombre tal cual está declarado.
Y necesito que cuando encuentre el nombre buscado, la búsqueda es exclusivamente por este campo, que me muestre también en otro input la edad correspondiente a ese nombre.
Y por último si en el resultado encuentra más de un elemento, como me lo muestra en un input necesito que me muestre sólo el primero y el resto me lo vaya mostrando a través de un botón que al pulsarle me vaya mostrando los siguientes resultados de uno en uno hasta llegar al último.
<script language="javascript" type="text/javascript">
var edad = new Array();
edad[0] = 35;
edad[1] = 42;
edad[2] = 51;
edad[3] = 28;
edad[4] = 26;
var nombre = new Array();
nombre[0] = "Antonio";
nombre[1] = "Luis";
nombre[2] = "María";
nombre[3] = "Pedro";
nombre[4] = "Mario";
function busqueda() {
var b = document.getElementById("buscar").value;
var usuarios = "";
if(b!="") {
for(var i=0; i<nombre.length; i++) {
if(nombre[i].indexOf(b)!=-1) {
usuarios += nombre[i];
}
}
if(usuarios != ""){
document.getElementById('nombre').value = usuarios;
document.getElementById('edad').value = edad[1];
} else {
document.getElementById('mensaje').innerHTML="\<p\ >No se han encontrado resultados\<\/p\>"
}
}
}
</script>
Código HTML
Innput donde se introduce el texto de busqueda:
<input type="text" id="buscar" size="30" maxlength="25" value="ingresar texto de búsqueda" onFocus='this.value="";' />
Botón para comenzar la búsqueda:
<button type="button" value="Buscar" onclick="busqueda()"><strong>Buscar por Nombre</strong></button>
Input de resultados para el campo nombre y el campo edad:
Nombre: <input type="text" id="nombre" size="30" maxlength="25" value="" />
Edad: <input type="text" id="edad" size="30" maxlength="25" value="" />
Botón para mostrar los siguientes resultados
<input type="button" value="Siguiente" onmousedown="aqui iria la funcion">
<br />
Posición donde sale el mensaje en caso de que no encuentre datos
<div id="mensaje"></div>