src:
<script src="Scripts/jquery.min.js"></script>
<script src="Scripts/bootstrap.js"></script>
<script src="Scripts/bootstrap-datepicker.min.js"></script>
<script type="text/javascript">
script:
$(function () {
$("#datetimepicker1").datepicker({ dateFormat: "yy-mm-dd" });
$("#datetimepicker1").on("change", function () {
var selected = $(this).val();
$("<%=txtDate.ClientID %>").val(selected)
});
});
</script>
designer:
<div class="form-group">
<label for="txtDate" class="control-label col-sm-2 col-md-2 col-lg-2"> preferred date </label>
<div class="col-sm-4 col-md-4 col-lg-4 col-xs-10">
<asp:TextBox ID="txtDate" runat="server" CssClass="form-control datepick"></asp:TextBox>
</div>
<div class="col-sm-2 col-md-2 col-lg-2 col-xs-2">
<button type="button" id="datetimepicker1" class="common-button2"><span aria-hidden="true" class="glyphicon glyphicon-calendar"></span></button>
</div>
</div>
Okay so, problem is, the calendar pops up, but the textbox won't get the selected date, all scripts are included and there were no errors. Please help thanks!
EDIT: Used the <%=txtDate.ClientID %> because my page has a master page.
$("<%=txtDate.ClientID %>").val(selected)
is not a valid jquery selector
You want
$("#txtDate").val(selected)
If your not using any Master page then Simply write
$("#txtDate").val(selected);
otherwise
$("#<%=txtDate.ClientID %>").val(selected);
' # ' is important because it is indicates that this is an id.
You are making your datepicker
too tough to use.
Here is the simple solution
<p>
Date:
<input type="text" id="datepicker"></p>
JS:-
<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">
See the Working demo
UPDATE
$(function () {
$("#Id generated by inspecting element from browser").datepicker();
});
jquery datepicker returns the selected value on onSelect event instead of onChange. try this
<script>
$(function () {
$("#datetimepicker1").datepicker({ dateFormat: "yy-mm-dd" }, onSelect: function(dateText) {
$("<%=txtDate.ClientID %>").val(dateText)
});
});
</script>
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.