Jump to content

PHP/JavaScript contact form validation


IronicallyMaiden

Recommended Posts

Hi this is my 1st time posting so I hope I'm in the right section.

 

I am trying to make a PHP contact form, at the moment it works but with no validation.

 

I am using a jquery form validation plugin, the validation works fine too.

 

The problem is that the message can't sent because the validation comes 1st and I can't figure out how to call my contactFormProcess.php page from the javascript function once it validates so the message can actually send.

 

I think the problem is that javascript is clientside and php is serverside and I don't think one can link to the other directly.

 

That said is there an alternate way to call my contactFormProcess.php file from the javascript form validator?

Link to comment
https://forums.phpfreaks.com/topic/243961-phpjavascript-contact-form-validation/
Share on other sites

Sorry for not showing code, my brain is fried.

 

Basically I want to be able to call action="php/contactFormProcess.php" from the php form from within the javascript function $('#submit').formValidator so once I know everything is valid I can send the message.

 

<link rel="stylesheet" type="text/css" href="assets/styles.css" />
   
    <script type="text/javascript" src="assets/jquery.1.3.2.js"></script>
    <script type="text/javascript" src="jquery.ufvalidator-1.0.4.js"></script>

<script type="text/javascript">
	// EXECUTE PLUGIN ON DOM READY - START
	$(function () {

		$('#submit').formValidator({
			onSuccess	: function() { console.log('Success!'); },
			scope		: '#form-1',
			errorDiv	: '#errorDiv1'
		});

	});
	// EXECUTE PLUGIN ON DOM READY - END
</script>
    
</head>
<body>

      <div class="container">
         <? include("header.php") ?>
                
        <div class="main">
        
        <div id="contactForm"> <!--CONTACT FORM-->
   <form id="form-1" class="form" method="get" action="php/contactFormProcess.php">
  	
<div class="form-row">
    <div class="label">Name</div>
    <div class="input-container"><input name="name" type="text" class="input req-min" minlength="3" maxlength="40" /></div>
</div>

<div class="form-row">
    <div class="label">Email</div>
    <div class="input-container"><input name="email" type="text" class="input req-email" maxlength="50" /></div>
</div>
    
<div class="form-row">
    <div class="label">Message</div>
    <div class="input-container"><textarea name="message" cols="" rows="" class="textarea req-string"></textarea></div>
</div>

<input id="submitBtn1" value="Send" type="submit" class="sendBtn" />
<div id="errorDiv1" class="error-div"></div>

</form>
        </div>
        
        <div class="plane">
          <img src="images/plane.png" width="960" height="194" alt="paper plane" /></div>
        </div>
	  
          <? include("footer.php") ?>
      </div>
</body>

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.