JQuery Post スクリプトで問題が発生しています。(ポップアップ)フォームを送信するためにJqueryを使用しています。この機能を無効にすると、すべてがスムーズに実行されます。(フォームページを離れたくないだけです)。
私のフォーム入力の一部(いくつかのラジオボタン)
<label><input type="radio" name="algemene_rating" id="algemene_rating" value="zeer_slecht" />1</label>
<label><input type="radio" name="algemene_rating" id="algemene_rating" value="slecht" />2</label>
<label><input type="radio" name="algemene_rating" id="algemene_rating" value="matig" />3</label>
<label><input type="radio" name="algemene_rating" id="algemene_rating" value="goed" />4</label>
<label><input type="radio" name="algemene_rating" id="algemene_rating" value="zeer_goed" />5</label>
私のフォーム入力の一部(いくつかのチェックボックス)
<input type="checkbox" name="suggestie_dienstverlening" value="true" style="float:left; margin-bottom:5px;"/><div class="FeedbackCheckbox">Dienstverlening</div>
<input type="checkbox" name="suggestie_opmaak" value="true" style="float:left"/><div class="FeedbackCheckbox">Opmaak</div>
<input type="checkbox" name="suggestie_functionaliteit" value="true" style="float:left; margin-bottom:5px;"/><div class="FeedbackCheckbox">Functionaliteit</div>
<input type="checkbox" name="suggestie_site_inhoud" value="true" style="float:left; margin-bottom:5px"/><div class="FeedbackCheckbox">Site inhoud</div>
<input type="checkbox" name="suggestie_anders" value="true" style="float:left"/><div class="FeedbackCheckbox">Anders...</div>
私のフォーム入力の一部(テキスト(エリア))
<input type="text" name="url_van_foutpagina" style="font-size:9px; width:275px">
<input id="e-mail" type="text" value="" name="email" />
JQuery がなくても、この PHP スクリプトを使用すると、すべてがスムーズに実行されます。
<?php
//collect vals
$algemene_rating = htmlspecialchars($_POST['algemene_rating']);
if ($_POST['suggestie_dienstverlening'] == "true") {$sugestie_onderwerp .= "<li> Dienstverlening </li>";}
if ($_POST['suggestie_opmaak'] == "true") {$sugestie_onderwerp .= "<li> Opmaak </li>";}
if ($_POST['suggestie_functionaliteit'] == "true") {$sugestie_onderwerp .= "<li> Functionaliteit </li>";}
if ($_POST['suggestie_site_inhoud'] == "true") {$sugestie_onderwerp .= "<li> Site inhoud </li>";}
if ($_POST['suggestie_anders'] == "true") {$sugestie_onderwerp .= "<li> Anders.. </li>";}
$url_van_foutpagina = htmlspecialchars($_POST['url_van_foutpagina']);
//Collect 'Emailadres'
$email = htmlspecialchars($_POST['email']);
// Collect: 'Attributes'
$tijd = time();
$datum = strftime("%d/%m/%y %H:%M", $tijd);
$ip = getenv("REMOTE_ADDR");
// Collect 'Mail info'
$headers = 'MIME-Version: 1.0' . "\r\n";
$headers .= 'Content-type: text/html; charset=iso-8859-1' . "\r\n";
// Het bericht voor de ontvanger
$message = '<html><body>';
$message .= '<table rules="all" style="background-color:#F8F8F8; width:600px; font-family:arial; font-size:11px; valign:top">';
$message .= '<table rules="all" border="1px solid #666666" style="background-color:#F8F8F8; width:600px; font-family:arial; font-size:11px;">';
$message .= '<td style="width:200px;" /></td>';
$message .= "<tr><td><strong></strong> </td><td><h3>Feedbackformulier Multihout.nl</h3></td></tr>";
// 'Attributes'
$message .= "<tr><td><hr/></td><td><hr/></td></tr>";
$message .= "<tr><td><strong>Feedback datum:</strong> </td><td> " . $datum . "</td></tr>";
$message .= "<tr><td><strong>Feedback e-mailadres:</strong> </td><td> " . $email . "</td></tr>";
$message .= "<tr><td><strong>Feedback IP-adres:</strong> </td><td> " . $ip . "</td></tr>";
// 'Algemeen'
$message .= "<tr><td><hr/></td><td><hr/></td></tr>";
$message .= "<tr><td><strong>Algemene rating van de site:</strong> </td><td>" . $algemene_rating . "</td></tr>";
$message .= "<tr><td><hr/></td><td><hr/></td></tr>";
$message .= "<tr><td><strong>Feedback over URL:</strong> </td><td>" . $url_van_foutpagina . "</td></tr>";
$message .= "<tr><td><hr/></td><td><hr/></td></tr>";
$message .= "<tr><td><strong>Onderwerp suggestie:</strong> </td><td>" . $sugestie_onderwerp . "</td></tr>";
$message .= "</table>";
$message .= "</body></html>";
// Gedeelte voor het verzenden van het bericht
$mailadres = "test@test.nl";
$message = str_replace ("<br>","\n", $message);
$headers .= "From: Test <test@test.nl>" . "\r\n";
mail("$mailadres", "Nieuw bericht via mailformulier", $message, $headers);
?>
<!--Display a thankyou message in the callback -->
<div id="mail_response">
<h3>Thank you <?php echo $name ?>!</h3><br />
<p>I will answer your message soon as possible.</p><br /><br /><br />
<h5>Message sent on: </h5>
<p><?php echo $todayis ?></p>
</div>
しかし、この JS スクリプト (送信/投稿部分) を使用すると、メールやテーブルに未定義の値が表示されます。
//submission scripts
$('.contactForm').submit( function(){
//statements to validate the form
var filter = /^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/;
var email = document.getElementById('e-mail');
if (!filter.test(email.value)) {
$('.email-missing').show();
} else {$('.email-missing').hide();}
//if (document.cform.name.value == "") {
// $('.name-missing').show();
//} else {$('.name-missing').hide();}
//if (document.cform.message.value == "") {
// $('.message-missing').show();
//} else {$('.message-missing').hide();}
if
//((document.cform.name.value == "") ||
(!filter.test(email.value))
//|| (document.cform.message.value == ""))
{
return false;
}
if
//((document.cform.name.value != "") &&
(filter.test(email.value))
//&& (document.cform.message.value != ""))
{
//hide the form
$('.contactForm').hide();
//show the loading bar
$('.loader').append($('.bar'));
$('.bar').css({display:'block'});
//send the ajax request
$.post('mail.php',{
algemene_rating:$('#algemene_rating').val(),
url_van_foutpagina:$('#url_van_foutpagina').val(),
sugestie_onderwerp:$('#sugestie_onderwerp').val(),
email:$('#email').val()},
//return the data
function(data){
//hide the graphic
$('.bar').css({display:'none'});
$('.loader').append(data);
});
//waits 2000, then closes the form and fades out
setTimeout('$("#backgroundPopup").fadeOut("slow"); $("#contactForm").slideUp("slow")', 2000);
//stay on the page
return false;
}
});
//only need force for IE6
$("#backgroundPopup").css({
"height": document.documentElement.clientHeight
});
});
問題はここにあると思います:
//send the ajax request
$.post('mail.php',{
algemene_rating:$('#algemene_rating').val(), url_van_foutpagina:$('#url_van_foutpagina').val(),
sugestie_onderwerp:$('#sugestie_onderwerp').val(), email:$('#email').val()},
しかし、jqueryで正しくPOSTする方法がわかりません。または、正しい方法で取得して .html メールに入れます。フォーム全体を .serialize しようとしましたが、これを「unserialize」して、html-mail を正しく入力できるようにする方法がわかりません。
皆さんが私を助けてくれることを願っています..これを自分で解決するために、今長い間探して試しています..:)