我试图在我的输入字段旁边显示 PHP 跨度错误，但是在第一行操作跨度错误之后，其他输入字段消失..
如何使其他输入字段再次可见，以便错误消息显示在它们旁边？
<body ontouchmove="BlockMove(event);">
<div class="container">
<div class="st-container">
<input type="radio" name="radio-set" checked="checked" id="st-control-1" class="menu"/>
<a href="#st-panel-1">Start</a>
<input type="radio" name="radio-set" id="st-control-2" class="menu"/>
<a href="#st-panel-2">Vraag 1</a>
<input type="radio" name="radio-set" id="st-control-3" class="menu"/>
<a href="#st-panel-3">Vraag 2</a>
<input type="radio" name="radio-set" id="st-control-4" class="menu"/>
<a href="#st-panel-4">De uitdaging</a>
<div class="st-scroll">
<section class="st-panel" id="st-panel-1">
<div class="st-deco"></div>
<div id="position">
<div id="contact">
<div id="bevestiging">
<div id="midden">
<div id="formulierruimte">
<?php
require_once("php/db.php"); /* Database Class */
require_once('php/utils/is_email.php'); /* Email Validation Script */
/* Handle Ajax Request */
if(isset($_POST['newcontact'])){
$contact = new Contact();
//We'll refer to that later on, to display errors.
//unset($contact);
}
else{
//header('Location: result.php');
}
/* Class Contact */
class Contact{
private $db; /* the database obj */
//private $errors = array(); /* holds error messages */
//we have to init $errors array, as otherwise form will produce errors on missing array entry
private $errors = array( /* holds error messages */
'aanhef' => '',
'bedrijfsnaam' => '',
'email' => '',
'telefoon' => '',
'vraag1_antwoorden' => '',
'vraag2_antwoorden' => ''
);
private $num_errors; /* number of errors in submitted form */
public function __construct(){
$this->db = new DB();
if(isset($_POST['newcontact']))
$this->processNewMessage();
/* We don't need this anymore
*
else
header('Location: result.php');*/
}
public function processNewMessage(){
$aanhef = $_POST['aanhef'];
$contactpersoon = $_POST['contactpersoon'];
$bedrijfsnaam = $_POST['bedrijfsnaam'];
$telefoon = $_POST['telefoon'];
$email = $_POST['email'];
$vraag1_antwoorden = $_POST['vraag1_antwoorden'];
$vraag2_antwoorden = $_POST['vraag2_antwoorden'];
/* Server Side Data Validation */
/* Aanhef Validation */
if(!$aanhef || mb_strlen($aanhef = trim($aanhef)) == 0)
$this->setError('aanhef', 'Selecteer uw aanhef');
/* Contactpersoon Validation */
if(!$contactpersoon || mb_strlen($contactpersoon = trim($contactpersoon)) == 0)
$this->setError('contactpersoon', 'Vul uw contactpersoon in');
else if(mb_strlen(trim($contactpersoon)) > 120)
$this->setError('contactpersoon', 'Te lang! 120 karakters max.');
/* Bedrijfsnaam Validation */
if(!$bedrijfsnaam || mb_strlen($bedrijfsnaam = trim($bedrijfsnaam)) == 0)
$this->setError('bedrijfsnaam', 'Vul uw bedrijfsnaam in');
else if(mb_strlen(trim($bedrijfsnaam)) > 120)
$this->setError('bedrijfsnaam', 'Te lang! 120 karakters max.');
/* Telefoon Validation */
if(!$telefoon || mb_strlen($telefoon = trim($telefoon)) == 0)
$this->setError('telefoon', 'Vul uw telefoonnummer in');
else if(mb_strlen(trim($telefoon)) > 120)
$this->setError('telefoon', 'Te lang! 120 karakters max.');
/* Vraag 1 Validation */
if(!$vraag1_antwoorden || mb_strlen($vraag1_antwoorden = trim($vraag1_antwoorden)) == 0)
$this->setError('vraag1_antwoorden', 'Selecteer een antwoord a.u.b.');
/* Vraag 2 Validation */
if(!$vraag2_antwoorden || mb_strlen($vraag2_antwoorden = trim($vraag2_antwoorden)) == 0)
$this->setError('vraag2_antwoorden', 'Selecteer een antwoord a.u.b.');
/* Email Validation */
if(!$email || mb_strlen($email = trim($email)) == 0)
$this->setError('email','Vul uw e-mail in');
else{
if(!is_email($email))
$this->setError('email', 'Vul een correct email adres in');
else if(mb_strlen($email) > 120)
$this->setError('email', 'Te lang! 120 karakters max.');
}
/* No errors, insert in db
else*/
if($this->countErrors() == 0) {
if(($ret = $this->db->dbNewMessage($aanhef, $contactpersoon, $bedrijfsnaam, $email, $telefoon, $vraag1_antwoorden, $vraag2_antwoorden)) > 0){
//$json = array('result' => 1);
if(SEND_EMAIL)
$this->sendEmail($aanhef,$contactpersoon,$bedrijfsnaam,$email,$telefoon,$vraag1_antwoorden,$vraag2_antwoorden);
//This is for relocating to successful result page
header('Location: result.php');
} else {
// else
// $json = array('result' => -2); /* something went wrong in database insertion */
//This will need special treatment. You have to prepare an errorpage
//for database-related issues.
header("Location: database-error.html");
}
/*$encoded = json_encode($json);
echo $encoded;
unset($encoded);*/
}
}
public function sendEmail($aanhef,$contactpersoon,$bedrijfsnaam,$email,$telefoon,$vraag1_antwoorden,$vraag2_antwoorden){
/* Just format the email text the way you want ... */
$message_body = "<div style=\"font-size:12px; font-weight:normal;\">Hallo,<br><br>"
."Het volgende bedrijf heeft zich zojuist aangemeld:</div><br>"
."<table cellpadding=\"1\" cellspacing=\"1\" width=\"550px\"><tr><td style=\"font-size:12px; color:#000000\">Bedrijfsnaam:</td><td style=\"font-size:12px; color:#000000\">".$bedrijfsnaam."</td></tr><tr><td style=\"font-size:12px; color:#000000\">Aanhef:</td><td style=\"font-size:12px; color:#000000\">".$aanhef."</td></tr><tr><td style=\"font-size:12px; color:#000000\">Contactpersoon:</td><td style=\"font-size:12px; color:#000000\">".$contactpersoon."</td></tr><tr><td style=\"font-size:12px; color:#000000\">Telefoonnummer:</td><td style=\"font-size:12px; color:#000000\">".$telefoon."</td></tr><tr><td style=\"font-size:12px; color:#000000\">E-mail:</td><td style=\"font-size:12px; color:#000000\">".$email."</td></tr><tr><td style=\"font-size:12px; color:#000000\">Antwoord vraag 1:</td><td style=\"font-size:12px; color:#000000\">".$vraag1_antwoorden."</td></tr><tr><td style=\"font-size:12px; color:#000000\">Antwoord vraag 2:</td><td style=\"font-size:12px; color:#000000\">".$vraag2_antwoorden."</td></tr></table><br>";
// Geef GELDIGE adressen op
// Een korte benaming voor jouw website
$website_naam = 'Aanmelding';
// Jouw eigen geldige emailadres
$eigen_emailadres = 'MAIL';
// Een geldig emailadres voor errors
$error_emailadres = 'MAIL';
// De naam van de verzender
$naam_verzender = ''.$bedrijfsnaam.'';
// Het geldige emailadres van de afzender
$email_verzender = ''.$email.'';
// Een geldig emailadres of helemaal leeg laten
$bcc_emailadres = '';
// HTML mail? True/False
$html = true;
// De headers samenstellen
$headers = 'From: ' . $website_naam . ' <' . $eigen_emailadres . '>' . PHP_EOL;
$headers .= 'Reply-To: ' . $naam_verzender . ' <' . $email_verzender . '>' . PHP_EOL;
$headers .= 'Return-Path: Mail-Error <' . $error_emailadres . '>' . PHP_EOL;
$headers .= ($bcc_emailadres != '') ? 'Bcc: ' . $bcc_emailadres . PHP_EOL : '';
$headers .= 'X-Mailer: PHP/' . phpversion() . PHP_EOL;
$headers .= 'X-Priority: Normal' . PHP_EOL;
$headers .= ($html) ? 'MIME-Version: 1.0' . PHP_EOL : '';
$headers .= ($html) ? 'Content-type: text/html; charset=iso-8859-1' . PHP_EOL : '';
mail(EMAIL_TO,MESSAGE_SUBJECT,$message_body,$headers);
}
public function setError($field, $errmsg){
$this->errors[$field] = $errmsg;
$this->num_errors = count($this->errors);
}
public function error_value($field){
if(array_key_exists($field,$this->errors))
return $this->errors[$field];
else
return '';
}
public function countErrors(){
return $this->num_errors;
}
};
?>
<table width="675px" cellpadding="0" cellspacing="0">
<form id="ContactForm" action="quiz.php" method="post">
<tr>
<td class="left_td"> </td><td><font size="-2">* Gelieve alle velden in te vullen.</font></td>
</tr>
<tr class="rij_aanhef">
<td class="left_td">Aanhef<font size="-2" style="vertical-align:top;">*</font></td>
<td>
<label class="label_aanhef" for="aanhef_1"><input name="aanhef" id="aanhef_1" value="Dhr." type="radio" /> Dhr.</label><label class="label_aanhef" for="aanhef_2"><input name="aanhef" id="aanhef_2" value="Mevr." type="radio" /> Mevr.</label>
<span class="error" style="display:none; margin-left:40px;">
<?php echo($contact->error_value("'aanhef'")) ?>
</span>
</td>
</tr>
<tr class="rij_contactpersoon">
<td class="left_td">Contactpersoon</td>
<td>
<input id="contactpersoon" name="contactpersoon" class="inplaceError" maxlength="120" type="text" class="error" autocomplete="off" onFocus="window.scrollTo(0, 0);"/>
<span class="error" style="display:none; margin-left:40px;">
<?php echo($contact->error_value('contactpersoon')) ?>
</span>
</td>
</tr>
<tr class="rij_bedrijf">
<td class="left_td">Bedrijfsnaam</td>
<td>
<input id="bedrijfsnaam" name="bedrijfsnaam" class="inplaceError" maxlength="120" type="text" autocomplete="off" onFocus="window.scrollTo(0, 0);"/>
<span class="error" style="display:none; margin-left:40px;">
<?php echo($contact->error_value('bedrijfsnaam')) ?>
</span>
</td>
</tr>
<tr>
<td class="left_td">E-mail</td>
<td>
<input id="email" name="email" class="inplaceError" maxlength="120" type="text" autocomplete="off" onFocus="window.scrollTo(0, 0);"/>
<span class="error" style="display:none; margin-left:40px;">
<?php echo($contact->error_value('email')) ?>
</span>
</td>
</tr>
<tr>
<td class="left_td">Telefoonnummer</td>
<td><input id="telefoon" name="telefoon" class="inplaceError" maxlength="120" type="text" autocomplete="off" onFocus="window.scrollTo(0, 0);"/>
<span class="error" style="display:none; margin-left:40px;">
<?php echo($contact->error_value('telefoon')) ?>
</span>
</td>
</tr>
</table>
</div>
</div>
</div>
</div>
</div>
</section>
</div><!-- // st-scroll -->
<div class="st-scroll">
<section class="st-panel" id="st-panel-2">
<div class="st-deco"></div>
<h2>Toelichting:<br />Neem plaats op de eerste tegel en wek energie op. Zodra de vraag op het scherm verschijnt, kiest u één van de vier volgende antwoorden.</h2>
<div class="sizer">
<label class="label_radio" for="vraag1_A"><input name="vraag1_antwoorden" id="vraag1_A" value="A. Dat is helaas fout, het goede antwoord is: C) 1 Ohm" type="radio" />A) Geen eis</label>
<label class="label_radio" for="vraag1_B"><input name="vraag1_antwoorden" id="vraag1_B" value="B. Dat is helaas fout, het goede antwoord is: C) 1 Ohm" type="radio" />B) 0,1 Ohm</label>
<label class="label_radio" for="vraag1_C"><input name="vraag1_antwoorden" id="vraag1_C" value="C. Gefeliciteerd dat is het goede antwoord." type="radio" />C) 1 Ohm</label>
<label class="label_radio" for="vraag1_D"><input name="vraag1_antwoorden" id="vraag1_D" value="D. Dat is helaas fout, het goede antwoord is: C) 1 Ohm" type="radio" />D) 10 Ohm</label>
</div>
<span id="vraag1_antwoorden" class="foutmelding_quiz" style="display:none;">
<?php echo($contact->error_value('vraag1_antwoorden')) ?>
</span>
</section>
</div><!-- // st-scroll -->
<div class="st-scroll">
<section class="st-panel" id="st-panel-3">
<div class="st-deco"></div>
<h2>Toelichting:<br />Neem plaats op de tweede tegel en wek energie op. Zodra de vraag op het scherm verschijnt, kiest u één van de vier volgende antwoorden.</h2>
<div class="sizer">
<label class="label_radio" for="vraag2_A"><input name="vraag2_antwoorden" id="vraag2_A" value="A. Gefeliciteerd dat is het goede antwoord." type="radio" />A) 10 Ohm</label>
<label class="label_radio" for="vraag2_B"><input name="vraag2_antwoorden" id="vraag2_B" value="B. Dat is helaas fout, het goede antwoord is: A) 10 Ohm" type="radio" />B) 1 Ohm</label>
<label class="label_radio" for="vraag2_C"><input name="vraag2_antwoorden" id="vraag2_C" value="C. Dat is helaas fout, het goede antwoord is: A) 10 Ohm" type="radio" />C) 0,1 Ohm</label>
<label class="label_radio" for="vraag2_D"><input name="vraag2_antwoorden" id="vraag2_D" value="D. Dat is helaas fout, het goede antwoord is: A) 10 Ohm" type="radio" />D) Geen eis</label>
</div>
<span id="vraag2_antwoorden" class="foutmelding_quiz" style="display:none;">
<?php echo($contact->error_value('vraag2_antwoorden')) ?>
</span>
</section>
</div><!-- // st-scroll -->
<div class="st-scroll">
<section class="st-panel" id="st-panel-4">
<div class="st-deco"></div>
<h2>Toelichting:<br />Neem plaats op de derde tegel en zorg ervoor dat u genoeg energie opwekt om de balk tot 100% te laten komen.</h2>
<p>
<br /><br /><input type="submit" class="verzenden_image" value="" /><input type="hidden" id="newcontact" name="newcontact" value="1"></input></form>
</p>
</section>
</div><!-- // st-scroll -->
</div><!-- // st-container -->
</div>
<!-- The JavaScript -->
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script>
function setupLabel() {
if ($('.label_check input').length) {
$('.label_check').each(function(){
$(this).removeClass('c_on');
});
$('.label_check input:checked').each(function(){
$(this).parent('label').addClass('c_on');
});
};
if ($('.label_radio input').length) {
$('.label_radio').each(function(){
$(this).removeClass('r_on');
});
$('.label_radio input:checked').each(function(){
$(this).parent('label').addClass('r_on');
});
};
};
$(document).ready(function(){
$('body').addClass('has-js');
$('.label_check, .label_radio').click(function(){
setupLabel();
});
setupLabel();
});
</script>
</body>