在提交PHP BEFORE表单时将复选框值放入变量中

时间:2016-05-13 14:30:43

标签: php html checkbox

我有一系列简单的复选框。

<select>
    <option class="menuoption2" value="gold">Gold</option>
    <option class="menuoption2" value="silver">Silver</option>
    <option class="menuoption2" value="bronze">Bronze</option>
</select>

我想只将已检查的变量放入PHP变量中。但请注意,没有“提交”按钮。这是有目的的,我已经给出的简报不允许;我的变数&#39;只要单击复选框,就必须在简单的<div>中显示值。我不能让页面刷新。我知道我可以使用$ _POST - 但是只有我可以提交任何内容并且我可以使用jQuery(事实上我之前已经这样做)来做到这一点但最终我需要那些PHP变量中的值,而不是JS变量。有什么想法吗?

1 个答案:

答案 0 :(得分:0)

HTML

<select onchange="postit(event)">
    <option class="menuoption2" value="gold">Gold</option>
    <option class="menuoption2" value="silver">Silver</option>
    <option class="menuoption2" value="bronze">Bronze</option>
</select>

JS / AJAX

将值发布到update.php,其中metal = value

<script type="text/javascript">//<![CDATA[

var xmlhttp;
function postit(event){
   var value = event.target.value;
  xmlhttp=null;
  var Url="update.php"
  if (window.XMLHttpRequest) {
      xmlhttp=new XMLHttpRequest();
  }
  else if (window.ActiveXObject) { 
     xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
  if (xmlhttp!=null) {
    xmlhttp.onreadystatechange=getResponse;
     xmlhttp.open("POST", Url, true);
     xmlhttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded; charset=UTF-8");
     xmlhttp.send( "metal=" + value);  
  } else {
     alert("UNEXPECTED ERROR: XMLHttpRequest not supported");
  }
}
function getResponse(){
  if (xmlhttp.readyState==4){
    if (xmlhttp.status==200){
      var json = JSON.parse(xmlhttp.responseText);
    }
    else{
      alert("UNEXPECTED AJAX ERROR: : " + xmlhttp.statusText + "HTTP Status: " + xmlhttp.status);
    }
  }
}
//]]>
</script>

PHP

<?php
$metal = $_POST['metal'];

// This is just to validate the received data, 
// mostly needed if you are storing in a database.
$metals = array('gold','silver','bronze');
$status = 'fail';
if($metals[$metal] != null){
   $status = 'pass';
  //store $metal
}

//To return a value to JS after the update, add the code below

$return['status'] = $status;
header(header('Content-Type: text/json; charset=utf-8');
echo json_encode($return);
?>

JS没有返回值

从JS中删除这两行

var Url="update.php"
xmlhttp.onreadystatechange=getResponse;

删除函数getResponse()

global var xmlhttp;作为本地var:

移动到postit()函数中

var xmlhttp;
function postit(){

function postit(){
var xmlhttp;