Мне нужна помощь. Всякий раз, когда я вводил всю информацию и хотел нажать «Отправить», он всегда предупреждал меня: «Вы уже отправляли ранее», но я впервые вводил информацию. Поэтому не должно быть повторяющихся значений. И сами данные также не публиковались в моей базе данных phpmyadmin.
Во-вторых, я добавил addclass («ошибка») и removeclass («ошибка») в javascript. Однако только эти вопросы выбора будут показывать красную границу ошибки, в то время как вопросы ввода текста не отображали границу ошибки, даже если она неправильная
Я потратил несколько дней, чтобы исследовать ее, но все еще не мог ее решить.
My index.php file:
<!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">
<title>Refund Request Form</title>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/skeleton/2.0.4/skeleton.css" >
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<link rel="stylesheet" href="css/style.css" >
<!-- <script src="form.js"></script>-->
</head>
<body>
<div class="container">
<script src='https://www.google.com/recaptcha/api.js'></script>
<div class="form-container">
<span style="text-align: center;padding-bottom: 0px;"><br>
<center>
<h1>
Refund Request Form
</h1>
</center>
</span>
<form method="post" id="form" name="form">
<label for="school_num">School Number: <span class="required">*</span></label>
<input id="school_num" type="text" placeholder="Enter your School Number" name="school_num" maxlength="50">
<label for="name">Full Name: <span class="required">*</span></label>
<input id="name" type="text" placeholder="Enter your Name in Capital as per IC" name="name" maxlength="50">
<label for="email">Email Address: <span class="required">*</span></label>
<input id="email" type="text" placeholder="Enter your Email Address" name="email" maxlength="50">
<label for="ic_num">IC Number: <span class="required">*</span></label>
<input id="ic_num" type="number" placeholder="Enter your IC Number (without dash)" name="ic_num" data-parsley-length="[12,12]" maxlength="12">
<label for="nts">Event1 Refund Amount: <span class="required">*</span></label>
<select id="nts" placeholder="-" name="nts" onchange="sum()" >
<option value = "-" selected>-</option>
<option value = "0" >0</option>
<option value = "80">80</option>
<option value = "100">100</option>
<option value = "110">110</option>
<option value = "110">120</option>
</select>
<label for="pesta">Event2 Refund Amount: <span class="required">*</span></label>
<select id="pesta" placeholder="" name="pesta" onchange="sum()" >
<option value = "-" selected>-</option>
<option value = "0" >0</option>
<option value = "100">100</option>
<option value = "360">360</option>
<option value = "450">450</option>
<option value = "460">460</option>
<option value = "535">535</option>
<option value = "540">540</option>
</select>
<label for="remarks">Remarks:</label>
<textarea id="remarks" name="remarks" placeholder="Type your remarks here" rows="5" maxlength="6000"></textarea>
<label style="border-bottom:1px dotted grey; padding-top: 30px;" colspan="2"></label>
<label for="refund" class="refund" style="color:#faa51a;font-family: 'Open Sans', sans-serif;font-weight: 500; font-size: 150%;width: 30%">Refund Total: </label>
<input id="refund" class="refund1" value="0" readonly style="border:none;color:#faa51a;font-family: 'Open Sans', sans-serif;font-weight: 500;font-size: 150%;width: 20%">
<!-- <input type="hidden" id="refund" name="refund" class="refund1" value="0" > -->
<input class="button-primary" name="submit" id="submit" role="button" type="button" onClick="validateForm()" value="Submit">
<!-- <input type="button" class="button-primary" type="submit" name="submit" id="submit" role="button" value="Submit">-->
</form>
<div id="success_message" style="display:none">
<h3>Submitted the form successfully!</h3>
<p> We will get back to you soon. </p>
</div>
<div id="error_message" style="width:100%; height:100%; display:none; "> <h3>Error</h3> Sorry there was an error sending your form.</div>
</div>
</div>
</body>
<script>
$(document).ready(function() {
//this calculates values automatically
sum();
$("#nts, #pesta").on("keydown keyup", function() {
sum();
});
});
function sum() {
var nts = document.getElementById('nts').value;
var pesta = document.getElementById('pesta').value;
var refundTotal = parseInt(nts) + parseInt(pesta);
if (!isNaN(refundTotal)) {
document.getElementById('refund').value ="RM " + refundTotal;
}
}
function validateEmail($email) {
var re = /^\w+@[a-zA-Z_]+?\.[a-zA-Z]{2,3}$/;
if ($email == '' || !re.test($email))
{
return false;
}
}
function validateAlphabet($account_name){
var letters = /^\w+@[a-zA-Z_]+?\.[a-zA-Z]{2,3}$/;
if($account_name.value.match(letters))
{
return true;
}
else
{
return false;
}
}
// function validateNumber (){
//
// }
function validateForm() {
$('#submit').disable=true;
var valid = true;
var error_msg="";
//school number
if($('#school_num').val()=='' && $.trim($('#school_num').val()).length<=0 ){
error_msg+=("Please insert your school number\n");
$('#school_num').addClass("error");
valid=false;
}else{
$('#school_num').removeClass("error");
}
//name
if($('#name').val()==''){
error_msg+=("Please insert your name\n");
$('#name').addClass("error");
valid=false;
}else{
$('#name').removeClass("error");
}
//email
if($('#email').val()==''){
error_msg+=("Please insert your email address\n");
$('#email').addClass("error");
valid=false;
}else{
if(validateEmail(document.getElementById('email').value)==false){
//console.log(document.getElementById('email').value);
error_msg+=("Invalid email address, Please fill in the correct email\n");
$('#email').addClass("error");
valid=false;
}else{
$('#email').removeClass("error");
}
}
//ic number
if($('#ic_num').val()==''){
error_msg+=("Please insert your IC Number (without dash)\n");
$('#ic_num').addClass("error");
valid=false;
}else{
if(!$.isNumeric($("#ic_num").val())){
//console.log(document.getElementById('email').value);
error_msg+=("Invalid IC Number - should be numbers only (no dash)\n");
$('#ic_number').addClass("error");
valid=false;
}else{
$('#ic_number').removeClass("error");
}
}
//school
if($('#school').val()=='-'){
error_msg+=("Please select your school\n");
$('#school').addClass("error");
valid=false;
}else{
$('#school').removeClass("error");
}
//nts
if($('#nts').val()=='-'){
error_msg+=("Please select your NTS refund amount\n");
$('#nts').addClass("error");
valid=false;
}else{
$('#nts').removeClass("error");
}
//pesta
if($('#pesta').val()=='-'){
error_msg+=("Please select your PESTA refund amount\n");
$('#pesta').addClass("error");
valid=false;
}else{
$('#pesta').removeClass("error");
}
if(error_msg!=""){
alert(error_msg);
}
if(valid){
$.ajax({
url: 'form_ajax.php',
type: 'POST',
data: {
'action':'check_duplicate',
'school_num':$('#school_num').val(),
'name':$('#name').val(),
'email':$('#email').val(),
'school':$('#school').val(),
'nts':$('#nts').val(),
'pesta':$('#pesta').val(),
'refund':$('#refund').val(),
},
error: function() {
},
before:function(){
},
dataType: 'json',
success: function(data) {
if(data.is_duplicated==0){
$.ajax({
url: 'form_ajax.php',
type: 'POST',
data: {
'action':'submit_form',
'school_num':$('#school_num').val(),
},
before:function(){
},
dataType: 'json',
success: function(data) {
$('#submit').disable=false;
if(data.status==1){
alert(data.message);
$('#success_message').show()
//TOOD: Clear all input
$('#school_num').val(''),
$('#name').val(''),
$('#email').val(''),
$('#school').val(''),
$('#nts').val(''),
$('#pesta').val(''),
$('#refund').val('')
}else{
alert(data.message);
$('#error_message').show()
}
},
error: function() {
},
});
//TOOD: Clear all input
$('#school_num').val(''),
$('#name').val(''),
$('#email').val(''),
$('#school').val(''),
$('#nts').val(''),
$('#pesta').val(''),
$('#refund').val('')
}
else{
alert('You already submit before');
}
},
});
}else{
$('#submit').disable=false;
}
}
</script>
</html>
My form_ajax.php file
<?php
//if(isset($_POST['submit'])){
if($_POST['action']=='submit_form'){
require "config.php";
require "common.php";
$statement=false;
$new_student = array(
"school_num" => $_POST['school_num'],
"name" => $_POST['name'],
"email" => $_POST['email'],
"ic_num" => $_POST['ic_num'],
"school" => $_POST['school'],
"nts" => $_POST['nts'],
"pesta" => $_POST['pesta'],
"remarks" => $_POST['remarks'],
"refund" => $_POST['refund']
);
try{
//#1 Open Connection
$connection = new PDO ($dsn,$username,$password,$options);
//#2 Prepare Sql QUERY
$statement = $connection->prepare("INSERT INTO details (school_num,name, email, ic_num,school,nts,pesta,remarks,refund,date) values (?,?,?,?,?,?,?,?,?,NOW())");
$statement ->bindParam(1,$_POST['school_num'],PDO::PARAM_STR);
$statement ->bindParam(2,$_POST['name'],PDO::PARAM_STR);
$statement ->bindParam(3,$_POST['email'],PDO::PARAM_STR);
$statement ->bindParam(4,str_replace($_POST['ic_num'], '-', ''),PDO::PARAM_INT);
$statement ->bindParam(5,$_POST['school'],PDO::PARAM_STR);;
$statement ->bindParam(6,$_POST['nts'],PDO::PARAM_INT);
$statement ->bindParam(7,$_POST['pesta'],PDO::PARAM_INT);
$statement ->bindParam(8,$_POST['remarks'],PDO::PARAM_STR);
$statement ->bindParam(9,$_POST['refund'],PDO::PARAM_INT);
//$statement = $connection->prepare($sql);
$statement->execute();
$return_message=array('status'=>1,'message'=>'Your information has been saved');
echo json_encode($return_message);
} catch (PDOException $error){
$return_message=array('status'=>0,'message'=>'Sorry we cannot save your information');
echo json_encode($return_message);
}
}
if( $_POST['action']=='check_duplicate'){
require "config.php";
require "common.php";
$statement=false;
try{
//#1 Open Connection
$connection = new PDO ($dsn,$username,$password,$options);
//#2 Prepare Sql QUERY
$statement = $connection->prepare("SELECT details.school_num FROM details");
$statement->bindParam(':school_num', $_POST ['school_num'], PDO::PARAM_STR);
//$statement = $connection->prepare($sql);
$statement->execute();
$statement->fetchAll();
$return_message=array('status'=>1,'message'=>'there is duplicate');
echo json_encode($return_message);
}catch (PDOException $error){
$return_message=array('status'=>0,'message'=>'no duplicate');
echo json_encode($return_message);
}
}