www.webdeveloper.com
Page 1 of 2 12 LastLast
Results 1 to 15 of 18

Thread: ajax form submit button not working.

  1. #1
    Join Date
    Aug 2012
    Location
    TX
    Posts
    293

    ajax form submit button not working.

    reset works form fields work but when i click submit nothing happens.
    here is my code

    Main page with form on it

    <?php $page = 'appEnglish'; ?>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="EN" lang="EN" dir="ltr">

    <title>English Application</title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    <meta http-equiv="imagetoolbar" content="no" />
    <link rel="stylesheet" href="styles/layout.css" type="text/css" />

    <script type="text/javascript" src="js/jquery-1.8.2.min.js"></script>
    <script type="text/javascript" src="js/ajax_submit.js"></script>

    </head>





    <form id="english1" name="english1" id="english1" method="POST" form action="actions/appSubmit.php" enctype="multipart/form-data">
    <div id="response"><!--This will hold our error messages and the response from the server. --></div>

    <h1>Application For Employment</h1>
    Date:&nbsp; <input type="text" name="date" id="date" /> &nbsp;&nbsp; Position:&nbsp;<input type="text" name="position" id="position" /> &nbsp;&nbsp; Email:&nbsp;<input type="text" name="email" />

    By signing I confirm that I have read, understand and insure all the information provided on this application is correct.
    <br /><br />
    Signature Of Applicant:&nbsp;<input type="text" name="signature" id="signature" /> &nbsp;&nbsp; Date:&nbsp;<input type="text" name="datesign" id="datesign" /> <input name="submit" id="submit" value="Submit Application" />&nbsp;&nbsp;<input type="reset" name="reset" value="Reset All Fields"/>

    <div class="inputs">
    <input type="hidden" name="honeypot" id="honeypot" value="http://" />
    <input type="hidden" name="humancheck" id="humancheck" class="clear" value="" />
    </form>
    </div>

    </div>
    </div>
    </div>
    </div>



    <!-- #################################################################################################### ### -->
    <div class="wrapper col4">
    <?php
    include("includes/footer.php")
    ?>
    </div>
    </body>
    </html>

    php submit to email for to admin

    <?php
    sleep(2);
    //Sanitize incoming data and store in variable

    $date = trim(stripslashes(htmlspecialchars ($_POST['date'])));
    $position = trim(stripslashes(htmlspecialchars ($_POST['position'])));
    $email = trim(stripslashes(htmlspecialchars ($_POST['email'])));
    $experience = trim(stripslashes(htmlspecialchars ($_POST['experience'])));
    $fname = trim(stripslashes(htmlspecialchars ($_POST['fname'])));
    $lname = trim(stripslashes(htmlspecialchars ($_POST['lname'])));
    $mname = trim(stripslashes(htmlspecialchars ($_POST['mname'])));
    $dob = trim(stripslashes(htmlspecialchars ($_POST['dob'])));
    $dl = trim(stripslashes(htmlspecialchars ($_POST['dl'])));
    $address = trim(stripslashes(htmlspecialchars ($_POST['address'])));
    $city = trim(stripslashes(htmlspecialchars ($_POST['city'])));

    $humancheck = $_POST['humancheck'];
    $honeypot = $_POST['honeypot'];


    if ($honeypot == 'http://' && empty($humancheck)) {

    //Validate data and return success or error message
    $error_message = '';
    }
    if (empty($fname)) {

    $error_message .= "<p>Please provide your first name, provide at least 2 characters in this field.</p>";

    if (empty($lname)) {

    $error_message .= "<p>Please provide your last name, provide at least 2 characters in this field.</p>";
    }
    if (empty($telephone)) {

    $error_message .= "<p>Please provide your phone number with area code.</p>";
    }
    if (empty($cell)) {

    $error_message .= "<p>Please provide cell with area code</p>";
    }
    if (empty($signature)) {

    $error_message .= "<p>Please provide E signature</p>";
    }
    $reg_exp = "/^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9-]+\.[a-zA-Z.]{2,4}$/";

    if (!preg_match($reg_exp, $email)) {

    $error_message .= "<p>A valid email address is required.</p>";
    }


    if (!empty($error_message)) {
    $return['error'] = true;
    $return['msg'] = "<h3>Oops! The request was successful but your form is not filled out correctly.</h3>"
    .$error_message;
    echo json_encode($return);
    exit();

    } else {

    //Prepare information from form to be sent
    $to = 'admin@skylinestaffingservices.com';
    $from = 'admin@skylinestaffingservices.com';
    $headers = 'MIME-VERSION: 1.0' . '\n';
    $headers .= 'From: $from' . '\n';
    $subject = 'New Application Submission';
    $body = 'Date: ' .$date . PHP_EOL;
    $body .= 'Position: ' .$position . PHP_EOL;
    $body .= 'Email: ' .$email . PHP_EOL;
    $body .= 'Experience: ' .$experience . PHP_EOL;
    $body = 'Name: ' .$fname . PHP_EOL;
    $body .= 'Last Name: ' .$lname . PHP_EOL;
    $body .= 'Middle Name: ' .$mname . PHP_EOL;
    $body .= 'DOB: ' .$dob . PHP_EOL;
    $body = 'DL: ' .$dl . PHP_EOL;
    $body .= 'Address: ' .$address . PHP_EOL;
    $body .= 'city: ' .$city . PHP_EOL;
    $body .= 'State: ' .$state . PHP_EOL;
    $body = 'Zip: ' .$zip . PHP_EOL;
    $body .= 'telephone: ' .$telephone . PHP_EOL;
    $body .= 'cell: ' .$cell . PHP_EOL;
    $body .= 'Emergency Name: ' .$ename . PHP_EOL;
    $body = 'Emergency Last Name: ' .$elname . PHP_EOL;
    $body .= 'Emergency Phone: ' .$ephone . PHP_EOL;
    $body .= 'Emergency Cell: ' .$ecell . PHP_EOL;
    $body .= 'Availability: ' .$availability . PHP_EOL;
    $body = 'Previously Worked For SSS: ' .$previous . PHP_EOL;
    $body .= 'Company: ' .$company . PHP_EOL;
    $body .= 'Title: ' .$title . PHP_EOL;
    $body .= 'Supervisor: ' .$supervisor . PHP_EOL;
    $body .= 'Supervisor Phone Number: ' .$supervisorphone . PHP_EOL;
    $body .= 'Reason For Leaving: ' .$leaving . PHP_EOL;
    $body .= 'Gender: ' .$sex . PHP_EOL;
    $body .= 'Documents To Work: ' .$proof . PHP_EOL;
    $body .= 'E Signature: ' .$signature . PHP_EOL;
    $body .= 'E Date: ' .$datesign . PHP_EOL;

    // Form data was successfull so we will now send admin email and return message to the user
    if(mail($to, $subject, $body, $headers, '-f admin@skylinestaffingservices.com')) {

    $return['error'] = false;
    $return['msg'] = "<p>We will be in touch soon " .$fname .".</p>";
    echo json_encode($return);

    } else {

    $return['error'] = true;
    $return['msg'] = "<h3>Oops! We are having trouble submitting your application. Please try us directly at admin@skylinestaffingservices.com</h3>";
    echo json_encode($return);
    }
    }

    }

    ?>

    java script code



    $(document).ready(function() {

    $('form #response').hide();

    $('#submit').click(function(e) {

    // prevent forms default action until
    // error check has been performed
    e.preventDefault();

    // grab form field values
    var valid = '';
    var required = ' is required.';
    var fname = $('form #fname').val();
    var lname = $('form #lname').val();
    var telephone = $('form #telephone').val();
    var cell = $('form #cell').val();
    var email = $('form #email').val();
    var signature = $('form #signature').val();

    // perform error checking
    if (fname = '' || fname.length <= 2) {
    valid = '<p>Your first name' + required +'</p>';
    }

    if (lname = '' || lname.length <= 2) {
    valid = '<p>Your last name' + required +'</p>';
    }

    if (telephone = '' || telephone.length <= 7) {
    valid = '<p>Your phone' + required +'</p>';


    }

    if (cell = '' || cell.length <= 7) {
    valid = '<p>Your telephone ' + required +'</p>';


    }

    if (!email.match(/^([a-z0-9._-]+@[a-z0-9._-]+\.[a-z]{2,4}$)/i)) {
    valid += '<p>Your email' + required +'</p>';
    }


    if (signature = '' || message.length <= 5) {
    valid += '<p>Your signature' + required + '</p>';

    }

    // let the user know if there are erros with the form
    if (valid != '') {

    $('form #response').removeClass().addClass('error')
    .html('<strong>Please correct the errors below.</strong>' +valid).fadeIn('normal');
    }
    // let the user know something is happening behind the scenes
    // serialize the form data and send to our ajax function
    else {

    $('form #response').removeClass().addClass('processing').html('Sending message...').fadeIn('normal');

    var formData = $('form').serialize();
    submitForm(formData);
    }

    });
    });

    // make our ajax request to the server
    function submitForm(formData) {

    $.ajax({
    type: 'POST',
    url: 'actions/appSubmit.php',
    data: formData,
    dataType: 'json',
    cache: false,
    timeout: 7000,
    success: function(data) {

    $('form #response').removeClass().addClass((data.error === true) ? 'error' : 'success')
    .html(data.msg).fadeIn('fast');

    if ($('form #response').hasClass('success')) {

    setTimeout("$('form #response').fadeOut('fast')", 5000);
    }

    },
    error: function(XMLHttpRequest, textStatus, errorThrown) {

    $('form #response').removeClass().addClass('error')
    .html('<p>There was a<strong> ' + errorThrown +
    '</strong> error due to a<strong> ' + textStatus +
    '</strong> condition.</p>').fadeIn('fast');
    },
    complete: function(XMLHttpRequest, status) {

    $('form')[0].reset();
    }
    });
    };

  2. #2
    Join Date
    May 2006
    Location
    Somewhere behind your screen
    Posts
    1,670
    make sure that your form has all the fields mentioned in your script

    Code:
     // grab form field values
     var valid = '';
     var required = ' is required.';
     var fname = $('form #fname').val();
     var lname = $('form #lname').val();
     var telephone = $('form #telephone').val();
     var cell = $('form #cell').val();
     var email = $('form #email').val();
     var signature = $('form #signature').val();
    and please use the code tags for posting code
    Last edited by Padonak; 05-06-2013 at 09:55 AM.

  3. #3
    Join Date
    Aug 2012
    Location
    TX
    Posts
    293
    Thank you for your reply. It does have all the fields. the button does not even process the js file to say im missing fields...

    and please tell me how to use the code tag to insert code. I have not been able to figure that out

  4. #4
    Join Date
    May 2006
    Location
    Somewhere behind your screen
    Posts
    1,670
    1. [ code ]here goes you code[ /code ] use these tags without spaces inside the brackets (i put the spaces to make the tags be visible)
    2. use the Opera error console/Firefox Firebug/or any other available debugger to see the errors you are getting
    3. you say that the form has all the fields? then show me please where is the input having id="fname" or the input having id="lname"? from the code you provided i can see fields having the following id's:date,position,signature,datesign,honeypot,humancheck. the field "email" has only name attribute but no id. if you were using a debugger you could see a message like this:

    Code:
    Event thread: click
    Uncaught exception: TypeError: Cannot convert 'fname' to object
    Error thrown at line 22, column 1 in <anonymous function>(e) in http://localhost/sec/diaz/diaz_submit/js/ajax_submit.js:
        if (fname = '' || fname.length <= 2)

  5. #5
    Join Date
    Aug 2012
    Location
    TX
    Posts
    293
    Code:
      
    
    <?php $page = 'appEnglish'; ?>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="EN" lang="EN" dir="ltr">
    
    <title>English Application</title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    <meta http-equiv="imagetoolbar" content="no" />
    <link rel="stylesheet" href="styles/layout.css" type="text/css" />
    
    <script type="text/javascript" src="js/jquery-1.8.2.min.js"></script>
    <script type="text/javascript" src="js/ajax_submit.js"></script>
    
    </head>
    <body id="top">
    <!-- ####################################################################################################### -->
    <div class="wrapper col1">
    
    
        </div>
        <br class="clear" />
      </div>
    </div>
    <!-- ####################################################################################################### -->
    <div class="wrapper col2">
      <div id="breadcrumb">
        <ul>
          
        </ul>
      </div>
    </div>
    <!-- ####################################################################################################### -->
    <div class="wrapper col3">
      <div id="container">
              <center><h1>Application For Employment English</h1></center>
            
          <div id="inner-wrapper">
              
    
         
       
          <div id="respond">
            
    <form id="english1" name="english1" id="english1" method="POST" form action="actions/appSubmit.php" enctype="multipart/form-data"> 
     <div id="response"><!--This will hold our error messages and the response from the server. --></div>  
    <h1>Application For Employment</h1>
    Date:&nbsp; <input type="text" name="date" id="date" /> &nbsp;&nbsp; Position:&nbsp;<input type="text" name="position" id="position" /> &nbsp;&nbsp; Email:&nbsp;<input type="text" name="email" />
    <br /> <br />
    Experience:&nbsp;<textarea name="experience" id="experience"></textarea>
    <br /> <br />
    <h2>Personal Information</h2>
    <br /> <br />
    Last Name:&nbsp;<input type="text" name="lname" id="lname" /> &nbsp;&nbsp;   First Name:&nbsp;<input type="text" name="fname" id="fname" />   &nbsp;&nbsp;   Middle Name:&nbsp;<input type="text" name="mname" id="mname" />  
     <br /> <br />
     Date Of Birth:&nbsp;<input type="text" name="dob" id="dob" />   &nbsp;&nbsp;   Drivers License #:&nbsp;<input type="text" name="dl" id="dl" /> 
     <br /> <br />
     <h3>Address</h3>
     Address:&nbsp;<input type="text" name="address" id="address" />
     <br /> <br />
     City:&nbsp;<input type="text" name="city" id="city" /> &nbsp;&nbsp; State:&nbsp;<input type="text" name="state" id="state" /> &nbsp;&nbsp; Zip Code:&nbsp;<input type="text" name="zip" id="zip" />
     <br /> <br />
     Telephone #:&nbsp;<input type="text" name="telephone" id="telephone" />  &nbsp;&nbsp;  Cell Phone #:&nbsp;<input type="text" name="cell" id="cell" />
        <br /> <br />
       <h3>Emergency Contact</h3>
    First Name:&nbsp;<input type="text" name="ename" id="ename" />  Last Name:&nbsp;<input type="text" name="elname" id="elname" />  &nbsp;&nbsp; Relationship:&nbsp;<input type="text" name="relationship" id="relationship" />   
    <br /> <br />
    Telephone #:&nbsp;<input type="text" name="ephone" id="ephone" /> &nbsp;&nbsp; Cell Phone #:&nbsp;<input type="text" name="ecell" id="ecell" />    
    <br /> <br />
     <h3>Availability To Work</h3>
     Are You Available For All Shifts?&nbsp; <input type="radio" name="availability" id="availability" value="yes">Yes
    <input type="radio" name="availability" id="availability" value="no">No<br> 
    <br /> <br />
     Have You Worked for This Staffing Company before?&nbsp; <input type="radio" name="previous" id="previous" value="yes">Yes
    <input type="radio" name="previous" id="previous" value="no">No 
    <br /> <br />
    <h3>Previouse Employment</h3>
    Company:&nbsp;<input type="text" name="company" id="company" /> &nbsp;&nbsp; Title:&nbsp;<input type="text" name="title" id="title" />
    <br /><br />
    Name Of Supervisor:&nbsp;<input type="text" name="supervisor" id="supervisor" /> &nbsp;&nbsp; Supervisor Phone#:&nbsp;<input type="text" name="supervisorphone" id="supervisorphone" />
    <br /> <br />
    Reasons For Leaving:&nbsp;<textarea name="leaving" id="leaving"></textarea>
    <br /> <br />
    <h3>Equal Employment Opportunity</h3>
    <p>
    We do not discriminate against qualified applicants based upon any protected group status, including but not limited to 
    race, color, creed, religion, sex (except where it is a bona fide occupational qualification), national origin, ancestry, age,
    marital status, military or veteran status, sexual orientation, physical or mental disability or medical condition as defined
    by applicable equal opportunity laws. </p>
    <p>
    To help us comply with federal/state equal opportunity record keeping, reporting and other legal requirements, we 
    would appreciate you voluntarily providing the information below.</p>
    <p>
    I certify that the information on this application is correct and I understand that any misrepresentation or omission of 
    any information will result in my disqualification from consideration for employment or, if employed, my dismissal.  I 
    understand that this application is not a contract, offer, or promise of employment and that if hired, I will be able to 
    resign at any time for any reason. Likewise, the company can terminate my employment at any time with or without 
    cause, unless otherwise required by law.</p>
    <p>
    Offers reasonable accommodation in the employment process for individuals with disabilities.  If you need assistance 
    in the application or hiring process to accommodate a disability, you may request an accommodation at any time
    </p> 
    <br />
     <h3>Additional Information</h3>
    Are You Male Or Female?
    <br />
    Male&nbsp; <input type="radio" name="sex" id="sex" value="male"> &nbsp;&nbsp;&nbsp;Female&nbsp; <input type="radio" name="sex" id="sex" value="female"> &nbsp;&nbsp;&nbsp;Choose Not To Respond&nbsp; <input type="radio" name="sex" id="sex" value="noresponse">
    <br /> <br />
    Can you Provide Proof Of Work Authorization In The United States&nbsp; <input type="radio" name="proof" id="proof" value="yes">Yes
    <input type="radio" name="proof" id="proof" value="no">No 
     <br /> <br />
    By signing I confirm that I have read, understand and insure all the information provided on this application is correct.
    <br /><br />
    Signature Of Applicant:&nbsp;<input type="text" name="signature" id="signature" /> &nbsp;&nbsp; Date:&nbsp;<input type="text" name="datesign" id="datesign" /> <input name="submit" id="submit" value="Submit Application" />&nbsp;&nbsp;<input type="reset" name="reset" value="Reset All Fields"/>    
    
    <div class="inputs">
                        <input type="hidden" name="honeypot" id="honeypot" value="http://" />            
                        <input type="hidden" name="humancheck" id="humancheck" class="clear" value="" />
            </form>
          </div>
    
          </div>
        </div>
        </div>
        </div>
    
           
    
    <!-- ####################################################################################################### -->
    <div class="wrapper col4">
      <?php 
     include("includes/footer.php")
     ?>
    </div>
    </body>
    </html>
    Last edited by Nicholas Diaz; 05-06-2013 at 01:19 PM.

  6. #6
    Join Date
    Aug 2012
    Location
    TX
    Posts
    293
    Code:
     
    
    
    
    $(document).ready(function() {
    	
    	$('form #response').hide();
    	
    	$('#submit').click(function(e) {
    		
    		// prevent forms default action until
    		// error check has been performed
    		e.preventDefault();
    				
    		// grab form field values
    		var valid = '';
    		var required = ' is required.';
    		var date = $('form #fname').val();
    		var position = $('form #lname').val();
    		var email = $('form #telephone').val();
    		var experience = $('form #cell').val();
    		var fname = $('form #email').val();
    		var lname = $('form #signature').val();
    		var mname = $('form #fname').val();
    		var dob = $('form #lname').val();
    		var dl = $('form #telephone').val();
    		var address = $('form #cell').val();
    		var city = $('form #email').val();
    		var state = $('form #signature').val();
    		var zip = $('form #fname').val();
    		var telephone = $('form #lname').val();
    		var cell = $('form #telephone').val();
    		var ename = $('form #cell').val();
    		var elname = $('form #email').val();
    		var ephone = $('form #signature').val();	
    		var ecell = $('form #fname').val();
    		var availability = $('form #lname').val();
    		var previouos = $('form #telephone').val();
    		var company = $('form #cell').val();
    		var title = $('form #email').val();
    		var supervisor = $('form #signature').val();
    		var supervisorphone = $('form #signature').val();
    		var leaving = $('form #signature').val();
    		var sex = $('form #signature').val();
    		var proof = $('form #signature').val();
    		var signature = $('form #signature').val();
    		var datesign = $('form #signature').val();
    			
    			// perform error checking
    		if (fname = '' || fname.length <= 2) {
    			valid = '<p>Your first name' + required +'</p>';	
    		}
    		
    		if (lname = '' || lname.length <= 2) {
    			valid = '<p>Your last name' + required +'</p>';	
    		}
    		
    		if (telephone = '' || telephone.length  <= 7) {
    			valid = '<p>Your phone' + required +'</p>';
    
    			
    		}
    		
    		if (cell = '' || cell.length <= 7) {		
    			valid = '<p>Your telephone ' + required +'</p>';
    		
    		
    	    }
    		
    		if (!email.match(/^([a-z0-9._-]+@[a-z0-9._-]+\.[a-z]{2,4}$)/i)) {
    			valid += '<p>Your email' + required +'</p>';												  
    		}
    
    
    		if (signature = '' || message.length <= 5) {
    			valid += '<p>Your signature' + required + '</p>';	
    	
    		}
    		
    		// let the user know if there are erros with the form
    		if (valid != '') {
    			
    			$('form #response').removeClass().addClass('error')
    				.html('<strong>Please correct the errors below.</strong>' +valid).fadeIn('normal');			
    		}
    		// let the user know something is happening behind the scenes
    		// serialize the form data and send to our ajax function
    		else {
    			
    			$('form #response').removeClass().addClass('processing').html('Sending message...').fadeIn('normal');										
    			
    			var formData = $('form').serialize();
    			submitForm(formData);			
    		}			
    			
    	});
    });
    
    // make our ajax request to the server
    function submitForm(formData) {
    	
    	$.ajax({	
    		type: 'POST',
    		url: 'actions/appSubmit.php',		
    		data: formData,
    		dataType: 'json',
    		cache: false,
    		timeout: 7000,
    		success: function(data) { 			
    			
    			$('form #response').removeClass().addClass((data.error === true) ? 'error' : 'success')
    						.html(data.msg).fadeIn('fast');	
    						
    			if ($('form #response').hasClass('success')) {
    				
    				setTimeout("$('form #response').fadeOut('fast')", 5000);
    			}
    		
    		},
    		error: function(XMLHttpRequest, textStatus, errorThrown) {
    						
    			$('form #response').removeClass().addClass('error')
    						.html('<p>There was a<strong> ' + errorThrown +
    							  '</strong> error due to a<strong> ' + textStatus +
    							  '</strong> condition.</p>').fadeIn('fast');			
    		},				
    		complete: function(XMLHttpRequest, status) { 			
    			
    			$('form')[0].reset();
    		}
    	});	
    };
    Last edited by Nicholas Diaz; 05-06-2013 at 01:36 PM.

  7. #7
    Join Date
    Aug 2012
    Location
    TX
    Posts
    293
    Code:
     <?php 
    sleep(2);
    //Sanitize incoming data and store in variable
    
    $date =  trim(stripslashes(htmlspecialchars ($_POST['date'])));		
    $position =  trim(stripslashes(htmlspecialchars ($_POST['position'])));	
    $email =  trim(stripslashes(htmlspecialchars ($_POST['email'])));	
    $experience = trim(stripslashes(htmlspecialchars ($_POST['experience'])));	
    $fname =  trim(stripslashes(htmlspecialchars ($_POST['fname'])));	
    $lname =  trim(stripslashes(htmlspecialchars ($_POST['lname'])));	
    $mname =  trim(stripslashes(htmlspecialchars ($_POST['mname'])));	
    $dob =  trim(stripslashes(htmlspecialchars ($_POST['dob'])));	
    $dl =  trim(stripslashes(htmlspecialchars ($_POST['dl'])));	
    $address =  trim(stripslashes(htmlspecialchars ($_POST['address'])));	
    $city =  trim(stripslashes(htmlspecialchars ($_POST['city'])));	
    $state =  trim(stripslashes(htmlspecialchars ($_POST['state'])));	
    $zip =  trim(stripslashes(htmlspecialchars ($_POST['zip'])));	
    $telephone =  trim(stripslashes(htmlspecialchars ($_POST['telephone'])));	
    $cell =  trim(stripslashes(htmlspecialchars ($_POST['cell'])));	
    $ename =  trim(stripslashes(htmlspecialchars ($_POST['ename'])));	
    $elname =  trim(stripslashes(htmlspecialchars ($_POST['elname'])));	
    $ephone =  trim(stripslashes(htmlspecialchars ($_POST['ephone'])));	
    $ecell =  trim(stripslashes(htmlspecialchars ($_POST['ecell'])));	
    $availability =  trim(stripslashes(htmlspecialchars ($_POST['availability'])));	
    $previous =  trim(stripslashes(htmlspecialchars ($_POST['previous'])));	
    $company =  trim(stripslashes(htmlspecialchars ($_POST['company'])));	
    $title =  trim(stripslashes(htmlspecialchars ($_POST['title'])));	
    $supervisor =  trim(stripslashes(htmlspecialchars ($_POST['supervisor'])));	
    $supervisorphone =  trim(stripslashes(htmlspecialchars ($_POST['supervisorphone'])));	
    $leaving =  trim(stripslashes(htmlspecialchars ($_POST['leaving'])));	
    $sex =  trim(stripslashes(htmlspecialchars ($_POST['sex'])));	
    $proof =  trim(stripslashes(htmlspecialchars ($_POST['proof'])));	
    $signature =  trim(stripslashes(htmlspecialchars ($_POST['signature'])));	
    $datesign =  trim(stripslashes(htmlspecialchars ($_POST['datesign'])));	
    $humancheck = $_POST['humancheck'];
    $honeypot = $_POST['honeypot'];
    
    
    if ($honeypot == 'http://' && empty($humancheck)) {		
    			
    		//Validate data and return success or error message
    		$error_message = '';	
    		}
    		if (empty($fname)) {
    				   
    				    $error_message .= "<p>Please provide your first name, provide at least 2 characters in this field.</p>";	
    					
    		if (empty($lname)) {
    				   
    				    $error_message .= "<p>Please provide your last name, provide at least 2 characters in this field.</p>";			   
    		}
    		if (empty($telephone)) {
    				   
    				    $error_message .= "<p>Please provide your phone number with area code.</p>";			   
    		}				
    		if (empty($cell)) {
    					
    					$error_message .= "<p>Please provide cell with area code</p>";
    		}	
    			if (empty($signature)) {
    					
    					$error_message .= "<p>Please provide E signature</p>";
    		}				
    		$reg_exp = "/^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9-]+\.[a-zA-Z.]{2,4}$/";
    		
    		if (!preg_match($reg_exp, $email)) {
    				    
    					$error_message .= "<p>A valid email address is required.</p>";			   
    		}
    		
    			
    		if (!empty($error_message)) {
    					$return['error'] = true;
    					$return['msg'] = "<h3>Oops! The request was successful but your form is not filled out correctly.</h3>"
    					.$error_message;					
    					echo json_encode($return);
    					exit();
    					
    		} else {
    			
    				//Prepare information from form to be sent
    				$to = 'admin@skylinestaffingservices.com';
    				$from = 'admin@skylinestaffingservices.com';	
    				$headers = 'MIME-VERSION: 1.0' . '\n';
    				$headers .= 'From: $from' . '\n';	
    				$subject = 'New Application Submission';
    				$body = 'Date: ' .$date . PHP_EOL;
    				$body .= 'Position: ' .$position . PHP_EOL;
    				$body .= 'Email: ' .$email . PHP_EOL;
    				$body .= 'Experience: ' .$experience . PHP_EOL;
    				$body = 'Name: ' .$fname . PHP_EOL;
    				$body .= 'Last Name: ' .$lname . PHP_EOL;
    				$body .= 'Middle Name: ' .$mname . PHP_EOL;
    				$body .= 'DOB: ' .$dob . PHP_EOL;
    				$body = 'DL: ' .$dl . PHP_EOL;
    				$body .= 'Address: ' .$address . PHP_EOL;
    				$body .= 'city: ' .$city . PHP_EOL;
    				$body .= 'State: ' .$state . PHP_EOL;
    				$body = 'Zip: ' .$zip . PHP_EOL;
    				$body .= 'telephone: ' .$telephone . PHP_EOL;
    				$body .= 'cell: ' .$cell . PHP_EOL;
    				$body .= 'Emergency Name: ' .$ename . PHP_EOL;
    				$body = 'Emergency Last Name: ' .$elname . PHP_EOL;
    				$body .= 'Emergency Phone: ' .$ephone . PHP_EOL;
    				$body .= 'Emergency Cell: ' .$ecell . PHP_EOL;
    				$body .= 'Availability: ' .$availability . PHP_EOL;
    				$body = 'Previously Worked For SSS: ' .$previous . PHP_EOL;
    				$body .= 'Company: ' .$company . PHP_EOL;
    				$body .= 'Title: ' .$title . PHP_EOL;
    				$body .= 'Supervisor: ' .$supervisor . PHP_EOL;
    				$body .= 'Supervisor Phone Number: ' .$supervisorphone . PHP_EOL;
    				$body .= 'Reason For Leaving: ' .$leaving . PHP_EOL;
    				$body .= 'Gender: ' .$sex . PHP_EOL;
    				$body .= 'Documents To Work: ' .$proof . PHP_EOL;
    				$body .= 'E Signature: ' .$signature . PHP_EOL;
    				$body .= 'E Date: ' .$datesign . PHP_EOL;
    				
    				// Form data was successfull so we will now send admin email and return message to the user
    				if(mail($to, $subject, $body, $headers, '-f admin@skylinestaffingservices.com')) { 
    							  
    					$return['error'] = false;
    					$return['msg'] = "<p>We will be in touch soon " .$fname .".</p>"; 
    					echo json_encode($return);
    				
    		} else {
    	
    	$return['error'] = true;
    	$return['msg'] = "<h3>Oops! We are having trouble submitting your application. Please try us directly at admin@skylinestaffingservices.com</h3>";	
    	echo json_encode($return);
    		}
    		}
    
    }
    
    ?>

  8. #8
    Join Date
    May 2006
    Location
    Somewhere behind your screen
    Posts
    1,670
    try this script

    Code:
    $(document).ready(function() {
    $('#response').hide();
    $('#submit').click(function(e) {
    // prevent forms default action until
    // error check has been performed
    e.preventDefault();
    
    // grab form field values
    var valid = '';
    var required = ' is required.';
    var fname = $('#fname').val();
    var lname = $('#lname').val();
    var telephone = $('#telephone').val();
    var cell = $('#cell').val();
    var email = $('#email').val();
    var signature = $('#signature').val();
    
    // perform error checking
    if(fname == '' || fname.length <= 2){
    valid = '<p>Your first name' + required +'</p>'; 
    }
    
    if(lname == '' || lname.length <= 2){
    valid = '<p>Your last name' + required +'</p>'; 
    }
    
    if(telephone == '' || telephone.length <= 7){
    valid = '<p>Your phone' + required +'</p>';
    }
    
    if(cell == '' || cell.length <= 7){ 
    valid = '<p>Your telephone ' + required +'</p>';
    }
    
    if(!email.match(/^([a-z0-9._-]+@[a-z0-9._-]+\.[a-z]{2,4}$)/i)){
    valid += '<p>Your email' + required +'</p>'; 
    }
    
    if(signature == '' || message.length <= 5){
    valid += '<p>Your signature' + required + '</p>'; 
    }
    
    // let the user know if there are erros with the form
    if(valid != ''){
    $('#response').removeClass().addClass('error').html('<strong>Please correct the errors below.</strong>' +valid).fadeIn('normal'); 
    }
    // let the user know something is happening behind the scenes
    // serialize the form data and send to our ajax function
    else{
    $('#response').removeClass().addClass('processing').html('Sending message...').fadeIn('normal'); 
    var formData = $('form').serialize();
    submitForm(formData); 
    } 
    
    });
    });
    
    // make our ajax request to the server
    function submitForm(formData){
    $.ajax({ 
    type: 'POST',
    url: 'actions/appSubmit.php', 
    data: formData,
    dataType: 'json',
    cache: false,
    timeout: 7000,
    success: function(data){
    $('#response').removeClass().addClass((data.error === true) ? 'error' : 'success').html(data.msg).fadeIn('fast'); 
    if($('#response').hasClass('success')){
    setTimeout("$('#response').fadeOut('fast')", 5000);
    }
    },
    error: function(XMLHttpRequest, textStatus, errorThrown) {
    $('#response').removeClass().addClass('error').html('<p>There was a<strong> ' + errorThrown +'</strong> error due to a<strong> ' + textStatus +'</strong> condition.</p>').fadeIn('fast');
    }, 
    complete: function(XMLHttpRequest, status){$('form')[0].reset();}
    }); 
    };

  9. #9
    Join Date
    Aug 2012
    Location
    TX
    Posts
    293
    is it necessary in the js file to grab all form fields or only the ones your checking?

  10. #10
    Join Date
    Aug 2012
    Location
    TX
    Posts
    293
    the code you gave me didnt work....

  11. #11
    Join Date
    May 2006
    Location
    Somewhere behind your screen
    Posts
    1,670
    for me the code works good. make sure that the code has no lines like this

    Code:
    $('#response').removeClass()
    .addClass('processing').html('Sending 
    message...').fadeIn('normal');
    or

    Code:
    $('#response').removeClass().addClass('error')
    .html('<p>There was a<strong> ' 
    + errorThrown +'</strong> error due to a<strong> ' 
    + textStatus +'</strong> condition.</p>').fadeIn('fast');

    all such lines must not have linebreaks
    Last edited by Padonak; 05-06-2013 at 03:11 PM.

  12. #12
    Join Date
    Aug 2012
    Location
    TX
    Posts
    293
    should i be putting every value on the form in the .js file? or only the ones that im checking for errors?

    on the php form i have 20 something values on the .js only the ones that need to be filled in...

    if you look back through my code you will see what im talking about... this is my current .js file

    Code:
      
    
    $(document).ready(function() {
    	
    	$('form #response').hide();
    	
    	$('#submit').click(function(e) {
    		
    		// prevent forms default action until
    		// error check has been performed
    		e.preventDefault();
    				
    		// grab form field values
    		var valid = '';
    		var required = ' is required.';
    		var date = $('form #fname').val();
    		var position = $('form #lname').val();
    		var email = $('form #telephone').val();
    		var experience = $('form #cell').val();
    		var fname = $('form #email').val();
    		var lname = $('form #signature').val();
    		var mname = $('form #fname').val();
    		var dob = $('form #lname').val();
    		var dl = $('form #telephone').val();
    		var address = $('form #cell').val();
    		var city = $('form #email').val();
    		var state = $('form #signature').val();
    		var zip = $('form #fname').val();
    		var telephone = $('form #lname').val();
    		var cell = $('form #telephone').val();
    		var ename = $('form #cell').val();
    		var elname = $('form #email').val();
    		var ephone = $('form #signature').val();	
    		var ecell = $('form #fname').val();
    		var availability = $('form #lname').val();
    		var previouos = $('form #telephone').val();
    		var company = $('form #cell').val();
    		var title = $('form #email').val();
    		var supervisor = $('form #signature').val();
    		var supervisorphone = $('form #signature').val();
    		var leaving = $('form #signature').val();
    		var sex = $('form #signature').val();
    		var proof = $('form #signature').val();
    		var signature = $('form #signature').val();
    		var datesign = $('form #signature').val();
    			
    			// perform error checking
    		if (fname = '' || fname.length <= 2) {
    			valid = '<p>Your first name' + required +'</p>';	
    		}
    		
    		if (lname = '' || lname.length <= 2) {
    			valid = '<p>Your last name' + required +'</p>';	
    		}
    		
    		if (telephone = '' || telephone.length  <= 7) {
    			valid = '<p>Your phone' + required +'</p>';
    
    			
    		}
    		
    		if (cell = '' || cell.length <= 7) {		
    			valid = '<p>Your telephone ' + required +'</p>';
    		
    		
    	    }
    		
    		if (!email.match(/^([a-z0-9._-]+@[a-z0-9._-]+\.[a-z]{2,4}$)/i)) {
    			valid += '<p>Your email' + required +'</p>';												  
    		}
    
    
    		if (signature = '' || message.length <= 5) {
    			valid += '<p>Your signature' + required + '</p>';	
    	
    		}
    		
    		// let the user know if there are erros with the form
    		if (valid != '') {
    			
    			$('form #response').removeClass().addClass('error')
    				.html('<strong>Please correct the errors below.</strong>' +valid).fadeIn('normal');			
    		}
    		// let the user know something is happening behind the scenes
    		// serialize the form data and send to our ajax function
    		else {
    			
    			$('form #response').removeClass().addClass('processing').html('Sending message...').fadeIn('normal');										
    			
    			var formData = $('form').serialize();
    			submitForm(formData);			
    		}			
    			
    	});
    });
    
    // make our ajax request to the server
    function submitForm(formData) {
    	
    	$.ajax({	
    		type: 'POST',
    		url: 'actions/appSubmit.php',		
    		data: formData,
    		dataType: 'json',
    		cache: false,
    		timeout: 7000,
    		success: function(data) { 			
    			
    			$('form #response').removeClass().addClass((data.error === true) ? 'error' : 'success')
    						.html(data.msg).fadeIn('fast');	
    						
    			if ($('form #response').hasClass('success')) {
    				
    				setTimeout("$('form #response').fadeOut('fast')", 5000);
    			}
    		
    		},
    		error: function(XMLHttpRequest, textStatus, errorThrown) {
    						
    			$('form #response').removeClass().addClass('error')
    						.html('<p>There was a<strong> ' + errorThrown +
    							  '</strong> error due to a<strong> ' + textStatus +
    							  '</strong> condition.</p>').fadeIn('fast');			
    		},				
    		complete: function(XMLHttpRequest, status) { 			
    			
    			$('form')[0].reset();
    		}
    	});	
    };

  13. #13
    Join Date
    May 2006
    Location
    Somewhere behind your screen
    Posts
    1,670
    in the .js file you need only the fields that need to be checked i think

  14. #14
    Join Date
    Aug 2012
    Location
    TX
    Posts
    293
    both of those lines you referred to are in my code.. should i delete them? how will i give a response then?

  15. #15
    Join Date
    Aug 2012
    Location
    TX
    Posts
    293
    I think I found the problem. When I click on the submit button it puts my cursor in it and lets me edit the text. its not functioning as a button but as a field.... can you look at the html form and tell me what you see at the submit button location please.

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles