【发布时间】:2016-09-15 04:07:32
【问题描述】:
我正在尝试从 3 个复选框菜单中获取 3 组复选框值。请注意,一个复选框菜单具有使用 PHP/SQL 生成的值。另请注意,我故意没有<submit> 按钮。一旦用户检查它们,我想要这些复选框值 - 而不是提交事件。
最终,我希望这些值集分别位于各自的 PHP 变量中,并且我希望它们在同一页面上使用。我读过最好使用 AJAX 将这些 JS 值转换为 PHP 中的变量。到目前为止,我已经构建了以下内容:
<form id="numberOrderForm" action="index.php" method="POST">
<div class="wrappers" id="multi-select1Wrapper">
<h2>Area Code</h2>
<select class="dropDownMenus" id="multi-select1" name="multi_select1[]" multiple="multiple">
<?php
//The query asking from our database
$areaCodeSQL = "SELECT ac.Number AS `AreaCode`, ac.Name AS `AreaName`
FROM `AreaCodes` ac"; //SQL query: From the table 'AreaCodes' select 'Number' and put into 'AreaCode', select Name and put into 'AreaName'
$areaCodeResults = $conn->query($areaCodeSQL); // put results of SQL query into this variable
if ($areaCodeResults->num_rows > 0) { // if num_rows(from $results) is greater than 0, then do this:
// output data of each row
foreach($areaCodeResults as $areaCodeResult) //for each item in $areCodeResults do this:
{
$areaNameAndCode = $areaCodeResult['AreaCode'] ." ". $areaCodeResult['AreaName']; //get AreaCode and AreaName from query result and concat them
$areaName = $areaCodeResult['AreaName']; // get AreaName
$areaCode = $areaCodeResult['AreaCode']; //get AreaCode
?><option class="menuoption1" name="menuAreaCode" value="<?php echo $areaCode ?>" ><?php echo $areaNameAndCode; ?></option><?php //Create this option element populated with query result variables
}
}
?>
</select>
</div>
<div class="wrappers" id="multi-select2Wrapper">
<h2>Number Type</h2>
<select class="dropDownMenus" id="multi-select2" name="multi_select2[]" multiple="multiple">
<option class="menuoption2" name="package" value="gold">Gold</option>
<option class="menuoption2" name="package" value="silver">Silver</option>
<option class="menuoption2" name="package" value="bronze">Bronze</option>
</select>
</div>
<div class="wrappers" id="multi-select3Wrapper">
<h2>Order</h2>
<select class="dropDownMenus" id="multi-select3" name="multi_select3[]">
<option class="menuoption3" value="sequential">Sequential</option>
<option class="menuoption3" value="random">Random</option>
</select>
</div>
</form>
然后我设置了我的 AJAX 请求 - 每个复选框菜单一个,因为最终我想要 3 个 PHP 变量。每个都发出 AJAX 请求,如果成功,则会显示一个包含这些复选框值的基本警报框。他们在这里:
<script>
$(function(){
$("#multi-select1").change(function(e){
var areaCode = $("#multi-select1").val();
$.ajax({
type: 'post',
url: '/index.php',
dataType: 'text',
data: 'areacode=' +areaCode,
success: function(d){
if (d.length) alert(d);
}
});
});
$("#multi-select2").change(function(e){
var numberOrder = $("#multi-select2").val();
$.ajax({
type: 'post',
url: '/index.php',
dataType: 'text',
data: 'numberorder=' +numberOrder,
success: function(d){
if (d.length) alert(d);
}
});
});
$("#multi-select3").change(function(e){
var order = $("#multi-select3").val();
$.ajax({
type: 'post',
url: '/index.php',
dataType: 'text',
data: 'order=' +order,
success: function(d){
if (d.length) alert(d);
}
});
});
}); //end ready
到目前为止一切顺利。这些警报框包含正确的值。我的控制台在发出 POST 请求时也是...index.php?areaCode=*value,value*,这样看起来也很正常。
因此,我想我将能够像这样回应已发布的值:
<div>
<?php
if(isset($_POST['areaCode'])){
$ac = $_POST['areaCode'];
foreach($ac as $value){
echo $value;
}
}
?>
</div>
但是什么也没发生。有人可以帮忙吗?
【问题讨论】:
-
您可以首先在您的 javascript
function(response){ alert(areaCode); });中显示 返回或未返回的数据,但function(response){ alert(response); });不会删除它,但function(response){ alert(response); });可能会