validate form before submit php

[admin]

I have a question to ask.

I have a form that the user has to fill up. There are a couple of fields that have restrictions (for example the name can't be empty). The problem is that everytime I press the submit button I get a popup saying that the name can't be empty but it's automatically redirect to an other page. So the question is: How can I modify my code to do the validation before being redirect to the page or chen the user clicks outside or press tab?

In order to achive this Im using PHP, Contact Form 7 and wordpress.
Here is my code:

<strong>php function createAccount.php</strong>

<?php 
require_once('../../../wp-load.php');
include ('../../../wp-config.php');
global $wpdb;    
$nameErr = "";
if(isset($_POST['next']))
{
$name=addslashes($_POST['cName']);
$surname=addslashes($_POST['cSurname']);
$email=addslashes($_POST['cEmail']);
$phone =addslashes($_POST['cPhone']);
$otherPhone=implode($_POST['cOtherPhone']);
$languages=implode(' | ', $_POST['cLanguages']);
$address=addslashes($_POST['cAddress']);
$neighborhood=$_POST['cNeighborhood'];
$pswd=addslashes($_POST['cPswd']);
$service=$_POST['cService'];
if ($_SERVER["REQUEST_METHOD"] == "POST") {
    if(empty($_POST["cName"])) {
        $message = "wrong answer";
    echo "<script type='text/javascript'>alert('$message');
    </script>";
}
}else{

$wpdb->insert("Client",array(
"cName"=>$name,
"cSurname"=>$surname,
"cEmail"=>$email,
"cPhone"=>$phone,
"cOtherPhone"=>$otherPhone,
"cLanguages"=>$languages,
"cAddress"=>$address,
"cNeighborhood"=>$neighborhood,
"cPswd"=>$pswd,
"cService"=>$service
));
print_r("uq");
}  
}
 $wpdb->show_errors();
?>

<strong>Contact form 7 page</strong>

<form action="/wp-content/plugins/my-codes/signUp.php" method="post">
[contact-form-7 id="422" title="Member Signup"]
</form>

<strong>Contact Form</strong>

<p>Your Name (required)<br /> </p>
[text* cName id:cName]

<p>Your Surname (required)<br /> </p>
[text* cSurname id:cSurname]

<p>Your Email (required)<br /></p>
[email* cEmail id:cEmail] 

<label> Your Telephone Number (required)
[tel* cPhone id:cPhone tel-106 placeholder "123 456 789"] </label>

<label> Other Telephone Number (required)
[tel* cOtherPhone id:cOtherPhone tel-106 placeholder "123 456 789"] </label>

<h3>What languages do your prefer?</h3>
<input id=cLanguages type="checkbox" name=cLanguages[] value="English">
<use_label_element for="check_14">English</use_label_element>

<input id=cLanguages type="checkbox" name=cLanguages[] value="Hebrew">
<use_label_element for="check_15">Hebrew</use_label_element>

<input id=cLanguages type="checkbox" name=cLanguages[] value="French">
<use_label_element for="check_16">French</use_label_element>

<input id=cLanguages type="checkbox" name=cLanguages[] value="Spanish">
<use_label_element for="check_17">Spanish</use_label_element>

<p>Your Address (required)<br /> </p>
[text* cAddress id:cAddress]

<select cNeighborhood id:cNeighborhood name=cNeighborhood>
<option value="Bat Yam">Bat Yam</option>
<option value="Raanana">Raanana</option>
</select>

<label> Create Password (required)
[text* cPswd id:cPswd] </label>

<label> Confirm Password (required)
[text* cPswd id:cPswd] </label>

<label> Pick a Service (required)</label>
<select cService id:cService name=cService>
<option value="Babysitter">Babysitter</option>
<option value="Cleaner">Cleaner</option>
</select>

<input type="submit" name="next">

Any help please? thanks!

<strong>UPDATE CONTACT FORM</strong>

<form id="commentForm" action="/wp-content/plugins/my-            codes/createAccount.php" method="post">
<p>Your Name (required)<br /> </p>
[text* cName id:cName]

<p>Your Surname (required)<br /> </p>
[text* cSurname id:cSurname]

<p>Your Email (required)<br /></p>
[email* cEmail id:cEmail] 

<label> Your Telephone Number (required)
[tel* cPhone id:cPhone tel-106 placeholder "123 456 789"] </label>
<label> Other Telephone Number (required)
[tel* cOtherPhone id:cOtherPhone tel-106 placeholder "123 456 789"] </label>

<h3>What languages do your prefer?</h3>
<input id=cLanguages type="checkbox" name=cLanguages[] value="English">
<use_label_element for="check_14">English</use_label_element>

<input id=cLanguages type="checkbox" name=cLanguages[] value="Hebrew">
<use_label_element for="check_15">Hebrew</use_label_element>

<input id=cLanguages type="checkbox" name=cLanguages[] value="French">
<use_label_element for="check_16">French</use_label_element>

<input id=cLanguages type="checkbox" name=cLanguages[] value="Spanish">
<use_label_element for="check_17">Spanish</use_label_element>

<p>Your Address (required)<br /> </p>
[text* cAddress id:cAddress]

<select cNeighborhood id:cNeighborhood name=cNeighborhood>
<option value="Bat Yam">Bat Yam</option>
<option value="Raanana">Raanana</option>
</select>

<label> Create Password (required)
[text* cPswd id:cPswd] </label>

<label> Confirm Password (required)
[text* cPswd id:cPswd] </label>

<label> Pick a Service (required)</label>
<select cService id:cService name=cService>
<option value="Babysitter">Babysitter</option>
<option value="Cleaner">Cleaner</option>
</select>

<input type="submit" name="submit" value="Submit">
</form>
<script src="http://code.jquery.com/jquery-1.11.1.min.js"></script>
<script src="http://cdn.jsdelivr.net/jquery.validation/1.15.0/jquery.validate.min.js">   </script>
<script src="http://cdn.jsdelivr.net/jquery.validation/1.15.0/additional-methods.min.js"></script>
<script>
$("#commentForm").validate();
</script>

I want to be redirected to

<blockquote>
/wp-content/plugins/my-codes/createAccount.php
</blockquote>

when I press submit button.