PageRenderTime 39ms CodeModel.GetById 12ms RepoModel.GetById 1ms app.codeStats 0ms

/lib/jquery-validate/demo/ajaxSubmit-intergration-demo.html

#
HTML | 85 lines | 72 code | 13 blank | 0 comment | 0 complexity | b3c4b32979aeeae689b47da755c3d528 MD5 | raw file
Possible License(s): LGPL-2.1, Apache-2.0, BSD-3-Clause 
    

  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    2. 

  2. <html xmlns="http://www.w3.org/1999/xhtml">
    3. 

  3. <head>
    4. 

  4. <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
    5. 

  5. <title>Test for jQuery validate() plugin</title>
    6. 

  6. <link rel="stylesheet" type="text/css" media="screen" href="css/screen.css" />
    7. 

  7. <style type="text/css">
    8. 

  8. .warning { color: red; }
    9. 

  9. </style>
    10. 

  10. <script src="../lib/jquery.js" type="text/javascript"></script>
    11. 

  11. <script src="../lib/jquery.form.js" type="text/javascript"></script>
    12. 

  12. <script src="../jquery.validate.js" type="text/javascript"></script>
    13. 

  13. 

  14. <script type="text/javascript">
    15. 

  15. 	jQuery(function() {
    16. 

  16. 		// show a simple loading indicator
    17. 

  17. 		var loader = jQuery('<div id="loader"><img src="images/loading.gif" alt="loading..." /></div>')
    18. 

  18. 			.css({position: "relative", top: "1em", left: "25em"})
    19. 

  19. 			.appendTo("body")
    20. 

  20. 			.hide();
    21. 

  21. 		jQuery().ajaxStart(function() {
    22. 

  22. 			loader.show();
    23. 

  23. 		}).ajaxStop(function() {
    24. 

  24. 			loader.hide();
    25. 

  25. 		}).ajaxError(function(a, b, e) {
    26. 

  26. 			throw e;
    27. 

  27. 		});
    28. 

  28. 		
    29. 

  29. 		var v = jQuery("#form").validate({
    30. 

  30. 			submitHandler: function(form) {
    31. 

  31. 				jQuery(form).ajaxSubmit({
    32. 

  32. 					target: "#result"
    33. 

  33. 				});
    34. 

  34. 			}
    35. 

  35. 		});
    36. 

  36. 		
    37. 

  37. 		jQuery("#reset").click(function() {
    38. 

  38. 			v.resetForm();
    39. 

  39. 		});
    40. 

  40. 	});
    41. 

  41. </script>
    42. 

  42. 

  43. </head>
    44. 

  44. <body>
    45. 

  45. 

  46. <h1 id="banner"><a href="http://bassistance.de/jquery-plugins/jquery-plugin-validation/">jQuery Validation Plugin</a> Demo</h1>
    47. 

  47. <div id="main">
    48. 

  48. 

  49. <form method="post" class="cmxform" id="form" action="form.php">
    50. 

  50. 	<fieldset>
    51. 

  51. 		<legend>Login Form (Enter "foobar" as password)</legend>
    52. 

  52. 		<p>
    53. 

  53. 			<label for="user">Username</label>
    54. 

  54. 			<input id="user" name="user" title="Please enter your username (at least 3 characters)" class="required" minlength="3" />
    55. 

  55. 		</p>
    56. 

  56. 		<p>
    57. 

  57. 			<label for="pass">Password</label>
    58. 

  58. 			<input type="password" name="password" id="password" class="required" minlength"5" />
    59. 

  59. 		</p>
    60. 

  60. 		<p>
    61. 

  61. 			<input class="submit" type="submit" value="Login"/>
    62. 

  62. 		</p>
    63. 

  63. 	</fieldset>
    64. 

  64. </form>
    65. 

  65. 

  66. <div id="result">Please login!</div>
    67. 

  67. 

  68. <br/>
    69. 

  69. 

  70. <button id="reset">Programmatically reset above form!</button>
    71. 

  71. 

  72. <p>Backend file: <a href="form.phps">form.phps</a></p>
    73. 

  73. 

  74. <a href="index.html">Back to main page</a>
    75. 

  75. 

  76. </div>
    77. 

  77. 

  78. <script src="http://www.google-analytics.com/urchin.js" type="text/javascript">
    79. 

  79. </script>
    80. 

  80. <script type="text/javascript">
    81. 

  81. _uacct = "UA-2623402-1";
    82. 

  82. urchinTracker();
    83. 

  83. </script>
    84. 

  84. </body>
    85. 

  85. </html>
    86.