php - 使用 javascript 在不同的表单字段中显示 2 个不同的 MySQL 结果

标签 php javascript mysql forms

我有一个运行良好的用户表单。该页面使用 JavaScript 脚本从外部 php 文件执行 mysql 查询并将结果显示在表格上。

我想要做的是能够在表单上显示多个不同查询的结果。

在此示例中我有 4 个文件。 test.php 的形式 getdata1.php 获取产品信息的 mysql 结果 getwhse1.php 获取仓库信息的 mysql 结果 getsu1.php 获取销售单位信息的 mysql 结果

目前,该脚本仅在从 getdata1.php 获取结果时才有效?如何更改 javascripscript 以允许我显示 getwhse1.php 和 getsu1.php 的结果?

下面是现有页面的代码,我想要做的是输入产品代码并在每个表格字段中显示该产品代码的详细信息。

test.php

<html>
<head>
<title>Sales Portal</title>
<script type="text/javascript"> 
  function showUser(userNumber, str) 
  { 
    if (str=="") 
    { 
      document.getElementById("txtHint" + userNumber).innerHTML=""; 
      return; 
    }   
    if (window.XMLHttpRequest) 
    {// code for IE7+, Firefox, Chrome, Opera, Safari 
      xmlhttp=new XMLHttpRequest(); 
    } 
    else 
    {// code for IE6, IE5 
      xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); 
    } 

    xmlhttp.onreadystatechange=function() 
    { 
      if (xmlhttp.readyState==4 && xmlhttp.status==200) 
      { 
        document.getElementById("txtHint" + userNumber).innerHTML=xmlhttp.responseText; 
      } 
    } 
    xmlhttp.open("GET","getdata1.php?q="+str,true); 
    xmlhttp.send(); 
  }
</script>

</head>
<body topmargin=0>

<form name="orderform" id="orderform" action="newsale.php" method="post">

<table border=1>    

<tr>
<td>Product Code</td>
<td>Description</td>
<td>Warehouse</td>
<td>Selling Units</td>
</tr>
<tr id="r1">  
    <td width=100>
        <input size=10  type=number id=sku1 name=sku1 onchange="showUser(1, this.value)">
    </td>
    <td width=280>
        <div align="left" id="txtHint1">&nbsp;</div>
    </td>
    <td width=100>
        <div align="left" id="whse1">&nbsp;</div>
    </td>
    <td width=100>
        <div align="left" id="su1">&nbsp;</div>
    </td>
</tr>
<tr id="r2">  
    <td>
        <input size=10  type=number id=sku2 name=sku2 onchange="showUser(2, this.value)">
    </td>
    <td>
        <div align="left" id="txtHint2">&nbsp;</div>
    </td>
    <td>
        <div align="left" id="whse2">&nbsp;</div>
    </td>
    <td width=100>
        <div align="left" id="su2">&nbsp;</div>
    </td>
</tr>
<tr id="r3">  
    <td>
        <input size=10  type=number id=sku3 name=sku3 onchange="showUser(3, this.value)">
    </td>
    <td>
        <div align="left" id="txtHint3">&nbsp;</div>
    </td>
    <td>
        <div align="left" id="whse3">&nbsp;</div>
    </td>
    <td width=100>
        <div align="left" id="su3">&nbsp;</div>
    </td>
</tr>
<tr id="r4">  
    <td>
        <input size=10  type=number id=sku4 name=sku4 onchange="showUser(4, this.value)">
    </td>
    <td>
        <div align="left" id="txtHint4">&nbsp;</div>
    </td>
    <td>
        <div align="left" id="whse4">&nbsp;</div>
    </td>
    <td width=100>
        <div align="left" id="su4">&nbsp;</div>
    </td>
</tr>
</table>
</form>

</body>
</html>

getdata1.php

<?php
 $q=$_GET["q"];

$con = mysql_connect('localhost', 'username', 'password');
 if (!$con)
   {
   die('Could not connect: ' . mysql_error());
   }

mysql_select_db("dbname", $con);


$sql="SELECT Category, Description,SellingUnits,Grouping,CasesPerPallet,ShrinksPerPallet FROM skudata WHERE packcode = '".$q."'";
$result = mysql_query($sql);
$rows=mysql_num_rows($result);

if($rows==0){echo "<font color=red><b>NOT A VALID PRODUCT CODE</b></font>";} else {
while($row = mysql_fetch_array($result))
   {
   echo "<font color=red>".$row['Description']."</font>, ";
   if($row['SellingUnits']=="CS"){echo "<font color=red>".$row['CasesPerPallet']."</font> ";} elseif($row['SellingUnits']=="SHR") {echo "<font color=red>".$row['ShrinksPerPallet']."</font> ";}
   }}

mysql_close($con);
 ?> 

getwhse1.php

<?php
 $q=$_GET["q"];

