2017-03-31 81 views
1

我有JSP頁面和下拉列表以編程方式填充。 現在,在某些情況下是下拉應該被禁用,但用戶應該仍然能夠看到它的所有元素,但實際上並不能選擇它,是這樣的:https://jsfiddle.net/nenadbulatovic/6g4pmmpv/1/下拉列表顯示所有元素,但禁用選擇

<select> 
    <option value="Select...">Select...</option> 
    <option disabled value="volvo">Volvo</option> 
    <option disabled value="saab">Saab</option> 
    <option disabled value="mercedes">Mercedes</option> 
    <option disabled value="audi">Audi</option> 
</select> 

顯然是有狀態我不能只是禁用下一個選項。

這是代碼(下拉式)的實際部分,我需要它。

<div class="row-fluid"> 
    <div class="span3"> 
     <label><%=Constants.REQUIRED%>&nbsp;<c:out value="${requestScope.RESOURCES_MAP.SITE_PARENT}"/>:</label> 
     <select class="selectpicker" data-width="100px" id="siteParentNameSelect" style="width:250px;margin-bottom:0px;"> 
      <option value=''>${requestScope.RESOURCES_MAP[SELECT]}</option> 
      <c:forEach var="siteParentName" items="${siteParentNameList}"> 
      <option value="${(pageContext.request, siteParentName.id)}" ${siteParentName.id == '0' ? 'selected = "selected" ' : ''}> ${siteParentName.name}</option> 
      </c:forEach> 
     </select> 
    </div> 
    </div> 

我應該檢查是否像「enabledFlag」一些條件,然後如果這是真的/假的啓用/禁用其選擇的元素。

編輯:我只能使用JSP/JSTL,JavaScript的,JQuery的

回答

1

您應該使用角ng-disabled指令:

<select> 
    <option value="Select...">Select...</option> 
    <option ng-disabled=flag value="volvo">Volvo</option> 
    <option ng-disabled=flag value="saab">Saab</option> 
    <option ng-disabled=flag value="mercedes">Mercedes</option> 
    <option ng-disabled=flag value="audi">Audi</option> 
</select> 

欲瞭解更多信息:https://www.w3schools.com/angular/ng_ng-disabled.asp

編輯:

不幸的是,我對JSTL不太熟悉,但是你不能做這樣的事嗎?

<option value="mercedes" <c:if test="${flag}"><c:out value="disabled='disabled'"/></c:if>"> 
+0

謝謝,但不能使用AngularJS,我們使用jQuery –

+1

@NenadBulatovic我編輯了我的答案。 –

+0

謝謝,您的JSTL解決方案正常工作。 –

相關問題