Aplicaciones de JavaScript

Validación de datos de tipo texto

El siguiente ejemplo nos mostrará cómo validar datos de tipo numérico para una aplicación de retiro de dinero en red.

Teclee su dirección de correo (ej. iavila@ciete.mty.itesm.mx)

Teclee sólo 5 carácteres:

Teclee 3 o más carácteres:

No deje vacío este campo:

¿Cómo funciona?

El guión de validación se coloca entre las etiquetas <HEAD> ... El código va aquí ... </HEAD>.

El guión de ejecución se coloca en una forma, dentro de una tabla.

Validación de datos

Manejador de eventos: onChange

Aquí está el código del guión:

<SCRIPT 
LANGUAGE="JavaScript"><!--
   
   function runTest(form, button)  {
   	Ret = false;
   	if (button.name == "1") Ret = testBox1(form);
   	if (button.name == "2") Ret = testBox2(form);
   	if (button.name == "3") Ret = testBox3(form);
   	if (button.name == "4") Ret = testBox4(form);
   	if (Ret)
   		alert ("Successful input!");
   }
   
   function testBox1(form) {
   	Ctrl = form.inputbox1;
   	if (Ctrl.value == "" || Ctrl.value.indexOf ('@', 0) == -1) {
   		validatePrompt (Ctrl, "Enter a valid email address")
   		return (false);
   	} else
   		return (true);
   }
   
   function testBox2(form) {
   	Ctrl = form.inputbox2;
   	if (Ctrl.value.length != 5) {
   		validatePrompt (Ctrl, "Please provide five characters")
   		return (false);
   	} else
   		return (true);
   }
   
   function testBox3(form) {
   	Ctrl = form.inputbox3;
   	if (Ctrl.value.length < 3) {
   		validatePrompt (Ctrl, "Please provide at least three characters")
   		return (false);
   	} else
   		return (true);
   }
   
   function testBox4(form) {
   	Ctrl = form.inputbox4;
   	if (Ctrl.value == "") {
   		validatePrompt (Ctrl, "Please provide a value for this box")
   		return (false);
   	} else
   		return (true);
   }
   
   function runSubmit (form, button)  {
   	if (!testBox1(form)) return;
   	if (!testBox2(form)) return;
   	if (!testBox3(form)) return;
   	if (!testBox4(form)) return;
   	alert ("All entries verified OK!");
   	//document.test.submit();	// un-comment to submit form
   	return;
   }
   
   function validatePrompt (Ctrl, PromptStr) {
   	alert (PromptStr)
   	Ctrl.focus();
   	return;
   }
   
   function loadDoc() {
   	// initial focus; use if needed
   	//document.test.inputbox1.focus ();
   	return;
   }
   //--></SCRIPT>
 

Este es el código de la forma:

<INPUT TYPE="text" NAME="inputbox1" VALUE=""
SIZE=30><INPUT TYPE="button" NAME="1" VALUE="Pruebe" 
onClick="runTest(this.form, this)">