Contact form


#1

Maybe someone can make heads or tails of what I’m trying to achieve if I just paste the code in.

<!doctype html>
<html style="background-color: #8F5C98">
<head>
    
<link rel="apple-touch-icon" sizes="57x57" href="/apple-icon-57x57.png">
<link rel="apple-touch-icon" sizes="60x60" href="/apple-icon-60x60.png">
<link rel="apple-touch-icon" sizes="72x72" href="/apple-icon-72x72.png">
<link rel="apple-touch-icon" sizes="76x76" href="/apple-icon-76x76.png">
<link rel="apple-touch-icon" sizes="114x114" href="/apple-icon-114x114.png">
<link rel="apple-touch-icon" sizes="120x120" href="/apple-icon-120x120.png">
<link rel="apple-touch-icon" sizes="144x144" href="/apple-icon-144x144.png">
<link rel="apple-touch-icon" sizes="152x152" href="/apple-icon-152x152.png">
<link rel="apple-touch-icon" sizes="180x180" href="/apple-icon-180x180.png">
<link rel="icon" type="image/png" sizes="192x192"  href="/android-icon-192x192.png">
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="96x96" href="/favicon-96x96.png">
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
<link rel="manifest" href="/manifest.json">
<meta name="msapplication-TileColor" content="#ffffff">
<meta name="msapplication-TileImage" content="/ms-icon-144x144.png">
<meta name="theme-color" content="#ffffff">    
    
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="Graphic Designer Specialising in Brand Design, Consultation, Management and Illustration. Based in Lincolnshire, UK">
<meta name="author" content="Martin Bodger">
<meta name="keywords" content="Graphic, Designer, Illustrator, Animator, Lincoln, Lincolnshire, United Kingdom">
<title>Martin Bodger | Designer</title>
<link href="../_css/websitestyletest.css" rel="stylesheet" type="text/css">
<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
<script src="../_js/jquery-3.3.1.min.js"></script>
<script src="https://www.google.com/recaptcha/api.js"></script>

<script>
    
$(document).ready(function() {
    $('.field input').keyup(function() {

        var empty = false;
        $('.field input').each(function() {
            if ($(this).val().length == 0) {
                empty = true;
            }
        });

        if (empty) {
            $('#send').attr('disabled', 'disabled');
        } else {
            $('#send').attr('disabled', false);
        }
    });
});
    
</script>

</head>

	<body>
	
		<div class="body">
			
			<div class="header" style="pointer-events: none;">
				
				<a href="../index.html">
				
					<div class="logo" style="pointer-events: auto;">
					
						<img src="../_images/mb_logo_hover.png"/>
						
					</div>	
				</a>
			
				<div class="navbar" style="pointer-events: auto;">
				
					<ul>
				
						<li><a href="design.html">Design</a></li>
						<li><a href="illustration.html">Illustration</a></li>
						<li><a href="animation.html">Animation</a></li>
						<li style="transform: skew(0deg, 16deg);"><a href="contact.html">Contact</a></li>
						<li><a href="about.html">About</a></li>
						
					</ul>
					
				</div>
			
			</div>
	
<div id="contact-area">
			
<form name="contactform" method="post" action="contactengine.php" target="_blank">
    
<table>
<tr>
    <td valign="top">
    <label for="name">Your Name *</label>
    </td>
</tr>

<tr> 
    <td valign="top">
    <input class="field" type="text" name="name" maxlength="50" size="30">
    </td>
</tr>

<tr>
    <td valign="top">
    <label  for="email">Your Email *</label>
    </td>
</tr>

<tr>
    <td valign="top">
    <input class="field" type="text" name="email" maxlength="50" size="30">
    </td>
</tr> 
 
<tr>
    <td valign="top">
    <label for="enquiry">Your Enquiry *</label>
    </td>
</tr>
 
<tr> 
    <td valign="top">
    <input class="field" type="text" name="enquiry" maxlength="30" size="30">
    </td>
</tr> 
 
<tr>
    <td valign="top">
    <label for="message">Your Message *</label>
    </td>
</tr>
 
<tr> 
    <td valign="top">
    <textarea  name="message" maxlength="1000" cols="25" rows="5"></textarea>
    </td>
</tr>
 
<tr>
    <td>
    <input type="submit" name="send" value="send" id="send" disabled="disabled">
    </td>
</tr>

<tr>
    <td>
        <div style="margin-left: 10%" class="g-recaptcha" data-sitekey="6LdiPkcUAAAAAMgzMjSiA-gD6nWsbbVrDXQXRfxM" data-callback="recaptcha_callback"></div>
    </td>
</tr>

</table>

</form>


		
				</div>
	
			</div>			
			
	</body>
	
</html>

Contact Form Nightmare