I'm working on a Bootstrap contact form with validation, the problem is I cannot get the PHP echo response to show on a specific DIV, after the form is sent, browser loads my contact.php file with the response. Is there any way to show the response on #success_message DIV on the same HTML? Here's my HTML:
<!DOCTYPE html>
<html >
<head>
<meta charset="UTF-8">
<title>Bootstrap 3 Contact form with Validation</title>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">
<link rel='stylesheet prefetch' href='http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap-theme.min.css'>
<link rel='stylesheet prefetch' href='http://cdnjs.cloudflare.com/ajax/libs/jquery.bootstrapvalidator/0.5.0/css/bootstrapValidator.min.css'>
<link rel="stylesheet" href="css/style.css">
</head>
<body>
<div class="container">
<form class="well form-horizontal" action="php/contacto.php" method="post" id="contact_form">
<fieldset>
<div class="form-group">
<label class="col-md-4 control-label">Tu nombre</label>
<div class="col-md-4 inputGroupContainer">
<div class="input-group">
<span class="input-group-addon"><i class="glyphicon glyphicon-user"></i></span>
<input name="first_name" placeholder="¿Como te llamas?" class="form-control" type="text">
</div>
</div>
</div>
<div class="form-group">
<label class="col-md-4 control-label" >Tu apellido</label>
<div class="col-md-4 inputGroupContainer">
<div class="input-group">
<span class="input-group-addon"><i class="glyphicon glyphicon-user"></i></span>
<input name="last_name" placeholder="Tu apellido" class="form-control" type="text">
</div>
</div>
</div>
<div class="form-group">
<label class="col-md-4 control-label">E-Mail</label>
<div class="col-md-4 inputGroupContainer">
<div class="input-group">
<span class="input-group-addon"><i class="glyphicon glyphicon-envelope"></i></span>
<input name="email" placeholder="tucorreo#mail.com" class="form-control" type="text">
</div>
</div>
</div>
<div class="form-group">
<label class="col-md-4 control-label">Teléfono</label>
<div class="col-md-4 inputGroupContainer">
<div class="input-group">
<span class="input-group-addon"><i class="glyphicon glyphicon-earphone"></i></span>
<input name="phone" placeholder="(55)1234-5678" class="form-control" type="text">
</div>
</div>
</div>
<div class="form-group">
<label class="col-md-4 control-label">Tu comentario</label>
<div class="col-md-4 inputGroupContainer">
<div class="input-group">
<span class="input-group-addon"><i class="glyphicon glyphicon-pencil"></i></span>
<textarea rows="4" class="form-control" name="comment" placeholder="¡Cuéntanos como podemos ayudarte!"></textarea>
</div>
</div>
</div>
<!-- Success message -->
<div class="alert alert-success" role="alert" id="success_message">¡Listo!<i class="glyphicon glyphicon-thumbs-up"></i> Tu mensaje fue enviado, en breve nos pondremos en contacto contigo.</div>
<!-- Button -->
<div class="form-group">
<label class="col-md-4 control-label"></label>
<div class="col-md-4">
<button type="submit" class="btn btn-warning" >Enviar <span class="glyphicon glyphicon-send"></span></button>
</div>
</div>
</fieldset>
</form>
</div>
<script src='http://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js'></script>
<script src='http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js'></script>
<script src='http://cdnjs.cloudflare.com/ajax/libs/bootstrap-validator/0.4.5/js/bootstrapvalidator.min.js'></script>
<script src="js/index.js"></script>
</body>
Here's my JS:
$(document).ready(function() {
$('#contact_form').bootstrapValidator({
// To use feedback icons, ensure that you use Bootstrap v3.1.0 or later
feedbackIcons: {
valid: 'glyphicon glyphicon-ok',
invalid: 'glyphicon glyphicon-remove',
validating: 'glyphicon glyphicon-refresh'
},
fields: {
first_name: {
validators: {
stringLength: {
min: 2,
},
notEmpty: {
message: '¡Queremos saber tu nombre!'
}
}
},
last_name: {
validators: {
stringLength: {
min: 2,
},
notEmpty: {
message: 'Por favor, dinos tu apellido'
}
}
},
email: {
validators: {
notEmpty: {
message: 'Necesitamos una dirección de correo donde contactarte'
},
emailAddress: {
message: 'Tu dirección de correo no es válida'
}
}
},
phone: {
validators: {
notEmpty: {
message: 'Por favor, proporcionanos tu teléfono'
},
phone: {
country: 'MX',
message: 'Incluye un número de teléfono válido de 10 dígitos'
}
}
},
comment: {
validators: {
stringLength: {
min: 10,
max: 200,
message:'Please enter at least 10 characters and no more than 200'
},
notEmpty: {
message: 'Please supply a description of your project'
}
}
}
}
})
.on('success.form.bv', function(e) {
$('#success_message').slideDown({ opacity: "show" }, "slow") // Do something ...
$('#contact_form').data('bootstrapValidator').resetForm();
// Prevent form submission
e.preventDefault();
// Get the form instance
var $form = $(e.target);
// Get the BootstrapValidator instance
var bv = $form.data('bootstrapValidator');
// Use Ajax to submit form data
$.post($form.attr('action'), $form.serialize(), function(result) {
console.log(result);
}, 'json');
});
});
And my PHP:
$EmailFrom = "contacto#tuka.mx";
$EmailTo = "manuel#tuka.mx";
$Subject = "Nuevo comentario en el website";
$first_name = Trim(stripslashes($_POST['first_name']));
$last_name = Trim(stripslashes($_POST['last_name']));
$email = Trim(stripslashes($_POST['email']));
$phone = Trim(stripslashes($_POST['phone']));
$comment = Trim(stripslashes($_POST['comment']));
// prepare email body text
$Body = "";
$Body .= "Nombre: ";
$Body .= $first_name;
$Body .= "\n";
$Body .= "Apellido: ";
$Body .= $last_name;
$Body .= "\n";
$Body .= "E-mail: ";
$Body .= $email;
$Body .= "\n";
$Body .= "Teléfono: ";
$Body .= $phone;
$Body .= "\n";
$Body .= "Comentario: ";
$Body .= $comment;
$Body .= "\n";
// send email
$success = mail($EmailTo, $Subject, $Body, "From: <$EmailFrom>");
// redirect to success page
if ($success){
echo "<h2>¡Gracias! Recibimos tu mensaje</h2>";
}
else{
echo "<h2>Lo sentimos, hubo un error, inténtalo nuevamente</h2>";
}
?>
I have already uploaded it here, if you want to see it working:
http://tuka.mx/beta/contacto/index.html
The first parameter for .on() method must be event.
Here
.on('success.form.bv', function(e) {
Must be:
.on('submit', function(e) {
Looks something was wrong on JS, here's a solution:
$(document).ready(function() {
$('#contact_form').bootstrapValidator({
// To use feedback icons, ensure that you use Bootstrap v3.1.0 or later
feedbackIcons: {
valid: 'glyphicon glyphicon-ok',
invalid: 'glyphicon glyphicon-remove',
validating: 'glyphicon glyphicon-refresh'
},
submitHandler: function(validator, form, submitButton) {
$('#success_message').slideDown({ opacity: "show" }, "slow") // Do something ...
$('#contact_form').data('bootstrapValidator').resetForm();
var bv = form.data('bootstrapValidator');
// Use Ajax to submit form data
$.post(form.attr('action'), form.serialize(), function(result) {
console.log(result);
}, 'json');
},
fields: {
first_name: {
validators: {
stringLength: {
min: 2,
},
notEmpty: {
message: '¡Queremos saber tu nombre!'
}
}
},
last_name: {
validators: {
stringLength: {
min: 2,
},
notEmpty: {
message: 'Por favor, dinos tu apellido'
}
}
},
email: {
validators: {
notEmpty: {
message: 'Necesitamos una dirección de correo donde contactarte'
},
emailAddress: {
message: 'Tu dirección de correo no es válida'
}
}
},
phone: {
validators: {
notEmpty: {
message: 'Por favor, proporcionanos tu teléfono'
},
phone: {
country: 'MX',
message: 'Incluye un número de teléfono válido de 10 dígitos'
}
}
},
comment: {
validators: {
stringLength: {
min: 10,
max: 200,
message:'Please enter at least 10 characters and no more than 200'
},
notEmpty: {
message: 'Please supply a description of your project'
}
}
}
}
})
});
Related
I use Bootstrap validation with tooltips. I want to validate form (username, password) but the button (btn-login) isn't isset (returns NULL). It never goes to loop in PHP code (above). This is my code - HTML and JS
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Register form</title>
<link href='http://fonts.googleapis.com/css?family=Montserrat:400,700' rel='stylesheet' type='text/css'>
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script>
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/formvalidation/0.6.1/css/formValidation.min.css"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/formvalidation/0.6.1/js/formValidation.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/formvalidation/0.6.1/js/framework/bootstrap.min.js"></script>
</head>
<body>
<div id="message"></div>
<form id="tooltipContainerForm" class="form-horizontal" method="post">
<div class="form-group">
<label class="col-xs-3 control-label">Full name</label>
<div class="col-xs-3">
<input type="text" class="form-control" name="username" placeholder="User name" />
</div>
<div class="col-xs-3">
<input type="password" class="form-control" name="password" placeholder="Password" />
</div>
</div>
<div class="form-group">
<div class="col-xs-9 col-xs-offset-3">
<button type="submit" class="btn btn-default" name="btn-login" id="btn-login">Validate</button>
</div>
</div>
</form>
<script>
$(document).ready(function() {
$('#tooltipContainerForm')
.formValidation({
framework: 'bootstrap',
err: {
container: 'tooltip'
},
icon: {
valid: 'glyphicon glyphicon-ok',
invalid: 'glyphicon glyphicon-remove',
validating: 'glyphicon glyphicon-refresh'
},
fields: {
username: {
validators: {
notEmpty: {
message: 'The first name is required and can not be empty'
}
}
},
password: {
validators: {
notEmpty: {
message: 'The last name is required and can not be empty'
}
}
},
}
})
.on('success.form.fv', function(e) {
e.preventDefault();
var $form = $(e.target),
fv = $form.data('formValidation');
var myData = $("#tooltipContainerForm").serialize();
alert(myData);
$.ajax({
url: "loginHandler.php",
type: 'POST',
data: myData,
success: function(result) {
if(result=="ok"){
$("#message").fadeIn(1000, function(){
$("#message").html('<div class="alert alert-success alert-dismissible fade in" role="alert" >'+
'<button type="button" class="close" data-dismiss="alert" aria-label="Close">'+
'<span aria-hidden="true">×</span></button><strong>Success login!</strong> You have been successfully logged in. Redirecting in 2 seconds..</div>');
});
setTimeout(' window.location.href = "home.php"; ',2000);
}
else {
$("#message").fadeIn(1000, function(){
$("#message").html('<div class="alert alert-danger alert-dismissible fade in" role="alert" >'+
'<button type="button" class="close" data-dismiss="alert" aria-label="Close">'+
'<span aria-hidden="true">×</span></button><strong>Something wrong!</strong> '+result+'</div>');
});
}
}
});
})
.on('err.field.fv', function(e, data) {
var $icon = data.element.data('fv.icon'),
title = $icon.data('bs.tooltip').getTitle();
$icon.tooltip('destroy').tooltip({
html: true,
placement: 'right',
title: title,
container: 'body'
});
});
});
</script>
</body>
</html>
This is my loginHadler.php. Into if it never goes.
<?php
require("functions.php");
session_start();
var_dump($_POST['btn-login']);
if(isset($_POST['btn-login'])){
$db = getDb();
//validate($_POST['user'], $db);
$passwordHash = sha1($_POST['password']);
$query = getSelectQuery("users","username",$_POST['username']);
$result = mysqli_query($db, $query);
if ($result) {
$row = $result->fetch_array(MYSQLI_ASSOC);
if($row['password']==$passwordHash){
echo "ok";
$_SESSION['username'] = $row['username'];
} else {
echo "Username or password does not match.";
}
} else {
echo mysqli_error($db);
}
}
You cant check if a button isset. You can only check if the $_POST variables are set. do an isset($_POST['username'])
<?php
require("functions.php");
session_start();
var_dump($_POST['username']);
if(isset($_POST['username'])){
$db = getDb();
//validate($_POST['user'], $db);
$passwordHash = sha1($_POST['password']);
$query = getSelectQuery("users","username",$_POST['username']);
$result = mysqli_query($db, $query);
if ($result) {
$row = $result->fetch_array(MYSQLI_ASSOC);
if($row['password']==$passwordHash){
echo "ok";
$_SESSION['username'] = $row['username'];
} else {
echo "Username or password does not match.";
}
} else {
echo mysqli_error($db);
}
}
You need to pass this btn to the data send from Ajax. Do something like this :
$.ajax({
url: "loginHandler.php",
type: 'POST',
data: {myData : myData, btn-login : "val"},
success: function(result) {
........
This is my website: http://bbb.antalyabalikcilik.com.tr/contact-us.html
I have a contact form. I get emails to my email address but the form doesn't show up after email sending 'THANK YOU' alert.
html code:
<!-- contact form -->
<div class='grid_col grid_col_8'>
<div class='ce clearfix'>
<h3 class="ce_title">Drop us a line</h3>
<div>
<div role="form" class="cf" id="cf-f16-p10-o1" lang="en-US" dir="ltr">
<div class="screen-reader-response"></div>
<form action="email.php" method="post" class="cf-form contact-form" novalidate="novalidate">
<p>Name*
<br />
<span class="cf-form-control-wrap your-name"><input type="text" name="name" value="" size="107" class="cf-form-control cf-text cf-validates-as-required" aria-required="true" aria-invalid="false" />
</span>
</p>
<p>Email*
<br />
<span class="cf-form-control-wrap your-email"><input type="email" name="email" value="" size="107" class="cf-form-control cf-text cf-email cf-validates-as-required cf-validates-as-email" aria-required="true" aria-invalid="false" />
</span>
</p>
<p>Message
<br />
<span class="cf-form-control-wrap your-message"><textarea name="message" cols="107" rows="8" class="cf-form-control cf-textarea" aria-invalid="false"></textarea>
</span>
</p>
<p>
<input type="submit" value="Gönder" class="cf-form-control cf-submit" />
</p>
<div class="cws_msg_box error-box clearfix">
<div class="icon_section"><i class="fa fa-exclamation"></i></div>
<div class="content_section">
<div class="msg_box_title">Error box</div>
<div class="msg_box_text"></div>
</div>
</div>
</form>
<div class="email_server_responce"></div>
</div>
</div>`enter code here`
</div>
</div>
<!-- / conatct form -->
email.php
<?php
$name = $_REQUEST['name'] ;
$email = $_REQUEST['email'] ;
$message = $_REQUEST['message'] ;
require("class.phpmailer.php");
$mail = new PHPMailer();
$mail->IsSMTP(); // set mailer to use SMTP
$mail->Host = "mail.xxx.com."; // specify main and backup server
$mail->SMTPAuth = true; // turn on SMTP authentication
$mail->Username = "xxx#xxx.com"; // SMTP username
$mail->Password = "123456789"; // SMTP password
$mail->From = "xxx#xxx.com";
$mail->FromName = "www.xxx.com";
$mail->AddAddress("xxx#hotmail.com");
$mail->WordWrap = 50; // set word wrap to 50 characters
$mail->IsHTML(true); // set email format to HTML
$mail->Subject = "received from website email";
$mail->Body = $message;
$mail->AltBody = $message;
$content = '<div style="background: #eee; padding: 10px; font-size: 14px; font-family: comic sans ms">
İsim : '.$name.'<br />
Email : '.$email.'<br />
Mesaj : '.$message.'</div>';
$mail->MsgHTML($content);
if(!$mail->Send())
{
echo "Message could not be sent. <p>";
echo "Mailer Error: " . $mail->ErrorInfo;
exit;
}
echo "Message has been sent";
?>
js code:
/* contact form */
if (jQuery(".contact-form").length) {
/**/
/* contact form */
/**/
/* validate the contact form fields */
jQuery(".contact-form").each(function(){
jQuery(this).validate( /*feedback-form*/{
onkeyup: false,
onfocusout: false,
errorElement: 'p',
errorLabelContainer: jQuery(this).find('.msg_box_text'),
rules:
{
name:
{
required: true
},
email:
{
required: true,
email: true
},
message:
{
required: true
},
verify: {
required: true,
remote: {
url: 'php/check-capcha.php',
type: "post",
data:
{
code: function()
{
return jQuery('.verify').val();
}
}
}
}
},
messages:
{
name:
{
required: 'Please enter your name',
},
email:
{
required: 'Please enter your email address',
email: 'Please enter a VALID email address'
},
message:
{
required: 'Please enter your message'
},
verify: {
required: 'Please enter Captcha',
remote: "Please enter a VALID Captcha"
}
},
invalidHandler: function()
{
jQuery(this).find(".cws_msg_box.error-box").slideDown('fast');
jQuery("#feedback-form-success").slideUp('fast');
},
submitHandler: function(form)
{
jQuery(form).find(".cws_msg_box.error-box").slideUp('fast');
var $form = jQuery(form).ajaxSubmit();
submit_handler($form, jQuery(form).parent().children(".email_server_responce") );
}
});
})
/* Ajax, Server response */
var submit_handler = function (form, wrapper){
var $wrapper = jQuery(wrapper); //this class should be set in HTML code
$wrapper.css("display","block");
var data = {
action: "email_server_responce",
values: jQuery(form).serialize()
};
//send data to server
jQuery.post("email.php", data, function(s_response) {
s_response = jQuery.parseJSON(s_response);
if(s_response.info == 'success'){
$wrapper.addClass("message message-success").append('<div class="cws_msg_box success-box clearfix"><div class="icon_section"><i class="fa fa-thumbs-up"></i></div><div class="content_section"><div class="msg_box_title">Success!</div><div class="msg_box_text">Your message was successfully delivered.</div></div></div>');
$wrapper.delay(5000).hide(500, function(){
jQuery(this).removeClass("message message-success").text("").fadeIn(500);
$wrapper.css("display","none");
});
jQuery(form)[0].reset();
} else {
$wrapper.addClass("cws_msg_box error-box clearfix").append("<div class='icon_section'><i class='fa fa-exclamation'></i></div><div class='content_section'><div class='msg_box_title'>Server fail!</div><div class='msg_box_text'><p> Please try again later!</p></div></div>");
$wrapper.delay(5000).hide(500, function(){
jQuery(this).removeClass("cws_msg_box error-box clearfix").text("").fadeIn(500);
$wrapper.css("display","none");
});
}
});
return false;
}
}
/**/
What is wrong?Please help me...
i am trying to insert simple username in database.
I wrote the code in bootstrap and then just copied it to netbeans and then insert php code in it.
Script is working well but when i am trying to submit to insert name in database, the submit button disabled and not giving any error or redirecting to another page.
Please help.
I am new on bootstrap.
<?php
include 'includes/db_connection.php';
if (isset($_POST['submit']))
{
//$name = filter_input(INPUT_POST, 'name',FILTER_SANITIZE_STRING);
//$firstname=filter_string('firstname');
$firstname = $_POST['firstname'];
$sql1 ="INSERT INTO student (firstname)
VALUES ('$firstname')";
$res1 = mysqli_query($conn, $sql1);
if($res1)
{
//$last_id = mysqli_insert_id($conn);
header("Location: successful_message.php");
//echo 'Successful';
// . " Last inserted ID is: " . $last_id;
}
else
{
header("Location: valid_test.php");
}
}
else{?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
<link type="text/css" rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
<link type="text/css" rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap-theme.min.css">
<script type="text/javascript" src="https://code.jquery.com/jquery-2.2.0.min.js" type="text/javascript"></script>
<script type="text/javascript" src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" type="text/ecmascript"></script>
<script src="http://formvalidation.io/vendor/formvalidation/js/formValidation.min.js"></script>
<link rel="stylesheet" href="http://formvalidation.io/vendor/formvalidation/css/formValidation.min.css">
<script src="http://formvalidation.io/vendor/formvalidation/js/framework/bootstrap.min.js"></script>
<link href="http://maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet">
<title>Form</title>
<!-- Bootstrap core CSS -->
<!-- Custom styles for this template -->
</head>
<body>
<form id="contactForm" method="post" action="validate-input.php" class="form-horizontal">
<div class="container-fluid">
<div class="container">
<div class="form-group">
<label class="col-xs-3 control-label">Full name</label>
<div class="col-xs-4">
<input type="text" class="form-control" name="firstname" placeholder="First name" />
</div>
<div class="form-group">
<div class="col-xs-9 col-xs-offset-3">
<button type="submit" value="submit" name="submit" class="btn btn-primary">Submit</button>
</div>
</div>
</form>
<?php } ?>
<script>
$(document).ready(function() {
// Generate a simple captcha
function randomNumber(min, max) {
return Math.floor(Math.random() * (max - min + 1) + min);
}
function generateCaptcha() {
$('#captchaOperation').html([randomNumber(1, 100), '+', randomNumber(1, 200), '='].join(' '));
}
generateCaptcha();
$('#contactForm')
.formValidation({
framework: 'bootstrap',
icon: {
valid: 'glyphicon glyphicon-ok',
invalid: 'glyphicon glyphicon-remove',
validating: 'glyphicon glyphicon-refresh'
},
fields: {
firstname: {
row: '.col-xs-4',
validators: {
notEmpty: {
message: 'The first name is required'
},
regexp: {
message: 'Name only contains Letter',
regexp: /^[A-Z a-z]*$/
}
}
},
lastName: {
row: '.col-xs-4',
validators: {
notEmpty: {
message: 'The last name is required'
}
}
},
phoneNumber: {
validators: {
notEmpty: {
message: 'The phone number is required'
},
regexp: {
message: 'The phone number can only contain the digits, spaces, -, (, ), + and .',
regexp: /^[0-9\s\-()+\.]+$/
}
}
},
email: {
validators: {
notEmpty: {
message: 'The email address is required'
},
emailAddress: {
message: 'The input is not a valid email address'
}
}
},
message: {
validators: {
notEmpty: {
message: 'The message is required'
},
stringLength: {
max: 700,
message: 'The message must be less than 700 characters long'
}
}
},
captcha: {
validators: {
callback: {
message: 'Wrong answer',
callback: function(value, validator, $field) {
var items = $('#captchaOperation').html().split(' '),
sum = parseInt(items[0]) + parseInt(items[2]);
return value == sum;
}
}
}
}
}
})
.on('err.form.fv', function(e) {
// Regenerate the captcha
generateCaptcha();
});
});
</script>
</div><!--End container -->
</div><!-- End container-fluid -->
</body>
</html>
remove action from your form
<form id="contactForm" method="post" class="form-horizontal">
you're validating to much on your script. remove other validation other than firstname
I tried it but still need to do it twice, so after submit, change the firstname again then submit again. didn't know is it because your code of the formvalidation.js
<?php
//include 'includes/db_connection.php';
if (isset($_POST['submit'])) {
$firstname = $_POST['firstname'];
$sql1 = "INSERT INTO student (firstname) VALUES ('$firstname')";
$res1 = mysqli_query($conn, $sql1);
if ($res1) {
echo 'succ';
// header("Location: successful_message.php");
} else {
echo 'fail';
// header("Location: valid_test.php");
}
} else {
?>
<script src="http://formvalidation.io/vendor/formvalidation/js/formValidation.min.js"></script>
<link rel="stylesheet" href="http://formvalidation.io/vendor/formvalidation/css/formValidation.min.css">
<script src="http://formvalidation.io/vendor/formvalidation/js/framework/bootstrap.min.js"></script>
<link href="http://maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet">
<title>Form</title>
</head>
<body>
<form id="contactForm" method="post" class="form-horizontal">
<div class="form-group">
<label class="col-xs-3 control-label">Full name</label>
<div class="col-xs-4">
<input type="text" class="form-control" name="firstname" placeholder="First name" />
</div>
</div>
<div class="form-group">
<label class="col-xs-3 control-label">Pass</label>
<div class="col-xs-4">
<input type="text" class="form-control" name="password" placeholder="First name" />
</div>
</div>
<div class="form-group">
<div class="col-xs-9 col-xs-offset-3">
<button type="submit" value="submit" name="submit" class="btn btn-primary">Submit</button>
</div>
</div>
</form>
<?php } ?>
<script>
$(document).ready(function () {
// Generate a simple captcha
function randomNumber(min, max) {
return Math.floor(Math.random() * (max - min + 1) + min);
}
function generateCaptcha() {
$('#captchaOperation').html([randomNumber(1, 100), '+', randomNumber(1, 200), '='].join(' '));
}
generateCaptcha();
$('#contactForm')
.formValidation({
framework: 'bootstrap',
icon: {
valid: 'glyphicon glyphicon-ok',
invalid: 'glyphicon glyphicon-remove',
validating: 'glyphicon glyphicon-refresh'
},
fields: {
firstname: {
validators: {
notEmpty: {
message: 'The first name is required'
},
regexp: {
message: 'Name only contains Letter',
regexp: /^[A-Z a-z]*$/
}
}
},
password: {
validators: {
notEmpty: {
message: 'The password is required'
}
}
}
}
});
;
});
</script>
Above you are checking
if (isset($_POST['submit']))
{
instead of action="validate-input.php" write action=""
Leave action empty so that the form will be submitted to the
document's address, i.e. the same page.
I wasn't sure the best way to word the title. My issue involves this function mail($to, $subject, $message, $headers); I have it running in the middle of a PHP file which takes information from a form, creates a token with stripe api and then charges that card with stripe.
Stripe still receives the data and charges the card correctly with the inclusion of the mail function, however the page doesn't show the success message like it used to, pretty much anything but the header shows after the purchase when usually the form would clear and success message would show up. It's like anything after the mail function isn't included on a succesfull form submit.
I spend most of my time in javascript, so this could completely be my lack of familiarity with PHP.
Here is the full code below.
<?php include 'head.php'; ?>
<body>
<!--header-->
<?php include 'header.php'; ?>
<!--header-->
<script type="text/javascript">
// $('input.quantity').keyup(function(){
// var value = $( this ).val();
// var bookQuantity = $( "input.bfh-number" ).text( value );
// console.log(bookQuantity);
// })
$(document).ready(function() {
$( ".quantity" )
.keyup(function() {
var value = $( this ).val();
console.log(value);
subTotal = 150 * value;
$( '.paymentTotal' ).text( '$' + subTotal );
}).keyup();
$('#payment-form').bootstrapValidator({
message: 'This value is not valid',
feedbackIcons: {
valid: 'glyphicon glyphicon-ok',
invalid: 'glyphicon glyphicon-remove',
validating: 'glyphicon glyphicon-refresh'
},
submitHandler: function(validator, form, submitButton) {
var chargeAmount = 3000; //amount you want to charge, in cents. 1000 = $10.00, 2000 = $20.00 ...
// createToken returns immediately - the supplied callback submits the form if there are no errors
Stripe.createToken({
number: $('.card-number').val(),
cvc: $('.card-cvc').val(),
exp_month: $('.card-expiry-month').val(),
exp_year: $('.card-expiry-year').val(),
name: $('.card-holder-name').val(),
address_line1: $('.address').val(),
address_city: $('.city').val(),
address_zip: $('.zip').val(),
address_state: $('.state').val(),
quantity: $('.quantity').val(),
address_country: $('.country').val()
}, chargeAmount, stripeResponseHandler);
return false; // submit from callback
},
fields: {
street: {
validators: {
notEmpty: {
message: 'The street is required and cannot be empty'
},
stringLength: {
min: 6,
max: 96,
message: 'The street must be more than 6 and less than 96 characters long'
}
}
},
city: {
validators: {
notEmpty: {
message: 'The city is required and cannot be empty'
}
}
},
zip: {
validators: {
notEmpty: {
message: 'The zip is required and cannot be empty'
},
stringLength: {
min: 3,
max: 9,
message: 'The zip must be more than 3 and less than 9 characters long'
}
}
},
email: {
validators: {
notEmpty: {
message: 'The email address is required and cannot be empty'
},
emailAddress: {
message: 'The input is not a valid email address'
},
stringLength: {
min: 6,
max: 65,
message: 'The email must be more than 6 and less than 65 characters long'
}
}
},
cardholdername: {
validators: {
notEmpty: {
message: 'The card holder name is required and cannot be empty'
},
stringLength: {
min: 6,
max: 70,
message: 'The card holder name must be more than 6 and less than 70 characters long'
}
}
},
first_name: {
validators: {
notEmpty: {
message: 'The card holder name is required and cannot be empty'
}
}
},
cardnumber: {
selector: '#cardnumber',
validators: {
notEmpty: {
message: 'The credit card number is required and cannot be empty'
},
creditCard: {
message: 'The credit card number is invalid'
},
}
},
expMonth: {
selector: '[data-stripe="exp-month"]',
validators: {
notEmpty: {
message: 'The expiration month is required'
},
digits: {
message: 'The expiration month can contain digits only'
},
callback: {
message: 'Expired',
callback: function(value, validator) {
value = parseInt(value, 10);
var year = validator.getFieldElements('expYear').val(),
currentMonth = new Date().getMonth() + 1,
currentYear = new Date().getFullYear();
if (value < 0 || value > 12) {
return false;
}
if (year == '') {
return true;
}
year = parseInt(year, 10);
if (year > currentYear || (year == currentYear && value > currentMonth)) {
validator.updateStatus('expYear', 'VALID');
return true;
} else {
return false;
}
}
}
}
},
expYear: {
selector: '[data-stripe="exp-year"]',
validators: {
notEmpty: {
message: 'The expiration year is required'
},
digits: {
message: 'The expiration year can contain digits only'
},
callback: {
message: 'Expired',
callback: function(value, validator) {
value = parseInt(value, 10);
var month = validator.getFieldElements('expMonth').val(),
currentMonth = new Date().getMonth() + 1,
currentYear = new Date().getFullYear();
if (value < currentYear || value > currentYear + 100) {
return false;
}
if (month == '') {
return false;
}
month = parseInt(month, 10);
if (value > currentYear || (value == currentYear && month > currentMonth)) {
validator.updateStatus('expMonth', 'VALID');
return true;
} else {
return false;
}
}
}
}
},
cvv: {
selector: '#cvv',
validators: {
notEmpty: {
message: 'The cvv is required and cannot be empty'
},
cvv: {
message: 'The value is not a valid CVV',
creditCardField: 'cardnumber'
}
}
},
}
});
});
</script>
<script type="text/javascript">
// this identifies your website in the createToken call below
//Stripe.setPublishableKey('pk_live_random');
Stripe.setPublishableKey('pk_test_random');
function stripeResponseHandler(status, response) {
if (response.error) {
// re-enable the submit button
$('.submit-button').removeAttr("disabled");
// show hidden div
document.getElementById('a_x200').style.display = 'block';
// show the errors on the form
$(".payment-errors").html(response.error.message);
} else {
var form$ = $("#payment-form");
// token contains id, last4, and card type
var token = response['id'];
// insert the token into the form so it gets submitted to the server
form$.append("<input type='hidden' name='stripeToken' value='" + token + "' />");
// and submit
form$.get(0).submit();
}
}
</script>
<!--content-->
<div class="global indent">
<div class="container partner-wrap">
<form action="" method="POST" id="payment-form" class="form-horizontal">
<div class="row"> <div class="col-lg-6"><img id="buyImage" src="img/book.jpg" /></div>
<div class="col-lg-6"><h2>The Economic Definition of Ore</h2><p>Price:$150</p>
<label class="control-label" for="textinput">Quantity</label>
<div class="form-group col-sm-4">
<div class="col-lg-12">
<h4>Quantity</h4>
</div>
<div class="col-lg-12">
<input type="text" name="quantity" value="1" data-buttons="false" class="quantity form-control bfh-number">
</div>
</div>
<div class="col-sm-8">
<h4 class="subTotalRight borderBottom">Total:</h4>
<h5 class="paymentTotal subTotalRight"></h5>
</div>
</div>
</div>
<div class="row row-centered">
<div class="col-md-12">
<div class="page-header">
<h2 class="gdfg">Secure Payment Form</h2>
</div>
<noscript>
<div class="bs-callout bs-callout-danger">
<h4>JavaScript is not enabled!</h4>
<p>This payment form requires your browser to have JavaScript enabled. Please activate JavaScript and reload this page. Check enable-javascript.com for more informations.</p>
</div>
</noscript>
<?php
$error = '';
$success = '';
require 'Stripe.php';
if ($_POST) {
$token = $_POST['stripeToken'];
$email = $_POST["email"];
$quantity = $_POST["quantity"];
$firstName = $_POST["firstName"];
$lastName = $_POST["lastName"];
// Get the values from the $_POST array:
$price = 15000;
$total = $price * $quantity;
$customertotal = $price * $quantity / 100;
//Stripe::setApiKey("sk_random");
Stripe::setApiKey("sk_random");
$error = '';
$success = '';
try {
$customer = Stripe_Customer::create(array(
'email' => $email,
'card' => $token,
"description" => $quantity . " copies of The Economic Definition of Ore -Cut-off Grades in Theory and Practice"
));
$charge = Stripe_Charge::create(array(
"amount" => $total, // amount in cents, again
"currency" => "cad",
'customer' => $customer->id,
"metadata" => array("First Name:" => $firstName, "Last Name:" => $lastName)
)
);
$success = '<div class="alert alert-success">
<strong>Success!</strong> Your payment was successful. For $' . $customertotal . ', and you have ordered ' . $quantity . ' copies </div>';
$to = $email; // note the comma
// subject
$subject = 'Economic Definition of Ore Purchase';
// message
$message = '
<html>
<head>
<title>Sumary of Purchase</title>
</head>
<body>
<table>
<tr>
<td> Hi ' . $firstName . '</td>
</tr>
<tr>
<td>
<p>Here is a summary of your recent purchase.</p>
</td>
</tr>
<tr>
<td>
<p>Your total purchase is $'.$customertotal . ' </p>
<p>The number of books you have ordered is <b>' . $quantity . '</b> </p>
</td>
</tr>
</table>
</body>
</html>
';
// To send HTML mail, the Content-type header must be set
$headers = 'MIME-Version: 1.0' . "\r\n";
$headers .= 'Content-type: text/html; charset=iso-8859-1' . "\r\n";
// Additional headers
$headers .= 'To: '. $firstName .' <' . $email . ' > ' . "\r\n";
$headers .= 'From: Comet <info#cometstrategy.com>' . "\r\n";
// $headers .= 'Bcc: birthdaycheck#example.com' . "\r\n";
// Mail it
mail($to, $subject, $message, $headers);
}
catch (Exception $e) {
$error = '<div class="alert alert-danger">
<strong></strong> '.$e->getMessage().'
</div>';
}
}
?>
<span class="payment-success">
<?= $success ?>
<?= $error ?>
</span>
<div class="alert alert-danger" id="a_x200" style="display: none;"> <strong></strong> Please fill out all required fields. </div>
<!-- Street -->
<div class="row">
<div class="col-md-6">
<!-- Form Name -->
<legend>Billing Details</legend>
<fieldset>
<!-- Street -->
<div class="form-group">
<label class="col-sm-4 control-label" for="textinput">First Name</label>
<div class="col-sm-12">
<input type="text" name="firstName" placeholder="First Name" class="firstName form-control">
</div>
</div>
<!-- Street -->
<div class="form-group">
<label class="col-sm-4 control-label" for="textinput">Last Name</label>
<div class="col-sm-12">
<input type="text" name="lastName" placeholder="Last Name" class="firstName form-control">
</div>
</div>
<!-- Street -->
<div class="form-group">
<label class="col-sm-4 control-label" for="textinput">Street</label>
<div class="col-sm-12">
<input type="text" name="street" placeholder="Billing Address" class="address form-control">
</div>
</div>
<!-- City -->
<div class="form-group">
<label class="col-sm-4 control-label" for="textinput">City</label>
<div class="col-sm-12">
<input type="text" name="city" placeholder="City" class="city form-control">
</div>
</div>
<!-- State -->
<div class="form-group">
<label class="col-sm-4 control-label" for="textinput">State</label>
<div class="col-sm-12">
<input type="text" name="state" maxlength="65" placeholder="State" class="state form-control">
</div>
</div>
<!-- Postcal Code -->
<div class="form-group">
<label class="col-sm-4 control-label" for="textinput">Postal Code</label>
<div class="col-sm-12">
<input type="text" name="zip" maxlength="9" placeholder="Postal Code" class="zip form-control">
</div>
</div>
<!-- Country -->
<div class="form-group">
<label class="col-sm-4 control-label" for="textinput">Country</label>
<div class="col-sm-12">
<!--input type="text" name="country" placeholder="Country" class="country form-control"-->
<!-- <div class="country bfh-selectbox bfh-countries" name="country" placeholder="Select Country" data-flags="true" data-filter="true"> </div> -->
<select class="form-control bfh-countries" data-country="AU"></select>
<!-- <div class="bfh-selectbox bfh-countries" data-country="AU" data-flags="true"> -->
<!-- </div> -->
</div>
</div>
<!-- Email -->
<div class="form-group">
<label class="col-sm-4 control-label" for="textinput">Email</label>
<div class="col-sm-12">
<input type="text" name="email" maxlength="65" placeholder="Email" class="email form-control">
</div>
</div>
</div>
<div class="col-md-6">
<fieldset>
<legend>Card Details</legend>
<!-- Card Holder Name -->
<div class="form-group">
<label class="col-sm-4 control-label" for="textinput">Card Holder's Name</label>
<div class="col-sm-12">
<input type="text" name="cardholdername" maxlength="70" placeholder="Card Holder Name" class="card-holder-name form-control">
</div>
</div>
<!-- Card Number -->
<div class="form-group">
<label class="col-sm-4 control-label" for="textinput">Card Number</label>
<div class="col-sm-12">
<input type="text" id="cardnumber" maxlength="19" placeholder="Card Number" class="card-number form-control">
</div>
</div>
<!-- Expiry-->
<div class="form-group">
<label class="col-xs-12 col-sm-12 control-label" for="textinput">Card Expiry Date</label>
<div class="col-sm-12">
<div class="form-inline">
<select name="select2" data-stripe="exp-month" class="card-expiry-month stripe-sensitive required form-control">
<option value="01" selected="selected">01</option>
<option value="02">02</option>
<option value="03">03</option>
<option value="04">04</option>
<option value="05">05</option>
<option value="06">06</option>
<option value="07">07</option>
<option value="08">08</option>
<option value="09">09</option>
<option value="10">10</option>
<option value="11">11</option>
<option value="12">12</option>
</select>
<span> / </span>
<select name="select2" data-stripe="exp-year" class="card-expiry-year stripe-sensitive required form-control">
</select>
<script type="text/javascript">
var select = $(".card-expiry-year"),
year = new Date().getFullYear();
for (var i = 0; i < 12; i++) {
select.append($("<option value='"+(i + year)+"' "+(i === 0 ? "selected" : "")+">"+(i + year)+"</option>"))
}
</script>
</div>
</div>
</div>
<!-- CVV -->
<div class="form-group">
<label class="col-sm-4 control-label" for="textinput">CVV/CVV2</label>
<div class="col-sm-4">
<input type="text" id="cvv" placeholder="CVV" maxlength="4" class="card-cvc form-control">
</div>
</div>
<hr>
<div class="row">
<div class="col-sm-12">
<h3>Total ($USD)</h3>
</div>
<div class="col-sm-12">
<h4 class="paymentTotal"></h4>
</div>
<div class="col-sm-12">
<button class="btn btn-success" type="submit">Pay Now</button>
</div>
</div>
<!-- Important notice -->
<!-- <div class="form-group"> -->
<!-- <div class="panel panel-success"> -->
<!-- <div class="panel-heading">
<h3 class="panel-title">Important notice</h3>
</div>
<div class="panel-body">
<p>Your card will be charged 30€ after submit.</p>
<p>Your account statement will show the following booking text:
XXXXXXX </p>
</div>
</div> -->
</fieldset>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
<!--footer-->
<?php include 'footer.php'; ?>
<script src="js/bootstrap.min.js"></script>
<script src="js/tm-scripts.js"></script>
</body>
</html>
Is anything after the PHP block being sent to the client (if you view source, is there any HTML after <noscript> block?), or is the payment-success span just empty?
If it's the former (nothing after the PHP block), then execution is stopping after the call to mail(). If mail() is reporting some kind of error, it will not be caught by the try/catch since it is an internal function that does not throw exceptions--it relies on the older PHP error reporting mechanism. For debugging purposes, try setting error_reporting(E_ALL) and manually testing to see if mail() is returning true:
<?php // Top of the file
error_reporting(E_ALL);
include 'head.php';
?>
....
...
// In the PHP block where you call mail()
if (!mail($to, $subject, $message, $headers)) {
echo "There was a problem with mail()<br />\n";
}
Then, submit the form and see if there is a PHP error message somewhere in the output and/or the message "There was a problem with mail()'. Depending on what you find, we can go from there.
I´m using the Bootstrap validation from https://github.com/nghuuphuoc/bootstrapvalidator
I have the problem that the submitHandler does not work. When the form is submitted the entry is not created and the form will be loaded in the same DIV element with completely incorrect formatting.
Can someone help me or say where exactly my fault?
HTML-Code:
<!-- All page content -->
<div class="container">
<!-- Registration-Form -->
<div class="page-header">
<h3>Registrierung eines Benutzerkontos</h3>
</div>
<div class="row">
<div class="col-xs-7 col-sm-5 col-xs-offset-3">
<div class="well">
<div class="formular">
<form role="form" id="register-form" method="post" action="">
<input type="hidden" name="sum" value="<?php echo $sum ?>">
<div class="form-group">
<label class="control-label" for="username">Benutzername</label>
<div class="form-inline">
<input type="text" class="form-control" name="username" id="username">
</div>
</div>
<div class="form-group">
<label class="control-label" for="email">E-Mail Adresse</label>
<div class="form-inline">
<input type="email" class="form-control" name="email" id="email">
</div>
</div>
<div class="form-group">
<label class="control-label" for="Password">Passwort</label>
<div class="form-inline">
<input type="password" class="form-control" name="password" id="password">
</div>
</div>
<div class="form-group">
<label class="control-label" for="confirmPassword">Passwort wiederholen</label>
<div class="form-inline">
<input type="password" class="form-control" name="confirmPassword" id="confirmPassword">
</div>
</div>
<br>
<div class="form-group">
<label class="control-label" for="captcha"><strong>Sicherheitsabfrage</strong></label>
<div class="form-inline">
<input type="text" class="form-control sum" name="num1" id="num1" value="<?php echo $num1 ?>" readonly> +
<input type="text" class="form-control sum" name="num2" id="num2" value="<?php echo $num2 ?>" readonly> =
<input type="text" class="form-control captcha" name="captcha" id="captcha" maxlength="2">
<span id="spambot"></span>
</div>
</div>
<div class="form-group">
<span class="help-block"><small>Info: Diese Eingabe dient zum Schutz vor Spambot.</small></span>
</div>
<div class="form-group">
<button type="submit" class="btn btn-primary" name="register">Registrieren</button>
</div>
</form>
<div id="info"></div>
</div><!--/.formular -->
</div><!--/.well -->
</div>
</div><!--/.row -->
<!-- End Registration-Form -->
</div><!--/.container -->
Java-Script:
<script src="../components/jquery-1.10.2.min.js"></script>
<script src="../components/jquery.form.js"></script>
<script src="../dist/js/bootstrap.min.js"></script>
<script src="../dist/js/bootstrapValidator.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$('#register-form').bootstrapValidator({
message: 'Die Eingabe ist nicht gültig',
submitHandler: function(form) {
$(form).ajaxSubmit( {
target: '#info',
success: function() {
$('#register-form').slideUp('fast');
}
});
},
fields: {
username: {
validators: {
notEmpty: {
message: 'Bitte geben Sie einen Namen ein!'
},
stringLength: {
min: 3,
max: 30,
message: 'Der Benutzername muss mindestens 3 und maximal 30 Zeichen enthalten!'
},
regexp: {
regexp: /^[a-zA-Z0-9_\.]+$/,
message: 'Der Benutzername darf nur alphabetisch, Anzahl, Punkt und Unterstrich enthalten!'
},
}
},
email: {
validators: {
notEmpty: {
message: 'Bitte geben Sie eine E-Mail Adresse ein!'
},
emailAddress: {
message: 'Das ist keine gültige E-Mail Adresse!'
}
}
},
password: {
validators: {
notEmpty: {
message: 'Bitte geben Sie ein Passwort ein!'
},
identical: {
field: 'confirmPassword',
message: 'Die Passwörter stimmen nicht überein!'
}
}
},
confirmPassword: {
validators: {
notEmpty: {
message: 'Bitte geben Sie ein Passwort ein!'
},
identical: {
field: 'password',
message: 'Die Passwörter stimmen nicht überein!'
}
}
},
captcha: {
validators: {
notEmpty: {
message: 'Bitte geben Sie ein Ergebnis ein!'
},
callback: {
message: 'Bitte geben Sie das richtige Ergebnis ein!',
callback: function(value) {
$result = ( parseInt($('#num1').val()) + parseInt($('#num2').val()) == parseInt($('#captcha').val()) ) ;
$('#spambot').fadeOut('fast');
return $result;
}
}
}
}
}
});
});
</script>
The following PHP-Code is on top of the file
// When post "register"
if (isset($_POST['register'])) {
// Clean up the input values
foreach($_POST as $key => $value) {
if(ini_get('magic_quotes_gpc'))
$_POST[$key] = stripslashes($_POST[$key]);
$_POST[$key] = htmlspecialchars(strip_tags($_POST[$key]));
}
// Define variables of the user input
$username = $mysqli->real_escape_string($_POST['username']);
$email = $mysqli->real_escape_string($_POST['email']);
$password = $mysqli->real_escape_string($_POST['password']);
// Email Validation
function isValidEmail($email){
return filter_var(filter_var($email, FILTER_SANITIZE_EMAIL), FILTER_VALIDATE_EMAIL);
}
// Check user input values for errors
$errors = array();
if(strlen($username) < 3) {
if(!$username) {
$errors[] = "Bitte geben Sie einen Benutzernamen ein!";
} else {
$errors[] = "Der Benutzername muss mindestens 3 Zeichen enthalten!";
}
}
if(!$email) {
$errors[] = "Bitte geben Sie eine E-Mail Adresse ein!";
} else if(!isValidEmail($email)) {
$errors[] = "Das ist keine gültige E-Mail Adresse!";
}
if($_POST['password'] !== $_POST['confirmPassword']) {
$errors[] = "Die Passwörter stimmen nicht überein!";
}
if($_POST['captcha'] !== $_POST['sum']) {
$errors[] = "Bitte geben Sie das richtige Ergebnis ein!";
}
if($errors) {
// Output errors and die with a failure message
$errortext = "";
foreach($errors as $error) {
$errortext .= "<li>".$error."</li>";
}
die("<div class='text-danger'><strong>Es sind folgende Fehler aufgetreten:</strong><ul>". $errortext ."</ul></div>");
} else
// Create a secure password
$random_salt = hash('sha512', uniqid(mt_rand(1, mt_getrandmax()), true));
$password = hash('sha512', $password.$random_salt);
// Create a new USER
if ($insert_stmt = $mysqli->prepare("INSERT INTO members (username, email, password, salt) VALUES (?, ?, ?, ?)")) {
$insert_stmt->bind_param('ssss', $username, $email, $password, $random_salt);
$insert_stmt->execute();
$insert_stmt->store_result();
}
die("<p class='text-success'>Die Registrierung war erfolgreich! Sie können sich jetzt anmelden</p>");
$insert_stmt->close();
} else {
?>
<!DOCTYPE html>
<html lang="de-DE">
...
...
I hope someone can help me. I've tried already several variants, but unfortunately without any success.
I have noticed that remote validator is not functional (even in the example), so
this helped when using HTML5 (I hope):
enableByHtml5: function($field) {
return $field.attr('data-bv-remote-url');
},
Add above code into validator/remote.js