AJAX+PHP+MYSQL实现两个下拉框间的数据联动

最新推荐文章于 2021-02-17 04:48:58 发布

enjoyxp

最新推荐文章于 2021-02-17 04:48:58 发布

阅读量2.3k

点赞数

分类专栏： php ajax 文章标签： mysql ajax php function xmlhttprequest query

本文链接：https://blog.csdn.net/enjoyxp/article/details/1830103

版权

php 同时被 2 个专栏收录

48 篇文章 0 订阅

订阅专栏

ajax

10 篇文章 0 订阅

订阅专栏

这个实例是我从项目中抽取出来的，有点乱，但是实现了无刷新的异动。刚学ajax，写的有点粗糙，凑合看吧。将inv_open.php文件放入www下，访问方式：http://localhost/inv_open.php。

代码如下：

1.inv_open：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>ajax appliction sample:by enjoyxp 2007.10.17 21:15</title>
<script type="text/javascript">
function checkinput(form){
  if(add_inv_form.inv_plant.value=="0"){
   alert("请选择工厂名称!");
   return(false);
  }
  if(add_inv_form.inv_loc.value=="0"){
   alert("请选择库房名称!");
   return(false);
  }
  /* re=/^[1-9]+[0-9]{0,14}$|^[0-9]{0,15}.[0-9]+$/;
  if(!re.test(add_inv_form.inv_oh_qty.value)){
   alert("目前数量无效，请重新输入!");
   add_inv_form.inv_oh_qty.value="";
   add_inv_form.inv_oh_qty.select();
   return(false);
  } */
}

function displayData() {
  xmlhttp = createXMLHttpRequest();
  if (xmlhttp) {
   var postStr="plant="+ document.add_inv_form.inv_plant.value ;
   xmlhttp.open("POST", "inv_openTest.php", true);
   xmlhttp.onreadystatechange = updatePage;
   xmlhttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded;charset=gb2312");
   xmlhttp.send(postStr);
  }
}

function updatePage() {
  if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
      //获取伺服器的回应：xml数据
   var xmlDoc = xmlhttp.responseXML;
   //用两个数组接收xml数据
   var result = new Array();
   var result2 = new Array();
   var len=xmlDoc.getElementsByTagName("ids").length;
   for (i=0; i<len; i++){
    var p = xmlDoc.getElementsByTagName("ids")[i];
    var pval = p.firstChild.nodeValue;
    result[i] = pval;

    var p2 = xmlDoc.getElementsByTagName("descs")[i];
    var pval2= p2.firstChild.nodeValue;
    result2[i] = pval2;
   }

   //测试从伺服器获取的数据（换行）是否正确
   var results="";
   for(j=0; j<len; j++){
    results=results+result[j]+String.fromCharCode(10);
   }
   //alert("results="+results);

   //清空select控件的内容
   document.add_inv_form.inv_loc.options.length = 0;
   //将接收到的两个数组中的数据分别作为text和value放入select中
   for(k=0; k<len; k++){
    var oOption=document.createElement("Option");
    oOption.text=result[k]+"-"+result2[k];
    oOption.value=result[k];
    document.add_inv_form.inv_loc.add(oOption);
   }
  }
}

<?php
mysql_close($link);
?>

2.inv_openTest.php：

<?php
function db_link(){
$access_id = "root";
$db_name = "inv";
@ $db = mysql_connect('localhost', $access_id, '831025') or
die("Could not connect to database. Please contact with IT supporting team ASAP.");
mysql_query("SET NAMES 'GBK'");
mysql_select_db($db_name);
return $db;
}
$link = db_link();

$inv_plant = $_POST['plant'];
$loc_sql = "SELECT * FROM loc WHERE loc_plant ='".$inv_plant."' AND loc_act = '1'";
$loc_result = mysql_query($loc_sql);

header("Content-Type:text/xml");//accessary code
echo '<?xml version="1.0" encoding="gb2312" ?>
<locations>';
  while($loc_rs=mysql_fetch_array($loc_result)){
   echo '<ids>'.$loc_rs['loc_id'].'</ids>';
   echo '<descs>'.$loc_rs['loc_desc'].'</descs>';
  }
echo '</locations>';

mysql_close($link);
?>

3.submit.php:

<?php
echo "succeed";
?>