java - 如何根据不同的下拉选择更改下拉值

Question

我在 php 页面中加载了一个 servlet这是我的 php 页面:reviewing.php

if(isset($_GET['x'])){
    $x = $_GET['x'];
}else{
    $x = '';
}

$site = $_SERVER['SERVER_NAME'];

if(isset($_GET['id'])){
    $Id = "id=".$_GET['id'];
}else{
    $Id = "";
}

$handle = fopen("http://".$site.":8080/Apps/reviewing.php?$Id", "r"); 

$contents = '';

while (!feof($handle)) {

 $contents .= fread($handle, 8192);

}

fclose($handle);

echo $contents;

如您所见，我的 php 页面加载了一个 servlet。 Servlet 是该过程发生的地方。它还包括 servlet 中的 JSP 和 html 页面。

当另一个下拉列表的选项更改时，我需要能够更改下拉列表的值。它们都是单独的 mysql 查询，但仅当下拉列表更改时我才需要运行第二个查询。我这样做的原因是我可以将 dropdown1 的值用作 WHERE在 dropdown2 查询中。

我尝试过类似的事情

  function reload(form)
  {

      var ID = form.agent.options[form.agent.options.selectedIndex].value;

      return ID;
  } 

该函数进入<select onchange="reload(this.form);">然后我想使用 ID 来运行下一个查询

<select>
//javascript
if(isset(reload())){
   //JAVA
   run query here WHERE id = ID;

    while(rs.next()){
      outn.print("<option>" + rs.getString("value") + "</option>");
    }
}
</select>

这就是我的设想。另一种选择是在 reload() 函数中使用它

self.location='http://exmaple.com/reviewing.php?x=blah&ID=blah;

但我不想继续重新加载页面。这是低效的。

Answer 1

好吧，你应该像下面这样编写你的程序:

1. 处理 select-element onchange 事件

   • 在 select-element onchange-attribut 中(就像您所做的那样)
   • 与 JS
   • 使用 jQuery

2. 在此处理程序中，您可以获得选定的索引

3. 用它来获取 id
4. 向 php 文件发送 ajax 请求，以从 DB 中获取 id 作为 POST 数据的数据
5. 用db的数据发回RESPONSE(可能你应该使用json)
6. 使用响应来填写您的选择

这是一个小代码示例:

HTML

<select id='select1'>
    <option id='option_1' value='1'>Option 1</option>
    <option id='option_2' value='2'>Option 2</option>
    <option id='option_3' value='3'>Option 3</option>
    <option id='option_4' value='4'>Option 4</option>
</select>

<select id='select2'>

</select>

JS

document.getElementById('select1').onchange = function(){
    var xmlhttp=new XMLHttpRequest();
    var params = "id="+this.value           //you can add more data, use & as delemitter

    xmlhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
    xmlhttp.setRequestHeader("Content-length", params.length);
    xmlhttp.setRequestHeader("Connection", "close");

    xmlhttp.onreadystatechange=function(){
        if (xmlhttp.readyState==4 && xmlhttp.status==200){
            fillSelect(xmlhttp.responseText);
        }
    }

    xmlhttp.open("POST","path/to/php.php",true);
    xmlhttp.send(params);
}

var fillSelect = function(response){
    //Here you can go through all elements from response 
    //and build new options and append them to Select2
}

PHP

if (!isset($_POST('id')) die("Submission failed!");

$id = $_POST('id');

$mysqli = new mysqli(HOST, USER, PW, DB);   //assuming you have these static variables, change it for your settings

//use $id now to create the query
$query = "[...]";

$result = $mysqli->query($query);

echo json_encode($result);

JSFIDDLE for parts of the code

我希望 php 没有错误。我无法测试它。如果有问题，那么只需检查拼写是否正确等等......