Test
Booking
Please fill in the contract form and send it for booking..
Contact
Firstname
Lastname
E-mail
Organisation
Types of presentations
Lectures
Seminaries
Discussions
Title for lecture/seminarie
Other information
Information to the organizer (max 200 characters)
Send request
want to do some form control. Want to check if the entered data are in the correct form.
The section “Contact” section must be completely filled in.
E mail adress in a correct format
This filed “Information to the organizer (max 200 characters)” is not reqiured. But if used, the maximum characters are max 200 charactwers.
When the tickboxes Seminaries or Discussions are choosen the “Information to the organizer (max 200 characters)” must be entered.
I want to have a .js file to do this.
I found something, like this (do not understand it realy)
var pattern = /^([a-zA-Z0-9_.-])+@([a-zA-Z0-9_.-])+\.([a-zA-Z])+([a-zA-Z])+/;
var isValid = pattern.test(email);
Can anyone help me out? PLEASE, with codes. Js is totaly new for me.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Test</title>
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Open+Sans:300">
<link rel="stylesheet" href="https://unpkg.com/purecss@1.0.0/build/pure-min.css" integrity="sha384-nn4HPE8lTHyVtfCBi5yW9d20FjT8BJwUXyWZT9InLYax14RDjBj46LmSztkmNP9w" crossorigin="anonymous">
<!--[if lte IE 8]>
<link rel="stylesheet" href="https://unpkg.com/purecss@1.0.0/build/grids-responsive-old-ie-min.css">
<![endif]-->
<!--[if gt IE 8]><!-->
<link rel="stylesheet" href="https://unpkg.com/purecss@1.0.0/build/grids-responsive-min.css">
<!--<![endif]-->
<link rel="stylesheet" href="style/form.css">
</head>
<body>
<div class="content">
<h1>Booking</h1>
<p>Please fill in the contract form and send it for booking..</p>
<form id="registration_form" class="pure-form pure-form-stacked" enctype="multipart/form-data" method="post" action="test.html">
<fieldset>
<legend>Contact</legend>
<div class="pure-g">
<div class="pure-u-1 pure-u-md-1-2">
<label for="field_firstname">Firstname</label>
<input type="text" id="field_firstname" name="field_firstname" class="pure-u-23-24" tabindex="1">
</div>
<div class="pure-u-1 pure-u-md-1-2">
<label for="field_lastname">Lastname</label>
<input type="text" id="field_lastname" name="field_lastname" class="pure-u-23-24" tabindex="2">
</div>
<div class="pure-u-1 pure-u-md-1-2">
<label for="field_email">E-mail</label>
<input type="text" id="field_email" name="field_email" class="pure-u-23-24" tabindex="3">
</div>
<div class="pure-u-1 pure-u-md-1-2">
<label for="field_organisation">Organisation</label>
<input type="text" id="field_organisation" name="field_organisation" class="pure-u-23-24" tabindex="4">
</div>
</div>
</fieldset>
<fieldset>
<legend>Types of presentations</legend>
<label for="pres_type_1" class="pure-radio">
<input type="radio" id="pres_type_1" name="pres_type" value="lecture" tabindex="5" checked> Lectures
</label>
<label for="pres_type_2" class="pure-radio">
<input type="radio" id="pres_type_2" name="pres_type" value="seminar" tabindex="6"> Seminaries
</label>
<label for="pres_type_3" class="pure-radio">
<input type="radio" id="pres_type_3" name="pres_type" value="discussion" tabindex="7"> Discussions
</label>
<label for="field_pres_title">Title for lecture/seminarie</label>
<input type="text" id="field_pres_title" name="field_pres_title" class="pure-u-23-24" tabindex="8">
</fieldset>
<fieldset>
<legend>Other information</legend>
<label for="field_message">Information to the organizer (max 200 characters)</label>
<textarea id="field_message" name="field_message" cols="50" rows="4" class="pure-u-23-24" tabindex="9"></textarea>
</fieldset>
<button type="submit" id="saveForm" name="saveForm" class="pure-button pure-button-primary" tabindex="10">Send request</button>
</form>
</div>
<!--END .content-->
<script src="scripts/validate.js"></script>
</body>
</html>
I want to do some form control. Want to check if the entered data are in the correct form.
The section “Contact” section must be completely filled in.
E mail adress in a correct format
This filed “Information to the organizer (max 200 characters)” is not reqiured. But if used, the maximum characters are max 200 charactwers.
When the tickboxes Seminaries or Discussions are choosen the “Information to the organizer (max 200 characters)” must be entered.
I want to have a .js file to do this.
I found something, like this (do not understand it realy)
var pattern = /^([a-zA-Z0-9_.-])+@([a-zA-Z0-9_.-])+\.([a-zA-Z])+([a-zA-Z])+/;
var isValid = pattern.test(email);
Can anyone help me out? PLEASE, with codes. Js is totaly new for me