2013-04-05 115 views
0

根據第一個下拉列表項選擇,我希望第二個下拉列表應包含相關內容。我如何在java中做到這一點? 例如, 假設第一個下拉列表包含國家名稱,第二個下拉列表包含州的名稱。如果我選擇一個特定的國家,說「印度」,從第一個下拉列表中選擇名字,那麼第二個列表應該只顯示國家的相關國家,即「印度」國家。 這兩個列表都是動態的。根據第一個下拉列表選擇,第二個下拉列表應包含相關內容

+0

你是在談論擺動組件或HTML? – 2013-04-05 09:10:53

+0

Struts2中有''標籤。 – 2013-04-05 09:11:42

+0

@ Sudhanshu,我必須在JSP頁面上顯示。 – Sagar 2013-04-05 09:20:37

回答

0

這比Java更Javascript和支柱2.

有兩個選項,你可以得到關於該項目的第一個下拉的價值觀爲重點,另一個下拉列表的值的地圖。

然後,當第一個組合框的值被選中時,您可以從javascript映射中獲取值並將其設置爲第二個下拉列表。

其他選項是在第一個下拉列表中選擇一個ajax請求,並從結果中剔除第二個下拉列表。

0

我會建議使用javascript此:

  • 或者與阿賈克斯,通過使返回選項的支柱作用,並重裝select的內容,例如使用jQuery:

    $("#stateSelect").load('http://host/myStateAction.do?country=' + country);

  • 或在頁面加載時加載整個國家/地區的映射,並在沒有服務器調用的情況下用純javascript更新第二個列表。要做到這一點,你可以例如在每個國家option存儲一個data-states屬性,包含相應的狀態。

<option value="code" data-states="state1,state2,state3">countryName</option>

否則,如果你想避免的JavaScript,你可以提交你的表單時改變事件被觸發,並在服務器端(Struts動作)你填寫基於價值的第二個列表的第一個,並重定向到表單頁面。 <select onchange="documents.forms['myForm'].submit()">

0

你必須使用JavaScript象下面這樣:
這是更好地從Java端處理,而不是:

這是您的樣本HTML文件:

<select id="country" name="country" aria-required="true" class="required"> 
    <option value="">Select Your Country</option> 
    <option value="USA">India</option> 
    <option value="CA">Pakisthan</option> 
</select> 
<p><label for="state">Select Your State<span title="required">*</span> 
</label></p> 
<select id="state" name="state" aria-required="true" class="required"> 
    <option value="" selected="">Select Your State</option> 
    <optgroup label="India"> 
     <option value="WB">West Bengal</option> 
     <option value="BH">Bihar</option>   
    </optgroup> 
    <optgroup label="Pakisthan"> 
     <option value="LH">Lahore</option> 
     <option value="IB">Islamabad</option> 
    </optgroup> 
</select> 

這裏是你的JavaScript示例:

var stateVar = $('#state option, #state optgroup'); 
stateVar.hide(); 
$('#country').change(function() { 
    stateVar.hide(); 
    $("#state optgroup[label='" + $(this).find(':selected').html() + "']") 
     .children() 
     .andSelf() 
     .show(); 
}); 

你也可以使用AJAX,它對你來說可能有點複雜,所以最好使用簡單的JavaScript。
您可以嘗試這種方法,並在發生任何問題時通知我。

相關問題