Seahorse

6. jQuery

El plugin de Seahorse para jQuery permite utilizar los selectores de jQuery para asignar comportamientos o para verificar si los campos poseen valores válidos, reduciendo la cantidad de líneas de código y facilitando su mantenimiento.

Proporciona las funciones seaBehavior(), que asigna comportamientos a los campos seleccionados, seaForm(), que asigna comportamientos a los formularios seleccionados, seaValidate(), que verifica si todos los elementos poseen valores válidos, y seaVerify() que invoca al método verify() de todos los elementos.

With the Seahorse plugin for jQuery you can use the jQuery selectors to assign behaviors or see if the fields have valid values, reducing the number of lines of code and making easier the maintenance of the code.

Seahorse provides the functions seaBehavior(), which assigns behaviors to the selected fields, seaForm(), which assigns behaviors to the selected forms, seaValidate(), which verifies that all elements have valid values, and seaVerify() that invokes the method verify() of all the selected elements.

Le plugin de Seahorse pour jQuery permets d'utiliser les sélecteurs de jQuery pour attribuer des comportements ou de voir si les champs ont des valeurs valides, ce qui réduit le nombre de lignes de code et fait l'entretien plus facile.

Seahorse donne les fonctions seaBehavior(), qui attribue des comportements aux elements choisis, seaForm(), qui attribue des comportements aux formulaires choisis, seaValidate(), qui vérifie que tous les éléments ont des valeurs valides, et seaVerify() qui appelle la méthode verify() de tous les elements choisis.


number()
integer()
date()
time()
alphanumeric()
alphabetical()
numeric()
<html>

<head>
<title>Seahorse example</title>

<style type="text/css">
	.ok { background-color:#f0fff0; }
	.error { background-color:#fff0f0; }
</style>

<script type="text/javascript" src="js/jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="js/seahorse-1.2.js"></script>
<script type="text/javascript" src="js/seahorse.jquery-1.2.js"></script>
<script type="text/javascript">
	function init()
		{
		jQuery(".integer").seaBehavior( "integer",
			{"groupingCharacter" : ','},
			{"okClass": "ok", "errorClass": "error", "errorMessage": "Integer error"} );

		jQuery(".number").seaBehavior( "number",
			{"decimalCharacter": '.', "groupingCharacter" : ','},
			{"okClass": "ok", "errorClass": "error", "errorMessage": "Number error"} );

		jQuery(".date").seaBehavior( "date",
			{"format" : 'dd/mm/yyyy'},
			{"okClass": "ok", "errorClass": "error", "errorMessage": "Date error"} );

		jQuery(".time").seaBehavior( "time",
			{"format" : 'hh-mm-ss'},
			{"okClass": "ok", "errorClass": "error", "errorMessage": "Time error"} );

		jQuery(".alphabetical").seaBehavior( "alphabetical", {},
			{"okClass": "ok", "errorClass": "error", "errorMessage": "Alphabetical error"} );

		jQuery(".alphanumeric").seaBehavior( "alphanumeric", {},
			{"okClass": "ok", "errorClass": "error", "errorMessage": "Alphanumeric error"} );

		jQuery(".numeric").seaBehavior( "numeric", {},
			{"okClass": "ok", "errorClass": "error", "errorMessage": "Numeric error"} );

		jQuery(":input").seaVerify();
		jQuery("#formulario").seaForm(function(msjs, array) {alert(msjs);}, "Submit error");
		}
</script>
</head>

<body onload="javascript:init();">

	<form action="" method="GET" id="formulario">
	<center><table class="cuadro_ejemplo">
		<tr>
			<td>number()</td>
			<td><input type="text" class="number" value="1,000.00"/></td>
		</tr>
		<tr>
			<td>integer()</td>
			<td><input type="text" class="integer" value="1,000"/></td>
		</tr>
		<tr>
			<td>date()</td>
			<td><input type="text" class="date" value="31/12/2000"/></td>
		</tr>
		<tr>
			<td>time()</td>
			<td><input type="text" class="time" value="23:59:59"/></td>
		</tr>
		<tr>
			<td>alphanumeric()</td>
			<td><input type="text" class="alphanumeric" value="Alphanumeric123"/></td>
		</tr>
		<tr>
			<td>alphabetical()</td>
			<td><input type="text" class="alphabetical" value="Alphabetical"/></td>
		</tr>
		<tr>
			<td>numeric()</td>
			<td><input type="text" class="numeric" value="1234"/></td>
		</tr>
		<tr>
			<td colspan="2" align="right">
				<input type="submit" value="Submit"/>
			</td>
		</tr>
	</table></center>
	</form>

</body>
</html>
	


Game Oriented Collision Detection logo
Game Oriented Collision Detection logo