如何在点击第一个下拉列表时启用日期选择器,其他下拉列表和日期选择器将会出现选择?
Javscript
function checkOption(obj) {
var CustomerBranch = document.getElementById("CustomerBranch");
CustomerBranch.disabled = obj.value == "Please select";
var monthyrtxt = document.getElementById("monthyrtxt");
monthyrtxt.disabled = obj.value == "";
<%--var fromdate = document.getElementById("fromdate");
fromdate.datepicker("getDate") == "";--%>
<%--$(".fromdate").datepicker("enabled");--%>
<%-- $("#fromdate:enabled").datepicker(); --%>
var fromdate =document.getElementById("fromdate").disabled='';
<%-- $("#fromdate:enabled").datepicker(); --%>
var todate = document.getElementById("todate");
todate.disabled = obj.value == "";
}
HTML代码
<td>
Business Id :-
</td>
<td> <select name="Business" id="Business" onChange="checkOption(this)">
<option value="" disabled="disabled" selected="selected">-- Please select --</option>
<%for(Business business : Businesslevel) {%>
<option value="<%=business.getBusinessId()%>"><%=business.getBusinessId()%> - <%=business.getBusinessName()%></option>
<%}%>
</select>
</td>
</tr>
<td>
Branch Id :
</td>
<td>
<select name="CustomerBranch" id="CustomerBranch" disabled="disabled">
<option value="" disabled="disabled" selected="selected">-- Please select --</option>
<%for(CustomerBranch custBranch : CustBranch) {%>
<option value="<%=custBranch.getBranchId()%>"><%=custBranch.getBranchName()%></option>
<%}
%>
</select>
</td>
</tr>
<tr>
<td>
From Date :
</td>
<td>
<input type="text" id="fromdate" disabled="disabled">
</td>
</tr>
<tr>
<td>
To Date :
</td>
<td>
<input type="text" id="todate" disabled="disabled">
</td>
</tr>
我已经尝试了很多次,但它仍然没有奏效。真的很感谢你的帮助。enter image description here
答案 0 :(得分:0)
而不是使用纯javascript使用jquery。它的简易库让你开始。只需添加<link rel="stylesheet" href="/resources/demos/style.css">
<head>
中的
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>jQuery UI Datepicker - Default functionality</title>
<link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
<link rel="stylesheet" href="/resources/demos/style.css">
<script>
$(function() {
$( "#fromDate" ).datepicker();
$( "#toDate" ).datepicker();
});
</script>
</head>
<body>
<p>From Date: <input type="text" id="fromDate"></p>
<p>To Date: <input type="text" id="toDate"></p>
</body>
</html>
&#13;