$con = mysql_connect('localhost', username', 'password');
 if (!$con)
   {
   die('Could not connect: ' . mysql_error());
   }

mysql_select_db("database", $con);

$sql="SELECT grouping FROM skudata WHERE packcode = '".$q."'";
$result = mysql_query($sql);
$rows=mysql_num_rows($result);

if($rows==0){echo "&nbsp;";} else {
while($row = mysql_fetch_array($result))
   {
   echo "<font color=red>".$row['grouping']."</font>, ";
   }}

mysql_close($con);
 ?> 

getsu1.php

<?php
 $q=$_GET["q"];

$con = mysql_connect('localhost', 'username', 'password');
 if (!$con)
   {
   die('Could not connect: ' . mysql_error());
   }

mysql_select_db("database", $con);

$sql="SELECT SellingUnits  FROM skudata WHERE packcode = '".$q."'";
$result = mysql_query($sql);
$rows=mysql_num_rows($result);

if($rows==0){echo "&nbsp;";} else {
while($row = mysql_fetch_array($result))
   {
   echo "<font color=red>".$row['SellingUnits ']."</font>, ";
   }}

mysql_close($con);
 ?> 

我的 javascript 技能不存在,我如何编辑此脚本来执行所有三个 mysql 查询并将结果显示在页面上?全部通过输入产品代码激活?

感谢和问候, 瑞安

最佳答案

<?php
  $q=$_GET["q"];
  $con = mysql_connect('localhost', 'username', 'password');
 header('Content-type: application/json');
  if (!$con ||strlen($q)>5){ die(json_encode(array('results'=>-1)))}
  mysql_select_db("dbname", $con);
  $result=mysql_query("SELECT * FROM skudata WHERE packcode = '$q'");
  echo json_encode(array('results'=>$result));
 mysql_close($con);
 ?>

<html><head><title>Sales Portal</title>
<style type="text/css"> 
.redtext {color: red}
</style>
<script type="text/javascript">
  function showUser(userNumber, str){ 
    if (str==""){ 
      document.getElementById("txtHint" + userNumber).innerHTML="";
    }
    if (window.XMLHttpRequest){xmlhttp=new XMLHttpRequest()}
    else{xmlhttp=new ActiveXObject("Microsoft.XMLHTTP")}
    xmlhttp.onreadystatechange=function(){ 
      if (xmlhttp.readyState==4 && xmlhttp.status==200){
    var json = JSON.parse(xmlhttp.responseText);
    result = json.results;
    if(result==-1){
      document.getElementById('txtHint'+userNumber).innerHTML="Database error.";
      } 
    if(result.length = 0){
      document.getElementById("txtHint"+userNumber).innerHTML="INVALID PRODUCT CODE"; 
    }
    else {
      i=0;
      while(i<result.length){
        var desc=result[i].Description+"&nbsp;";
        switch(result[i].SellingUnits){
          case "CS": desc += result[i].CasesPerPallet+"<br/>";
          break;
          case: "SHR": desc += result[i].ShrinksPerPallet+"<br/>";
          break;
        }
        document.getElementById('txtHint'+userNumber).innerHTML = desc;
        document.getElementById('whse'+userNumber).innerHTML=result[i].grouping+"<br\>";
        document.getElementById('su'+userNumber).innerHTML=result[i].SellingUnits+"<br/>";
        i++;
      } 
      xmlhttp.open("GET","getdata1.php?q="+str,true); 
      xmlhttp.send(); 
     }
</script>
</head>
<body topmargin=0>
<form name="orderform" id="orderform" action="newsale.php" method="post">
<table border=1>
<tr>
<td>Product Code</td>
<td>Description</td>
<td>Warehouse</td>
<td>Selling Units</td>
</tr>
<tr id="r1">  
<td width=100>
    <input size=10  type="number" id="sku1" name="sku1" onchange="showUser(1, this.value)">
</td>
<td width=280>
    <div align="left" id="txtHint1" class="redtext">&nbsp;</div>
</td>
<td width=100>
    <div align="left" id="whse1" class="redtext">&nbsp;</div>
</td>
<td width=100>
    <div align="left" id="su1" class="redtext">&nbsp;</div>
</td>
</tr>
<tr id="r2">  
<td>
    <input size=10  type="number" id="sku2" name="sku2" onchange="showUser(2, this.value)">
</td>
<td>
    <div align="left" id="txtHint2" class="redtext">&nbsp;</div>
</td>
<td>
    <div align="left" id="whse2" class ="redtext">&nbsp;</div>
</td>
<td width=100>
    <div align="left" id="su2" class="redtext">&nbsp;</div>
</td>
</tr>
<tr id="r3">  
<td>
    <input size=10  type=number id=sku3 name=sku3 onchange="showUser(3, this.value)">
</td>
<td>
    <div align="left" id="txtHint3" class="redtext">&nbsp;</div>
</td>
<td>
    <div align="left" id="whse3" class="redtext">&nbsp;</div>
</td>
<td width=100>
    <div align="left" id="su3" class="redtext">&nbsp;</div>
</td>
</tr>
<tr id="r4">  
<td>
    <input size=10  type=number id=sku4 name=sku4 onchange="showUser(4, this.value)">
</td>
<td>
    <div align="left" id="txtHint4" class="redtext">&nbsp;</div>
</td>
<td>
    <div align="left" id="whse4" class="redtext">&nbsp;</div>
</td>
<td width=100>
    <div align="left" id="su4" class="redtext">&nbsp;</div>
</td>
</tr>
</table>
</form>
</body>
</html>

我还没有测试过这段代码,但错误应该很容易在浏览器控制台中找到。 php 不允许 $q 超过 5 个字符以防止注入(inject)。

关于php - 使用 javascript 在不同的表单字段中显示 2 个不同的 MySQL 结果,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/9974274/

相关文章:

mysql - 添加外键后 Django 迁移出现 "unknown column"错误

php - Mac M1 无法将 PHP 8.0 映射为 PhpStorm 中的 CLI 解释器

php - 从 cron 运行 php 脚本而不是选择 $_SERVER ['host' ] 从 CLI 运行的 wheras 工作

php - Python 桌面应用程序链接到 PHP Web 应用程序?

javascript - 如何从多页应用程序迁移到 Piral

javascript - JQuery UI 自动完成 AJAX 调用

php - 选择特定的重复数据库值并显示计数

mysql - 通过MYSQL查询减去值

php - 从根目录加载 .htaccess

javascript - 使用javascript函数参数影响不同的变量