本文介紹了JSP中的級聯下拉列表的處理方法，對大家解決問題具有一定的參考價值，需要的朋友們下面隨著小編來一起學習吧！
問題描述
我是JSP新手，我曾嘗試為我的問題找到解決方案，但不幸的是，我無法找到解決方案。
所以我要做的是有2個下拉列表，當我從第一個列表中選擇一個值時，必須過濾第二個下拉列表。
這是我到目前為止所做的：
Servlet將以下對象傳遞給jsp：
getServletContext().setAttribute("foodDetails", fds.findAll());
request.getRequestDispatcher(url).forward(request, response);
在jsp代碼中，我創建了兩個下拉列表，并使用以下代碼填充列表：
<tr>
<td>Detay Tipi 1</td>
<td>
<select name="tip" id="tip" onchange="">
<option value="porsiyon">porsiyon</option>
<option value="extra">extra</option>
</select>
</td>
<td>
<select name="tip2" id="tip2" onchange="">
<option value"Lütfen Tip Se?iniz">Lütfen Tip Se?iniz</option>
</select>
</td>
</tr>
因此，當用戶從第一個下拉列表中選擇”porsiyon”時，第二個列表將填充來自${foodDetails}的值。為此，我使用以下代碼覆蓋了first Drop的onchange方法：
<script type="text/javascript">
$(document).ready(function(){
$("#tip").change(function(){
tip2.length = 1;
var x=$(this).val();
<c:forEach var="fd" items="${foodDetails}">
<c:if test="${fd.detailcategory == x}">
tip2.options[tip2.options.length] = new Option("${fd.name}","${fd.name}");
</c:if>
</c:forEach>
});
});
</script>
很遺憾，當我切換時這不起作用
var x=$(this).val();
靜電取值如：
<c:set var="x" scope="session" value='ekstra'/>
它的工作方式類似于咒語，其中c定義為：
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>.
我可能犯了一個非常明顯的錯誤，但我想不出是什么錯誤。這是我的第一個jsp頁面，所以對我不要太客氣：)
PS：我認為回答這個問題不需要類，但是foodDetails有一個foodDetail列表，其中foodDetail.Detail類別可以是”porsiyon”或”Ekstra”。
謝謝，
JSTL
問題與您的腳本未觸發onchange事件無關，正如您在嵌入式代碼段中看到的那樣，相反，您正在嘗試在客戶端而不是在服務器端調用推薦答案函數。
您可以嘗試以下操作：
-
創建構建基于JSON響應的JSP。
使用
AJAX調用JSP迭代您的響應以檢索篩選的結果。
假設您有一個foodDetails.jsp，它接收一個名為CATEGORY的過濾參數。使用此參數，您可以從JSP構建基于JSON的響應。
foodDetails.jsp
"{filteredList: "
<c:forEach var="fd" "items="${foodDetails}">
<c:if test="${fd.detailcategory == category}">
"${fd.detailcategory},"
</c:if>
</c:forEach>
"}"
從您的客戶端(Web瀏覽器)
您可以在激發onchange事件時使用foodDetails.jsp使用Ajax調用foodDetails.jsp.
jQuery(document).ready(function(){
jQuery("#tip").change(function() {
var category = jQuery(this).val();
addFilteredItems(category);
});
function addFilteredItems(category) {
jQuery.ajax({
type: "GET",
url: "/path/to/the/foodDetails.jsp?category=" + category,
dataType: "json"
_: jQuery.now()
}).done(function(data) {
jQuery.each(data, function(k, v) {
var result = v["filteredList"];
jQuery.each(result.split(","), function() {
var item = jQuery(this).val();
// add options
});
});
});
}
代碼段
jQuery(document).ready(function(){
jQuery("#tip").change(function(){
var x= $(this).val();
alert(x);
});
});<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<tr>
<td>Detay Tipi 1</td>
<td>
<select name="tip" id="tip" onchange="">
<option value="porsiyon">porsiyon</option>
<option value="extra">extra</option>
</select>
</td>
<td>
<select name="tip2" id="tip2" onchange="">
<option value"Lütfen Tip Se?iniz">Lütfen Tip Se?iniz</option>
</select>
</td>
</tr>這篇關于JSP中的級聯下拉列表的文章就介紹到這了，希望我們推薦的答案對大家有所幫助，
