2015-12-03 68 views
0

如何在您点击第一个下拉菜单时启用日期选择器,其他下拉菜单和日期选择器将出现选择?如何启用日期选择器?

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

函数checkOption(obj){var CustomerBranch = document.getElementById(“CustomerBranch”); CustomerBranch.disabled = obj.value ==“请选择”; var monthyrtxt = document.getElementById(“monthyrtxt”); monthyrtxt.disabled = obj.value ==“”; var fromdate = document.getElementById(“fromdate”); fromdate .disabled = obj.value ==“”; var todate = document.getElementById(“todate”); todate.disabled = obj.value ==“”; } – Maihani

+0

当我们已经选择第一个下拉列表时,启用日期选择器的正确功能是什么? – Maihani

回答

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>

+0

谢谢@Zumry穆罕默德为您解答。但我不是那样的页面。当我们打开页面时,我想要它,其他下拉列表,日期选择器或文本框被禁用。当我已经从第一个下拉列表中选择时,日期选择器将会出现......我已经尝试了很多次,但仍然无法工作。 – Maihani

相关问题