Javascript 使用从jquery传递到php的变量动态更新字段
我在从MYSQL/PHP填充的下拉列表中有一堆锁柜编号。当您在同一页的下面两个输入字段中从列表中选择一个储物柜号码时,我想显示储物柜的组合和位置 我使用jquery告诉我列表中的哪个项目是动态选择的。然后我使用$.ajax函数将该项目发送到我的服务器 我的问题是:我可以使用$.ajax将变量发送到我所在的页面吗?我尝试过这个,但我得到了一个错误。我不知道如何做到这一点。我对AJAX的了解很少 我的代码如下:Javascript 使用从jquery传递到php的变量动态更新字段,javascript,php,jquery,mysql,ajax,Javascript,Php,Jquery,Mysql,Ajax,我在从MYSQL/PHP填充的下拉列表中有一堆锁柜编号。当您在同一页的下面两个输入字段中从列表中选择一个储物柜号码时,我想显示储物柜的组合和位置 我使用jquery告诉我列表中的哪个项目是动态选择的。然后我使用$.ajax函数将该项目发送到我的服务器 我的问题是:我可以使用$.ajax将变量发送到我所在的页面吗?我尝试过这个,但我得到了一个错误。我不知道如何做到这一点。我对AJAX的了解很少 我的代码如下: <!doctype html> <html>
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Locker Backend</title>
<link rel="stylesheet" type="text/css" href="style.css">
<link rel="stylesheet" type="text/css" href="form.css">
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script type="text/javascript">
function show()
{
$('#addlocker').toggle();
}
function lockerSelected(sel)
{
var selected = (sel.options[sel.selectedIndex].text);
$.ajax({
type:"POST",
url: "studentdata.php",
data: selected,
success: function(){
alert(selected);
}
});
}
</script>
<!--[if lt IE 9]>
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
</head>
<body>
<?php
$url = $_SERVER['REQUEST_URI'];
$studID = substr($url, strpos($url, "=") + 1);
$db_handle = mysql_connect("localhost", "root", "pickles") or die("Error connecting to database: ".mysql_error());
mysql_select_db("lockers",$db_handle) or die(mysql_error());
$result = mysql_query("SELECT * FROM students WHERE studID = $studID");
?>
<div class="container">
<header> <a href="#"><img src="images/headmast.png" alt="Insert Logo Here" width="686" height="180" id="Insert_logo" /></a> </header>
<div id="data1">
<form id ="studData" name="studData" action="update.php" medthod="post">
<fieldset>
<legend>Student Details</legend>
<?php
while($row = mysql_fetch_array($result))
{
echo '<ol>';
echo '<li>';
echo '<label for=studid>Student ID</label>';
echo '<input id=studid name=studid type=text value='.$row['studID'].'>';
echo '</il>';
echo '<li>';
echo '<label for=fname>First Name</label>';
echo '<input id=fname name=fname type=text value='.$row['firstName'].'>';
echo '</il>';
echo '<li>';
echo '<label for=fname>Last Name</label>';
echo '<input id=lname name=lname type=text value='.$row['lastName'].'>';
echo '</il>';
echo '<li>';
echo '<label for=email>Email</label>';
echo '<input id=email name=email type=text value='.$row['email'].'>';
echo '</il>';
echo '<li>';
echo '<label for=progam>Program</label>';
echo '<input id=progam name=progam type=text value='.$row['program'].'>';
echo '</il>';
echo '</ol>';
$program = $row['program']; //get name of program
}
?>
<input type="submit" value="Update" class="fButton"/>
</fieldset>
</form>
<form id="locker" name="locker" action="" method="post" >
<fieldset>
<input type="button" onclick="show()" value="Add Locker"/>
<div id="addlocker" style="display:none;">
<!--
query lockers where $program = program parsed in & student id is equal to 0 (this makes it available)
get select list to 10
populate select list --> <br/>
<legend>Lockers Available: </legend>
<select size="10" name="lockerSelect" multiple="yes" style="width:200px;" onChange="lockerSelected(this);">
<?php
$result1=mysql_query("SELECT * FROM lockers WHERE progName = '$program' && studID = 0") or die($result1."<br/><br/>".mysql_error());
while($row1 = mysql_fetch_array($result1))
{
echo '<option value=\"'.$row1['lockerScan'].'">'.$row1['lockerNo'].'</option>';
}
echo '</select>';
echo '<br>';
$lockerNo = $_POST['selected']; \\doesn't work - displays error
echo $lockerNo; \\errors out
?>
</div><!--end of add locker section-->
</fieldset>
</form>
</div><!--end of data1 -->
<a href="backendhome.php" class="actionButton" style="float:left;clear:both">Search</a>
</div><!-- end of container-->
</body>
</html>
首先,你可以使用:
function show()
{
$('#addlocker').toggle();
}
然后,您应该进一步了解Ajax和PHP。你的电话应该是:
var selected = (sel.options[sel.selectedIndex].text);
$.ajax({
type:"POST",
url: "studentdata.php",
data: {selected: selected},
success: function(data){
alert(data);
}
});
在PHP文件中:
<?php
$select = $_POST['selected'];
//....
// Do what you have to do then return your result
echo '<div>Send to your page !</div>';
首先整理你的档案。
js在js文件夹中
php在php文件夹中
最好的方法是指定一个单独的php页面,然后在js中使用更改事件
$(document).on("change", "#selectfieldid", function(){
var selected = $('#selectfieldid').val();
$.ajax({
type:"POST",
url: "studentdata.php",
data: selected,
success: function(data){
$('#addlocker').val(data); //echoed result placed here that has id addlocker
}
});
});
将它们发送到一个php页面,并在该php中回显结果。您应该有另一个文件将AJAX调用发送到该文件。然后,该页面应该返回json或只是一个字符串或其他内容:如果您这样做,您可以为确定的内容和不确定的内容编写自己的代码。。例如,500=权限被拒绝,404=未找到,200=正常。现在我偷了那些密码;我也经常出于不同的目的使用它们,因为它们从网络服务器进入我的大脑。如果这样做,您可以在JS/JQuery中检查它是否确实存储在数据库中:谢谢您的输入。这样可以发送数据。我只需要深入研究AJAX,了解如何使用这些数据与mysql数据库通信,并在同一页面上显示所有信息。我进一步研究了这一点,并使其发挥作用!再次感谢您的意见。我一直在追求成为一名更好的程序员。谢谢你的帮助。您在成功中的行:fuctiondata{};真的帮助我理解了我可以将php页面中的信息放到当前页面上。非常感谢!