Hola
asegoviaz ,
webosiris :
Sin duda la mejor manera de validar un dato es el lenguaje de programación. Pero hace algunos años lo tuve que hacer con HTML. Una introducción breve.
Estaba terminando no sé qué obra con mi jefe y uno de los ayudantes cuando éste preguntó cómo se podía validar un campo de formulario en una página web. La respuesta inmediata que oí fue "
-Con ASP. " y luego una explicación que no entendí porque no sé de ASP.
Pero como no me iba a quedar con las ganas de molestar a mi jefe, agregué que no era indispensable ir hasta el servidor, que se podía hacer desde '
el HTML'.
Grave error. Aunque estaba de espaldas a ellos, pude sentir esa sonrisa de "...
hoy sí te tengo agarrado de las pelotas..." en las fauces de mi jefe. Pero no entendí por qué, y ante su insistencia doblé la apuesta.
-¿Seguro que se puede?.
-Sí, absolutamente.
-¿Tenés algún ejemplo?.
-No. Pero se puede hacer. No debe ser dificil.
-Me gustaría verlo; nunca vi ninguno. Pero 'vos sabes más que yo', y si decís que se puede validar con H-T-M-L ...
Ahí entendí el por qué de la maléfica sonrisa... en vez de decir '
desde el documento' dije '
desde el HTML', que se podía interpetar como '
con lenguaje HTM'. Y está claro que no le pensaba dar el gusto de que me ganara una; y más si no me había equivocado, solamente me expresé mal. Así que me pasé la noche haciendo ésto. (es sólo para
IE)
[edit] Ya no, lo adapté para
FF.
[/edit]
Código:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3c.org/TR/1999/REC-html401-19991224/loose.dtd">
<html>
<head>
<title> VALIDA CON SELECT OCULTO.</TITLE>
</head>
<body>
<h2>Valida el texto ingresado en un <tt>input</tt> con un <tt>select</tt> .</h2>
Un <tt>select</tt> oculto contiene en sus opciones todas las letras mayúsculas ( incluyendo la <font face="sans-serif"><b>ñ</b></font> ) y los 10 dígitos. Éstos son los únicos caracteres que pueden ser ingresados en el <tt>input</tt> .
<p>
<select multiple="multiple" id="sel" onchange="document.getElementById('contr').value += this.value"
onkeyup="this.focus(); this.selectedIndex=0;" style="margin-left:-10px; height:0; width:0">
<option value=""> </option>
<option value="A">A</option>
<option value="B">B </option>
<option value="C">C </option>
<option value="D">D</option>
<option value="E">E</option>
<option value="F">F</option>
<option value="G">G</option>
<option value="H">H</option>
<option value="I">I</option>
<option value="J">J</option>
<option value="K">K</option>
<option value="L">L</option>
<option value="M">M</option>
<option value="N">N</option>
<option value="Ñ">ñ</option>
<option value="Ñ">Ñ</option>
<option value="O">O</option>
<option value="P">P</option>
<option value="Q">Q</option>
<option value="R">R</option>
<option value="S">S</option>
<option value="T">T</option>
<option value="U">U</option>
<option value="V">V</option>
<option value="W">W</option>
<option value="X">X</option>
<option value="Y">Y</option>
<option value="Z">Z</option>
<option value="0">0</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>
</select>
<input type="text" id="contr" size="40"
onclick="getElementById('sel').focus()" readonly=readonly />
<input type="button" onclick="getElementById('contr').value=''; getElementById('sel').focus()" value="Borrar" />
</p>
<b>BUG : </b>La tecla <b>[↓]</b> repite la <b>A</b> o el último caracter en <b>IE</b>. En <b>FF</b> las teclas de dirección escriben la anterior o siguiente letra.</b>
</body>
</html>
Por supuesto que para manipular el formulario hay que usar javascript, pero el motor de validación es HTML. Y sí, ya sé: no sirve para nada.