我第一次嘗試使用 jQuery,但回傳多個復選框值時遇到問題。我認為以下 jQuery 是正確的,但是無論選擇什么,它都只回傳電子郵件中的第一個值“黑色”。
任何有關如何將選定復選框作為串列回傳的建議將不勝感激!謝謝你。
*** 更新后的復選框 ID 彼此不同 ***
PHP 和 jQUERY:
<script src="https://code.jquery.com/jquery-2.1.1.min.js" type="text/javascript"></script>
<script>
function sendSupplierForm() {
var data = {
ordernumber: $("#ordernumber").val(),
servicelist: $("#servicelist").val(),
};
jQuery.ajax({
url: "email.php",
data: data,
dataType:'text',
type: "POST",
success:function(data){
$("#EmailStatus").html(data);
},
error:function (){}
});
}
</script>
<div id="SupplierForm">
<div id="EmailStatus"></div>
<input type="text" name="ordernumber" id="ordernumber" value="456122"><br>
<input class="list" type="checkbox" name="servicelist[]" id="servicelist1" value="BLACK">Black<br>
<input class="list" type="checkbox" name="servicelist[]" id="servicelist2" value="RED">Red<br>
<input class="list" type="checkbox" name="servicelist[]" id="servicelist3" value="YELLOW">Yellow<br>
<div name="submit" class="btnAction" onClick="sendSupplierForm();">Send</div>
</div>
電子郵件.php
<?php
$mailto = "info@******.com";
$subject = "Test Form";
$headers = "From: info@******.com\nMIME-Version: 1.0\nContent-Type: text/html; charset=utf-8\n";
$message = "
<html>
<head>
<title>Supplier Form Details</title>
</head>
<body>
<p>Original Order Number: " . $_POST['ordernumber'] . "</p>
<p>Service List: " . $_POST['servicelist'] . "</p>
</body>
</html>
";
// PHP MAILER FUNCTION
$result1 = mail($mailto, $subject, $message, $headers);
// PHP MAILER MESSAGE
if ($result1) {
print "<p class='success'>SUCCESS!!! The details have been sent.</p>";
} else {
print "<p class='Error'>ERROR... Sorry there is a problem sending the details.</p>";
}
?>
uj5u.com熱心網友回復:
Jquery 默認選擇第一個元素,因此您應該選擇所有復選框并收集值
function sendSupplierForm() {
let values = [];
$("input[name='servicelist']:checked").each(function() {
values.push($(this).val());
});
var data = {
ordernumber: $("#ordernumber").val(),
servicelist: values
};
jQuery.ajax({
url: "email.php",
data: data,
dataType:'text',
type: "POST",
success:function(data){
$("#EmailStatus").html(data);
},
error:function (){}
});
}
此外,您為所有復選框添加了相同的 id,這是不正確的。
uj5u.com熱心網友回復:
POST 值將在 email.php 中接收。您不能將服務串列鍵視為字串,它是一個值陣列,因此,您需要像這樣回圈。
"<body>";
"<p>Original Order Number: " . $_POST['ordernumber'] . "</p>";
"<p>Service List: ";
//these lines can be written above.
$seperate = implode(",",$_POST['servicelist']);
$serviceList = trim(",",$seperate);
//these lines can be written above.
echo $serviceList;
"</p>";
"</body>";
我希望這能解決你的問題:)。
uj5u.com熱心網友回復:
非常感謝@Aro和@ArkDevLarry!
我的代碼有兩個主要問題。首先,jQuery 沒有像@Aro 提到的那樣收集復選框的值,其次,我太專注于 jQuery,忘記了 @ArkDevLarry 提到的“內爆”值陣列。
這兩個建議都幫助我制定了以下完美運行的代碼。
我希望這可以幫助正在尋找類似解決方案的其他人!
表單 PHP 和 JQUERY:( 注意:確保 email.php 的路徑正確)
<script src="https://code.jquery.com/jquery-2.1.1.min.js" type="text/javascript"></script>
<script>
function sendSupplierForm() {
let values = [];
$("input[name='servicelist[]']:checked").each(function() {
values.push($(this).val());
});
var data = {
ordernumber: $("#ordernumber").val(),
servicelist: values
};
jQuery.ajax({
url: "email.php",
data: data,
dataType:'text',
type: "POST",
success:function(data){
$("#EmailStatus").html(data);
},
error:function (){}
});
}
</script>
<div id="SupplierForm">
<div id="EmailStatus"></div>
<input type="text" name="ordernumber" id="ordernumber" value="1234567890"><br>
<input class="list" type="checkbox" name="servicelist[]" id="servicelist1" value="BLACK" >Black<br>
<input class="list" type="checkbox" name="servicelist[]" id="servicelist2" value="RED" checked >Red<br>
<input class="list" type="checkbox" name="servicelist[]" id="servicelist3" value="YELLOW" checked >Yellow<br>
<div name="submit" class="btnAction" onClick="sendSupplierForm();">Send</div>
</div>
email.php (注意:確保更改電子郵件地址以使其正常作業)
<?php
$mailto = "info@******.com";
$subject = "Test";
$headers = "From: info@******.com\nMIME-Version: 1.0\nContent-Type: text/html; charset=utf-8\n";
$seperate = implode("<br>",$_POST['servicelist']);
$message = "
<html>
<head>
<title>Supplier Form Details</title>
</head>
<body>
<p>Original Order Number: " . $_POST['ordernumber'] . "</p>
<p>Service List: <br>" . $seperate . "</p>
</body>
</html>
";
$result1 = mail($mailto, $subject, $message, $headers);
if ($result1) {
print "<p class='success'>SUCCESS!!! The details have been sent.</p>";
} else {
print "<p class='Error'>ERROR... Sorry there is a problem sending the details.</p>";
}
?>
轉載請註明出處,本文鏈接:https://www.uj5u.com/yidong/504300.html
