babla_test/form.html at master · LECAN/babla_test · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
<!doctype html>

<html>

  <head>
    <title>News Form</title>
    <meta charset="utf-8" />
	<link rel="stylesheet" href="style.css" />
	<script type="text/javascript" src="./js/jquery-2.0.3.min.js"></script>
	<script src="./js/jquery-ui.js"></script>

	 <script>

		 $(function() {
			$( "#datepicker" ).datepicker();
		});
		</script>
  </head>

  <body>

	<form id="myForm" action="./manage.php" method="post" >
		<table>
		<tr><td>Header :</td><td> <input id="headerInput" type="text" name="header" ><div class="warning" id="headerWarning">Please fill the header field</div></td></tr><br/>
		<tr><td>Date :</td><td><input type="text" id="datepicker" name="newsDate"/><div class="warning" id="dateWarning">Please fill the date field</td></div></td></tr>
		<tr><td>Author :</td><td> <input id="authorInput" type="text" name="author" ><div class="warning" id="authorWarning">Please fill the author field</td></div></td></tr><br/>
		<tr><td>Text :</td><td> <textarea id="textInput" name="text"></textarea><div class="warning" id="textWarning">Please fill the text field</td></div></td></tr><br/>
		<tr><td colspan="2" ><input type="submit" value="Submit"></td></tr>

	</form>
	<script>


		/********************************************
		*	Check empty fields and stop submiting form if one is found
		*
		***************************************/
		$("form").submit(function(event){
			var pass =true;
			if($("#headerInput").val().length == 0){
				$("#headerWarning").show();
				pass=false;
			}

			if($("#authorInput").val().length == 0){
				$("#authorWarning").show();
				pass=false;
			}
			if($("#textInput").val().length == 0){
				$("#textWarning").show();
				pass=false;
			}

			if(!pass){
				event.preventDefault();
			}
		});
	</script>

  </body>

</html>