使用 PHP 和 Javascript 的下拉 onchange 方法

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/13886391/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-26 20:02:51  来源:igfitidea点击:

Dropdown onchange method using PHP and Javascript

javascriptphpdrop-down-menudom-eventsonchange

提问by saghar

I have two dropdown menus that read their data from a MySQL database. I use PHP for connecting to database. The second dropdowns should get populated based on the selection on the first dropdown. The process seems as below to me (correct me if I'm wrong):

我有两个从 MySQL 数据库读取数据的下拉菜单。我使用 PHP 连接到数据库。第二个下拉列表应根据第一个下拉列表中的选择进行填充。这个过程在我看来如下(如果我错了,请纠正我):

  1. PHP section connects to MySQL database and populates dropdown1.
  2. user selects a value on dropdown1 and onchange event is called.
  3. within the onchange function (which is Javascript), a query is sent to MySQL database to fetch values of dropdown2 based on the dropdown1 selection (here is PHP again, right?).
  4. dropdown2 gets populated.
  1. PHP 部分连接到 MySQL 数据库并填充 dropdown1。
  2. 用户在 dropdown1 上选择一个值并调用 onchange 事件。
  3. 在 onchange 函数(它是 Javascript)中,一个查询被发送到 MySQL 数据库,以根据 dropdown1 选择获取 dropdown2 的值(这里又是 PHP,对吧?)。
  4. dropdown2 被填充。

I don't know how to use Javascript and PHP together in order to do this task (number 3 above); or maybe this is not the way to do it at all. Please advise!

我不知道如何同时使用 Javascript 和 PHP 来完成这项任务(上面的第 3 项);或者这根本不是这样做的方法。请指教!

Here is my code. As you see below, I'm putting a Javascript function within a PHP code which I suppose is wrong. That's where I got stuck!

这是我的代码。正如您在下面看到的,我在 PHP 代码中放置了一个 Javascript 函数,我认为这是错误的。这就是我被卡住的地方!

<php
$sql="SELECT distinct category FROM table1";
$result=mysql_query($sql);

$optionsCat="";
while($row = mysql_fetch_row($result)){
    $optionsCat.="<option value=\"$row[0]\">$row[0]</option>";
}

function genSubCat($catID){
$sql="SELECT distinct subcategory FROM table1 where category=".$catID;
$result=mysql_query($sql);

$optionsSubCat="";
while($row = mysql_fetch_row($result)){
    $optionsSubCat.="<option value=\"$row[0]\">$row[0]</option>";
}
}

?>
<select name="catDropDown" onChange="genSubCat(this)">
    <option value="0">Select category</option>
    <?php echo $optionsCat?>
</select>
<select name="subcategoryDropDown">
    <option value="0">Select subcategory</option>
    <?php echo $optionsSubCat?>
</select>

回答by ROY Finley

Here we have a simple page with input on it. Type a word into it and then click off of the input. Ajax will call the myphp.php script and return the same word you typed in below the original division.

在这里,我们有一个带有输入的简单页面。在其中输入一个单词,然后单击关闭输入。Ajax 将调用 myphp.php 脚本并返回您在原始分区下方输入的相同单词。

test.html:

test.html

<!DOCTYPE html>
<html lang="en">
<head>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript"> 
$(document).ready(function() {
$("#faq_search_input").blur(function(){
   var faq_search_input = $(this).val();
   var dataString = 'keyword='+ faq_search_input;
   if(faq_search_input.length>1){
      $.ajax({type: "GET", url: "myphp.php", data: dataString,
              success: function(server_response) {
                 document.getElementById("searchresultdata").style.display = "block";
                 $('#searchresultdata').html(server_response).show();
              }
          });
       }
       return false;
   });
});

</script>
  </head>
  <body>
<div class="searchholder">
    <input  name="query" class="quicksearch" type="text" id="faq_search_input" />
<div id="searchresultdata" class="searchresults" style="display:none;"> </div>
</div>
  </body>
</html>

myphp.php:

myphp.php

 <?PHP
    echo $_GET['keyword'];
 ?>

回答by MahanGM

I think you should first study yourself about using web based languages. The code that you've provided is completely wrong. You're trying to access PHP code through HTML? I mean come on!

我认为您应该首先学习使用基于网络的语言。您提供的代码是完全错误的。您正在尝试通过 HTML 访问 PHP 代码?我是说来吧!

First rule: Server based languages can't communicate with Client based languages.

第一条规则:基于服务器的语言不能与基于客户端的语言通信。

You have to send requests and get responses and the way you want to do that dropdown thing is to send a request to a PHP code and get relevant data from it. As Trufa said in the comment, you may want to look at jQuerylibrary, but before that I think you need to check AJAX.

您必须发送请求并获得响应,并且您想要执行下拉操作的方式是向 PHP 代码发送请求并从中获取相关数据。正如 Trufa 在评论中所说,您可能想查看jQuery库,但在此之前我认为您需要检查AJAX