动态下拉Jsp答案

【问题标题】：Dynamic drop down Jsp动态下拉Jsp
【发布时间】：2013-02-01 05:49:46
【问题描述】：

我想要一个下拉列表，当我更改第一个下拉列表时它会发生变化。我确定我的 servlet 是正确的，因为它返回了我需要的值，但是我的 servlet 没有运行。当我调试时，它没有命中 servlet 中的断点。

我认为这与我的 javascript 有关。

这里是 JSP 文件：

 <%@ page language="java" contentType="text/html; charset=ISO-8859-1"
pageEncoding="ISO-8859-1"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%> 

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"     
"http://www.w3.org/TR/html4/loose.dtd">

<html>
<head>

<SCRIPT type="text/javascript" src="dropDownOnderdelen.js"></script>
<title>File Uploading Form</title>
</head>
<body>
<h3>File Upload:</h3>
 Select a file to upload: <br />
<form action="/Racing/UploadServlet" method="post"
                    enctype="multipart/form-data">
 <input type="file" name="file"  />
<br />
Logische Naam: <input type="text" name="logicalName"><br>
Stuknr(automatisch,nog niet geimplementeerd): <input type="text" name="partNr"><br>
Kost: <input type="text" name="cost"><br>


Assembly:
<select name = "assembly">
 <c:forEach var ="assembly" items="${Assemblys}">
 <option value="${assembly.id}">${assembly.name}</option>
 </c:forEach>
 </select>
 <select id="onderdeel">
 <option>Kies eerst een assembly</option>
 </select>
 <br>
  <textarea name="comments" cols="25" rows="5">
  Verdediging Design
  </textarea><br>
  <input type="submit" value="Upload File" />
 </form>
 </body>
 </html>

这是 javascript 文件

 $(document).ready(function() {
   $('#assembly').change(function() {
    var selectedValue = $(this).val();
    var servletUrl = 'OnderdelenServlet?value=' + selectedValue;

    $.getJSON(servletUrl, function(options) {
        var dropdown2 = $('#onderdeel');
        $('>option', dropdown2).remove(); // Clean old options first.
        if (options) {
            $.each(opts, function(key, value) {
                dropdown2.append($('<option/>').val(key).text(value));
            });
        } else {
            dropdown2.append($('<option/>').text("Please select dropdown1"));
        }
    });
  });
});

servlet 没问题，我确定，所以不需要放在这里。

【问题讨论】：

标签： javascript json jsp

【解决方案1】：

你用过

$('#assembly').change ===> #代表ID（元素ID）

在你的 javascript 中

在你的 JSP 文件中你有

所以也给你分配“ID”

【讨论】：

谢谢，这确实是一个错误，但它仍然不起作用:(

【解决方案2】：

这是我在相同情况下所做的事情

纪律是我的第一个组合ID；

$("#discipline").change(function() {
         var data = $("#discipline option:selected").text();

                $.ajax({
                      type: 'POST',
                      url: 'registerdcodes?type=discipline&discipline='+data,
                      success:function(data){  
                    fillComboBox(data,$("#codes"));//populating secondcombo
                      }
                    });

     });

还添加了 fillcombo 方法：

如果您需要“请选择您的选项”作为第一项，请通过 isSelectRequired true

而 villlagesString 是一个由 | 分开的 bigString

// 例如：villagesString 应该是这样的 .. villagesString ="option1|option2|option3|option4";

    function fillComboBox(villagesStrings,box,isSelctRequired){
        if(villagesStrings !=null){
            var villagesStrings = villagesStrings.split('|');
            if(isSelctRequired){
            box.append("<option value='null'>Please select your option</option>");
            }
            for (var i = 0, l = villagesStrings.length-1; i <l; i++){
                var id =villagesStrings[i].substring(0,2);
                var qtn =villagesStrings[i].substring(0,villagesStrings[i].length)
                box.append("<option value="+qtn+">"+qtn+"</option>");
        }
        }

        }

【讨论】：

如果你需要我会提供 fillComboBox(data,$("#codes")) 实现..祝你好运