を変更するために、再び火にjqueryの日付ピッカーを必要とする、日付ピッカー火災やカレンダーダイアログがきれいに表示されます。しかし、新しい日付に変更するためにテキストボックスの日付を再度クリックすると、同じ日付ピッカーダイアログがポップアップすることはありません。ページがロードされた後iは空のテキストボックス内をクリックすると、日付
マークアップは次のとおりです。ここで
<div id="panelVacationMode" class="row">
<span class="labelCell" title="Skip reminder emails until I return">
<input id="CheckBox1" type="checkbox" name="ctl00$MainContentPlaceHolder$CheckBox1"
checked="checked"><label for="CheckBox1">Vacation Mode</label></span>
<div id="vacationModeBox" class="vacationRangeCell">
<label for="txtFromDate" id="lblStart">Start:</label>
<input name="ctl00$MainContentPlaceHolder$txtFromDate" type="text"
value="11/1/2016" maxlength="10"
id="txtFromDate" class="dateTextBox" size="8">
<label for="txtToDate" id="lblReturn">Return:</label>
<input name="ctl00$MainContentPlaceHolder$txtToDate" type="text"
value="12/31/2016" maxlength="10"
id="txtToDate" class="dateTextBox" size="8">
<br>
</div>
<br>
<br>
</div>
を.aspxページの一番下にあるコードです:
<script>
$(function() {
// check if checkbox is unchecked
if ($("#CheckBox1").is(':checked'))
$('#vacationModeBox').show();
else
$('#vacationModeBox').hide();
// check if any checkbox has changed state
$("input[type='checkbox']").click(function() {
$('#txtFromDate').focus();
$("input[type='checkbox']").on('change', function() {
if ($(this).not(":checked")) {
$('.dateTextBox').val("");
$('#vacationModeBox').toggle(this.checked);
}
else
$('#txtFromDate').focus();
});
$(function() {
var date = new Date();
var currentMonth = date.getMonth();
var currentDate = date.getDate();
var currentYear = date.getFullYear();
$("#txtFromDate").datepicker({
numberOfMonths: 2,
minDate: new Date(currentYear, currentMonth, currentDate),
onSelect: function (selected) {
$("#txtToDate").datepicker("option", "minDate", selected)
}
});
$('#txtToDate').focus();
$("#txtToDate").datepicker({
numberOfMonths: 2,
onSelect: function (selected) {
$("#txtFromDate").datepicker("option", "maxDate", selected)
}
});
});
});
});
</script>
の更新は14 10月-2016を追加しました:
おそらく私は以下のこれらの参考文献にいくつかの変更を加える必要がありますdatepicker私のために働く元の投稿に記載されていますか? :明確にするために努力
<html>
<head runat="server">
<title></title>
<link type="text/css" rel="stylesheet" href="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.4/themes/smoothness/jquery-ui.css" />
<link type="text/css" rel="stylesheet" href="//cdn.jsdelivr.net/qtip2/2.2.0/jquery.qtip.min.css" />
<link type="text/css" rel="stylesheet" href="~/IEStyles.css" />
<link type="text/css" rel="stylesheet" href="~/StyleSheet1.css" />
<link type="text/css" rel="stylesheet" href="~/css/app.css" />
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.4/jquery-ui.min.js"></script>
<script type="text/javascript" src="//cdn.jsdelivr.net/qtip2/2.2.0/jquery.qtip.min.js"></script>
<script type="text/javascript" src="<%= ResolveClientUrl("~/js/sitewide.js") %>"></script>
<asp:ContentPlaceHolder ID="ExtraStyles" runat="server" />
</head>
:私はすでに格納されている日付なしでテキストボックスをクリックしたときには、日付ピッカーのUIを選択するための公開カレンダーとうまく「ポップアップします」。しかし、すでに日付がついているテキストボックスをクリックして新しい日付を選択すると、何も起こりません。 mm/dd/yyyy値をクリアしてからdatepickerをクリックしようとしても、何も起こりません。ここで私は日付ピッカーと対話することはできませんどこのサンプルです:
更新10月15日:(最新のフレームワークを使用した後も変化) 次の画面のスニペットは、新しいリソースの使用を示してはまだありません日付ピッカーがために同じ動作をしますOPのように私:私はあなたの全体のソースコードを更新
...それが動作するようですが、あなたはしないでください'$(function(){'ブロックをネストする必要があります。 1つのセットを含むだけで十分です。 –