Reputation: 1647
The above input text or label doesn't seem to show the jQuery UI datepicker when click on either of it. I tried different combinations of solutions found here in SO and online. Not sure why none are working.
Html code:
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.17/jquery-ui.min.js"></script>
<script src="http://code.jquery.com/jquery-1.10.2.js"></script>
<script src="http://code.jquery.com/ui/1.11.0/jquery-ui.js"></script>
<label class="tmDtpicker">
<input id="dtinput" class="hasDatepicker" type="text" name="Start" placeholder='10/05/2014' data-constraints="@NotEmpty @Required @Date" />
</label>
CSS code:
.tmDtpicker #dtinput {
position: relative;
cursor: pointer;
width: 130px;
margin-bottom: -2px;
}
.tmDtpicker:after {
content:'\f073';
position: absolute;
z-index: 4;
cursor: text;
}
js code:
</body>
//other scripts
<script>
$(document).ready(
function () {
$("#dtinput").datepicker({ showWeek: true, firstDay :1,
showOtherMonths: true,
selectOtherMonths: true,
minDate: '0d', dateFormat: "dd-mm-yy"
});
}
);
</script>
Upvotes: 0
Views: 1316
Reputation: 8488
You have included 2 jquery-ui
.
...
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.17/jquery-ui.min.js"></script>
<script src="http://code.jquery.com/jquery-1.10.2.js"></script>
<script src="http://code.jquery.com/ui/1.11.0/jquery-ui.js"></script>
...
Remove the first one.
...
<script src="http://code.jquery.com/jquery-1.10.2.js"></script>
<script src="http://code.jquery.com/ui/1.11.0/jquery-ui.js"></script>
...
For a side note, always include jQuery
first then other libraries like jqueryUI
Update
Remove class="hasDatepicker"
from the input
.
Upvotes: 1