Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #10004362
    RKrijger
    Participant

    Hello,

    In my test server I am trying to make a sidebar that includes a contact form. To leave a Name en phone number.

    It is because we want to call them back as soon as we get the email.

    I have tried to make another contact-form.php (in my case afspraak.php)

    But it keeps giving me the error.

    Anyone?


    #10004367
    Support
    Keymaster

    Hello,

    My suggestion is that you use another form, and not the same you use in the contact form:

    1) Duplicate and rename the file php/contact-form.php to php/call-me-back.php

    2) Set the action in the form and change the ID:

    <form method="POST" action="php/call-me-back.php" id="callMeBack" novalidate="novalidate">

    3) In the js file (js/views/view.contact.js) create another function to send the contact via Ajax, something like this:

    Those are the basic steps.

    Let me know if you have any questions.

    Thanks.


    #10004401
    RKrijger
    Participant

    Hello,

    I have a very hard time to change it into a working form.

    By just changing the name the contact form doesn’t work.

    I just want them to leave a name and phone number.
    What do i need to change in the code?


    #10004405
    Support
    Keymaster

    Hello, please try this:

    HTML:

    <div class="alert alert-success hidden" id="callMeBackSuccess">
    	<strong>Gelukt!</strong> Uw bericht is succesvol verstuurd.
    </div>
    
    <div class="alert alert-danger hidden" id="callMeBackError">
    	<strong>Mislukt!</strong> Er is een error opgetreden tijdens het versturen van uw bericht.
    </div>
    
    <h2 class="short"><strong>Direct</strong> een afspraak?</h2>
    <form id="callMeBack" action="php/call-me-back.php" method="POST">
    	<div class="row">
    		<div class="form-group">
    			<div class="col-md-12">
    				<label>Uw naam *</label>
    				<input type="text" value="" data-msg-required="Vul uw naam in aub." maxlength="100" class="form-control" name="naam" id="naam" required>
    			</div>
    		</div>
    	</div>
    	<div class="row">
    		<div class="form-group">
    			<div class="col-md-12">
    				<label>Telefoon *</label>
    				<input type="text" value="" data-msg-required="Voer een telefoonnummer in aub." maxlength="100" class="form-control" name="telefoonnummer" id="telefoonnummer" required>
    			</div>
    		</div>
    	</div>
    	
    	<div class="row">
    		<div class="col-md-12">
    			<input type="submit" value="Bel mij terug" class="btn btn-primary btn-lg" data-loading-text="Laden..."><br><br>
    		</div>
    	</div>
    </form>

    JS:
    (js/custom.js)

    (function($) {
    
    	'use strict';
    
    	$('#callMeBack').validate({
    		submitHandler: function(form) {
    
    			var $form = $(form),
    				$messageSuccess = $('#callMeBackSuccess'),
    				$messageError = $('#callMeBackError'),
    				$submitButton = $(this.submitButton);
    
    			$submitButton.button('loading');
    
    			// Ajax Submit
    			$.ajax({
    				type: 'POST',
    				url: $form.attr('action'),
    				data: {
    					naam: $form.find('#naam').val(),
    					telefoonnummer: $form.find('#telefoonnummer').val()
    				},
    				dataType: 'json',
    				complete: function(data) {
    				
    					if (typeof data.responseJSON === 'object') {
    						if (data.responseJSON.response == 'success') {
    
    							$messageSuccess.removeClass('hidden');
    							$messageError.addClass('hidden');
    
    							// Reset Form
    							$form.find('.form-control')
    								.val('')
    								.blur()
    								.parent()
    								.removeClass('has-success')
    								.removeClass('has-error')
    								.find('label.error')
    								.remove();
    
    							if (($messageSuccess.offset().top - 80) < $(window).scrollTop()) {
    								$('html, body').animate({
    									scrollTop: $messageSuccess.offset().top - 80
    								}, 300);
    							}
    
    							$submitButton.button('reset');
    							
    							return;
    
    						}
    					}
    
    					$messageError.removeClass('hidden');
    					$messageSuccess.addClass('hidden');
    
    					if (($messageError.offset().top - 80) < $(window).scrollTop()) {
    						$('html, body').animate({
    							scrollTop: $messageError.offset().top - 80
    						}, 300);
    					}
    
    					$form.find('.has-success')
    						.removeClass('has-success');
    						
    					$submitButton.button('reset');
    
    				}
    			});
    		}
    	});
    
    }).apply(this, [jQuery]);

    PHP:
    (php/call-me-back.php)

    <?php
    session_cache_limiter('nocache');
    header('Expires: ' . gmdate('r', 0));
    
    header('Content-type: application/json');
    
    // Step 1 - Enter your email address below.
    $to = '[email protected]';
    
    // Step 2 - Enable if the server requires SMTP authentication. (true/false)
    $enablePHPMailer = false;
    
    $subject = $_POST['subject'];
    
    $name = $_POST['naam'];
    $email = $to;
    
    $fields = array(
    	0 => array(
    		'text' => 'Naam',
    		'val' => $_POST['naam']
    	),
    	1 => array(
    		'text' => 'Telefoon',
    		'val' => $_POST['telefoonnummer']
    	)
    );
    
    $message = "";
    
    foreach($fields as $field) {
    	$message .= $field['text'].": " . htmlspecialchars($field['val'], ENT_QUOTES) . "<br>\n";
    }
    
    // Simple Mail
    if(!$enablePHPMailer) {
    
    	$headers = '';
    	$headers .= 'From: ' . $name . ' <' . $email . '>' . "\r\n";
    	$headers .= "Reply-To: " .  $email . "\r\n";
    	$headers .= "MIME-Version: 1.0\r\n";
    	$headers .= "Content-Type: text/html; charset=UTF-8\r\n";
    
    	if (mail($to, $subject, $message, $headers)){
    		$arrResult = array ('response'=>'success');
    	} else{
    		$arrResult = array ('response'=>'error');
    	}
    
    // PHP Mailer Library - Docs: https://github.com/PHPMailer/PHPMailer
    } else {
    
    	include("php-mailer/PHPMailerAutoload.php");
    
    	$mail = new PHPMailer;
    
    	$mail->IsSMTP();                                      // Set mailer to use SMTP
    	$mail->SMTPDebug = 0;                                 // Debug Mode
    
    	// Step 3 - If you don't receive the email, try to configure the parameters below:
    
    	//$mail->Host = 'mail.yourserver.com';				  // Specify main and backup server
    	//$mail->SMTPAuth = true;                             // Enable SMTP authentication
    	//$mail->Username = 'username';             		  // SMTP username
    	//$mail->Password = 'secret';                         // SMTP password
    	//$mail->SMTPSecure = 'tls';                          // Enable encryption, 'ssl' also accepted
    
    	$mail->From = $email;
    	$mail->FromName = $_POST['name'];
    	$mail->AddAddress($to);								  // Add a recipient
    	$mail->AddReplyTo($email, $name);
    
    	$mail->IsHTML(true);                                  // Set email format to HTML
    
    	$mail->CharSet = 'UTF-8';
    
    	$mail->Subject = $subject;
    	$mail->Body    = $message;
    
    	if(!$mail->Send()) {
    	   $arrResult = array ('response'=>'error');
    	}
    
    	$arrResult = array ('response'=>'success');
    
    }
    
    echo json_encode($arrResult);
    
    ?>

    Let me know if you have any questions.

    Thanks.


Viewing 4 posts - 1 through 4 (of 4 total)

This topic is marked as "RESOLVED" and can not rceive new replies.