Mini Shell
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="content-type" content="text/html;charset=iso-8859-1" /> <title>validVal</title> <script type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.js"></script> <script type="text/javascript" language="javascript" src="../js/jquery.validVal.min.js"></script> <script type="text/javascript" language="javascript"> $(function() { $('form').validVal({ customValidations: { 'serverside-validation': function( v ) { var result = true; $.ajax({ async: false, // !important url: 'validations.php', data: 'name=' + $(this).attr( 'name' ) + '&value=' + v, success: function( yesOrNo ) { if ( yesOrNo != 'yes' ) { result = false; } } }); return result; } } }); }); </script> <style type="text/css" media="all"> * { color: #000; } input[type='text'] { background-color: #fff; border: solid 1px #999; padding: 5px; } input[type='text'] { width: 145px; } input[type='text'].focus { border-color: #000 !important; } input[type='text'].inactive { color: #999; font-style: italic; } input[type='text'].invalid { border-color: red; } input[type='submit'] { margin: 0 20px 0 90px; } body, p, input { font-family: Arial, Helvetica, sans-serif; font-size: 12px; } h2 { color: #999; } form { width: 740px; margin: 50px auto 0 auto; overflow: hidden; } .column { padding: 30px 0 50px 0; margin: 20px 0; width: 350px; float: left; } .column div { height: 26px; padding: 2px 0; } label { width: 150px; padding: 5px 0 0 15px; display: block; float: left; } </style> </head> <body> <form> <h1>jQuery.validVal</h1> <p><strong>You need to be in a server environment for this page to work.</strong></p> <div class="column"> <h2>Server-side validations:</h2> <div> <label for="i1">Required</label> <input id="i1" name="required" type="text" value="" class="serverside-validation" size="24" /> </div> <div> <label for="i2">Number</label> <input id="i2" name="number" type="text" value="" class="serverside-validation" size="24" /> </div> <div> <label for="i3">E-mail</label> <input id="i3" name="email" type="text" value="" class="serverside-validation" size="24" /> </div> <div> <label for="i4">URL</label> <input id="i4" name="url" type="text" value="" class="serverside-validation" size="24" /> </div> <br /> <br /> <br /> <input type="submit" value="Submit" /> <input type="reset" value="Reset" /> </div> </form> </body></html>
Zerion Mini Shell 1.0