![](/img/trans.png)
[英]how to send a value from php select option to another php page using ajax?
[英]How to send the value of select tag using ajax to php residing on the same page
问题
我想使用select
标记来选择一个值,并使用ajax调用将该值发送到嵌入在同一页面中的PHP。
在这里,在我的代码中,我正在使用select标记,并且一旦从下拉列表中选择了任何值,该值就会被发送到javascript并得到适当的警报。 但是当我在PHP中使用$ _POST ['option']并回显它时,它并没有打印在页面上。
我知道PHP是一种服务器端语言,并且在页面加载时,任何用PHP编写的内容都会首先执行。
tablesize.php
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0 /jquery.min.js"></script>
<script type="text/javascript">
function fetch_select(val){
$.ajax({
type: 'post',
url: 'tablesize.php',
datatype:'json',
data: {option:val},
success: function (response) {
alert(val);
//document.getElementById("new_select").innerHTML=response;
}
});
}
</script>
</head>
<body>
<p id="heading">Dynamic Select Option Menu Using Ajax and PHP</p>
<center>
<div id="select_box">
<select onchange="fetch_select(this.value);">
<option value="10">state</option>
<option value="20">20</option>
</select>
</div>
</body>
</html>
<?php
if(isset($_POST['option'])){
$val=$_POST['option'];
echo $val;
}
?>
谢谢...
同一页面的ajax调用和回显值
<?php
session_start();
?>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$(document).on("change","#sel",function(){
var val = $(this).val();
console.log(val);
$.ajax({
type: 'post',
url: 'index.php?action=data',
datatype:'json',
data: {"option":val},
success: function (response) {
alert(val);
location.href="index.php";
}
});
});
});
</script>
</head>
<body>
<div id="select_box">
<select id="sel" name="sel">
<option <?php if($_SESSION['val']=="a") echo "selected" ;?> value="a">a</option>
<option <?php if($_SESSION['val']=="b") echo "selected" ;?> value="b">b</option>
<option <?php if($_SESSION['val']=="c") echo "selected" ;?> value="c">c</option>
<option <?php if($_SESSION['val']=="d") echo "selected" ;?> value="d">d</option>
<option <?php if($_SESSION['val']=="e") echo "selected" ;?> value="e">e</option>
<option <?php if($_SESSION['val']=="e") echo "selected" ;?> value="f">f</option>
</select>
</div>
</body>
</html>
<?php
$val = $_POST['option'];
if($_REQUEST['action']=="data"){
$_SESSION['val']=$val;
echo "Selected value = ".$_SESSION['val'];
}elseif ($val=="") {
echo "Selected value = ".$_SESSION['val'];
}
?>
不同的ajax.php,在此处编写代码,并在ajax代码中更改url。
Ajax.php
<?php
if(isset($_POST['option']))
{
$val=$_POST['option'];
echo $val;
}
?>
你的ajax代码...
function fetch_select(val){
$.ajax({
type: 'post',
url: 'ajax.php',
datatype:'json',
data: {option:val},
success: function (response) {
alert(response);
//document.getElementById("new_select").innerHTML=response;
}
});
}
这是您的解决方案
Ajax成功包含您的结果。 错误出在您的打印方法中。
您需要为ajax使用其他文件,这里我使用ajax.php 。
还有一件事情总是将脚本放在HTML页面上。
tablesize.php
<html>
<head>
</head>
<body>
<p id="heading">Dynamic Select Option Menu Using Ajax and PHP</p>
<center></center>
<div id="select_box">
<select onchange="fetch_select(this.value);">
<option value="10">state</option>
<option value="20">20</option>
</select>
</div>
<p id="print-ajax"></p><!--Result will print here-->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0 /jquery.min.js"></script>
<script type="text/javascript">
function fetch_select(val){
$.ajax({
type: 'post',
url: 'ajax.php',
datatype:'json',
data: {option:val},
success: function (response) {
$('#print-ajax').html(response);//This will print you result
}
});
}
</script>
</body>
</html>
ajax.php
echo $_POST['option'];die;
您在ajax发布成功后打印了错误的变量。 您需要response
变量来警告PHP脚本的输出。
还要将PHP post handler块放在页面顶部,以便HTML内容不会包含在AJAX的响应中。
更新的代码:
<?php
if(isset($_POST['option'])){
$val=$_POST['option'];
echo $val; exit;
}
?>
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.min.js"
type="text/javascript"></script>
<script type="text/javascript">
function fetch_select (val){
$.ajax({
type: 'post',
url: 'tablesize.php',
datatype:'json',
data: { option:val },
success: function (response) {
alert(response);
}
});
}
</script>
</head>
<body>
<p id="heading">Dynamic Select Option Menu Using Ajax and PHP</p>
<center>
<div id="select_box">
<select onchange="fetch_select(this.value);">
<option value="10">state</option>
<option value="20">20</option>
<option value="30">30</option>
</select>
</div>
</body>
</html>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.