Para empezar, el formulario lo podrias tener asi:
<script type="text/javascript"> var add_tecla = function(){
/* Obtener DIV de teclas */
var div = document.getElementById("teclas");
/* Agregar otra columna */
div.innerHTML += '
<i>Tecla:
</i><input type="text" name="tecla[]" /> -
<i>Acci
ón:
</i><input type="text" name="accion[]" /><br>';
/* Finalizar */
return true;
}
<form action="envio.php" method="POST"> <input type="button" value="Añadir tecla" onclick="add_tecla();" /> <input type="submit" value="enviar" /><br /> <i>Tecla:
</i><input type="text" name="tecla[]" /> -
<i>Acci
ón:
</i><input type="text" name="accion[]" /><br>
Ahora bien 2 cosas:
1. Si tienes muchos campos con el mismo nombre,
puedes usar [] (tecla[]) para que HTML les asigne automáticamente el numero. Asi no tienes que escribir tecla1, tecla2 etc..
PHP lo reconocerá como un array.
2. Solo puede haber
UN elemento
con EL MISMO ID. No puedes tener 2 elementos con el mismo ID.
Bien, pasamos a PHP.
La función tecla2() se podría optimizar pero debes cambiar los nombres de las imágenes... si no jodido. Ejemplo:
function tecla2($cadena) {
// Si es una letra o numero de 1 caracter de logitud, se le añadira <div class="tecla">
// Pero si coincide con las palabras flechas,enter etc... se le añadira <img src="" />
$buscarRegex = array('/^([A-ZñÑ0-9]{1})$/i','/^(flechas|enter|control|alt|espacio|der|izq|mover|shift)$/i'); $reemplazo = array('<div class="tecla">$1</div>','<img src="ico/$1.png" alt="tecla-$1" />'); $mag = preg_replace($buscarRegex, $reemplazo, $cadena,-1,$contador); // Si las sustituciones son menores a 1, significa que no se ha encontrado el patrón.
if($contador >= 1){return $mag;}else{return 'desconocida';}
}
El poder de regex es total
. El caso es que las imágenes se deberán llamar flechas.png, enter.png, der.png, izq.png etc..etc..
Bien, en vez de hacer:
$tecla0 = tecla2($_POST['tecla0']);
$accion0 = reem($_POST['accion0]);
/* bla bla bla */
Haremos esto:
/* Por cada campo de tecla ... */
foreach($_POST['tecla'] as $tecla){
/* Le pasamos tecla2 y le agregamos a un array. */
$teclas[] = tecla2($tecla);
}
/* Lo mismo con las acciones.. */
foreach($_POST['accion'] as $accion){
$acciones = reem($accion);
}
Y ahora llega la magia. ¿ Como hacer que un array entero de teclas y acciones se guarde en la base de datos en una sola columna ? La magia esta en
serialize() http://php.net/manual/es/function.serialize.php .. básicamente te permite guardar arrays y objetos y luego recuperarlos como si nada.
$query = "INSERT INTO juegos (teclas,acciones) VALUES ('".$teclas."','".$acciones."')";
CONSEJO: Asegúrate de que los campos
teclas y
acciones de la tabla juegos sean de tipo
TEXT,
MEDIUMTEXT o
LONGTEXT. La razon es que la cadena del serialize es mas larga cuantos mas campos añades.
Bien, ahora que ya lo tienes todo bien guardadito en la base de datos, te toca sacarlo de ahí y mostrarlo
como los monos de la jungla mandan.
/* Conexion a base de datos
bla bla bla blab */
$query = "SELECT * FROM juegos";
....
/* Supongamos que la variable que tiene el resultado de la query se llama $row */
// Primero toca quitar el serialize a lo que hemos sacado. Para ello unserialize().
// Ahora ya tenemos metidos en un array las teclas y las acciones. Toca mostrarlos en una tabla
echo '<table><tr><th>Tecla</th><th>Accion</th></tr>';
// Queremos tener el index, para obtener la accion que corresponde a la tecla.
foreach($teclas as $index=>$tecla){
echo '<tr><td>'.$tecla.'</td><td>'.$acciones[$index].'</td></tr>';
}
// cerramos tabla y nos vamos :P
echo '</table>';
Consejos:
1. Busca tutoriales sobre REGEX, te va a ayudar mucho.
2. Utiliza
MYSQLI en vez e MYSQL. Esta ultima esta marcada como obsoleta y sera eliminada.
3. Este codigo NO ES SEGURO. Te lo he dejado como muestra.. deberas aplicar los correspondientes filtros antes de guardarlo en la bd.
4. Si Chuck Norris existe que me de una hostia contra el tecla sdosaifjdioas fjsaofpjsaiofhsadfpsfjSaludos espero que te sirva.