Question

我有一个注册表单，我希望当用户从第一个选择项目时，我想要动态创建第二个选择，其中包含数据库中与第一个选择兼容的项目。例如，我有2个选择列表第一个带有课程，第二个带有教授。当我从第一个选择选择课程时，第二个选择列表必须只有本课程的教授。我正在使用jsp，java和我想避免ajax这可能吗？谢谢！

Answer 1

是的，这是可能的。

但是，如果没有AJAX，则必须使用页面加载所有数据。这意味着将与每节课相关的教授列表存储在Javascript数组或隐藏的HTML元素中，以后可以从中检索数据。

Answer 2

您可以使用以下解决方案之一来避免使用ajax：

在显示表单时加载所有课程的所有教授，并将它们存储在某种JavaScript结构中。当课程选择发生变化时，从这个JavaScript结构中获取相关的教授。这可能意味着一次加载太多数据，但
当课程选择发生变化时，提交表单并使用填充的教授选择框重新显示。

这两个解决方案都需要JavaScript，但我真的看不到你通过不使用AJAX获得了什么。您可以使用第二个解决方案完全避免使用JavaSCript，但是用户必须单击提交按钮才能加载第二个表单。

Answer 3

是的，有可能，

使用教授和课程列表创建两个选择框并默认隐藏它们。所以在你的第一个选择框上附加事件“onchange”，当选择教授与教授一起显示列表时，当选择课程时显示带有课程的列表并隐藏教授。 e.g。

<select id="cbOne" onchange="show(this);">
<option value="0">Select</option>
<option value="1">Professors</option>
<option value="2">Lessons</option>
</select>

<select id="cbLessons" style="display: none;">
... your list
</select>
<select id="cbProfessors" style="display: none;">
... your list
</select>

这是JavaScript show

的方法

<script language="javascript">

    function show(el)
    {
      var professors = document.getElementById('cbProfessors');
      var lesssons = document.getElementById('cbLessons');
       if(el.value == "0")
       {
         professors.style.display = 'none';
         lessons.style.display = 'none';
    }
       else if(el.value == "1")
       {
         professors.style.display = '';
         lessons.style.display = 'none';
       }
       else if(el.value == "2")
       {
         professors.style.display = 'none';
         lessons.style.display = '';
       }
    }

</script>

我希望这会对你有所帮助。

Javascript和动态表单创建

3 个答案: