Tengo un pequeño problema con Javascript. El tema es que necesito coger un array multidimensional, y pasarselo a una función, que me lo coloque en una tabla. A esta tabla le damos un ancho (numero de columnas) máximo, teniendo que saltar de fila cuando se llegue a tal límite.
Cada elemento (o sea, cada celda), tiene tres componentes: los dos primeros son campos de texto, y el último, un campo imagen.
Esa tabla tiene que mostrarse de manera predefinida al abrir la página. Luego tenemos dos pequeños elementos de filtrado: un select, y un campo de texto.
Las opciones del select serán uno de los parámetros de cada elemento. A modo ejemplo, imaginemos que los elementos son coches, y queremos mostrar de cada coche su marca, modelo y una imagen del mismo. El select tendría como opciones las marcas de los vehículos.
Como podreis imaginar, la finalidad del select es filtrar (listar) en una tabla (como la anterior), aquellos elementos (coches) que son de la marca seleccionada.
Luego está el tema del campo de texto. La idea es que, cuando vamos escribiendo una marca de un coche, la lista se va modificando sobre la marcha. La lista, al igual que antes, deberia quedar en el formato inicial.
En principio, para todos los casos (caso inicial, tablas creadas a traves del select, y las creadas por la modificacion del campo de texto), deseamos una tabla de un máximo de cinco elementos. O sea,que si tenemos seis, el sexto se coloca debajo del primero (tan obvio que a veces es mejor dejarlo claro).
Y todo ello, sin bases de datos, ni lenguajes del lado del servidor,...todo en HTML y Javascript. Los datos se meten manualmente en el código.
Lo que hice hasta el momento es:
Código:
He diseñado estas dos funciones para hacer el tema del select y el la forma de mostrarlo. Pero no me funciona, ya que, por ejemplo, no me lista los elementos en una tabla. Los lista todos seguidos, Debe de ser una tonteria, pero no me doy cuenta. <
<script type="text/javascript" language="javascript">
function multidimensionalArray(table) {
document.getElementById('algo').innerHTML = '';
document.getElementById('algo').innerHTML += '<table>';
var i=0;
for (var x=0; x<=8; x++) {
if (i==0) {
document.getElementById('algo').innerHTML += '<tr>';
}
document.getElementById('algo').innerHTML += "<td style='padding : 20px'>";
for (var y=0; y<=2; y++) {
if (y==2){
var texto="<img src='"+table[x][y]+"' alt='Imagen'> ";
document.getElementById('algo').innerHTML += texto;
}
else {
document.getElementById('algo').innerHTML += table[x][y];
document.getElementById('algo').innerHTML += '<br>';
}
}
document.getElementById('algo').innerHTML += '</td>';
//document.getElementById('algo').innerHTML += '</div>';
i++;
if (i==5) {
i=0;
document.getElementById('algo').innerHTML += '</tr>';
}
}
document.getElementById('algo').innerHTML += '</table>';
}
function cambiar(elm2,table) {
var elm = document.getElementById(elm2);
var nuevoarray = new Array();
for (var x = 0; x<table.length ; x++){
if (elm.options[elm.selectedIndex].value == table[x][0]){
nuevoarray[nuevoarray.length] = table[x];
}
}
if (elm.options[elm.selectedIndex].value == 'Todos') {
multidimensionalArray(table);
}
else {
multidimensionalArray(nuevoarray);
}
};
¿Alguna idea para el tema del filtrado por el campo de texto?
Muchisimas gracias de antemano. Un saludo.
