Вот что я должен был сделать.
Я получаю datetime из javascript, а затем передаю его ASP.NET для хранения в базе данных Oracle. Вот мой код C # для Восточного и Центрального времени.
string datetimevalue = hidfileDateTime.Value;
datetimevalue= datetimevalue.Replace("EDT", "EST");
datetimevalue = datetimevalue.Replace("CDT", "CST");
if (datetimevalue.Contains("CST"))
{
filedt = DateTime.ParseExact(datetimevalue, "ddd MMM d HH:mm:ss CST yyyy", provider).ToUniversalTime().AddHours(1).ToLocalTime();
}
else
{
filedt = DateTime.ParseExact(datetimevalue, "ddd MMM d HH:mm:ss EST yyyy", provider);
}
Если я понимаю требование, решение должно быть изменено autoUpdateInput: false
и обрабатывать как 'apply.daterangepicker'
, так и 'cancel.daterangepicker'
. Я сообщаю только о фрагменте кода, измененном ниже
$.each($('.date'), function(key, value) {
$(value).daterangepicker({
drops: "up",
showDropdowns: true,
singleDatePicker: true,
autoUpdateInput: false
});
$(value).on('apply.daterangepicker', function(ev, picker) {
$(this).val(picker.startDate.format('MM/DD/YYYY'));
});
$(value).on('cancel.daterangepicker', function(ev, picker) {
$(this).val('');
});
[118 ] Также, я думаю, вам следует изменить порядок включения js следующим образом:
<!-- daterangepicker -->
<!-- FR: https://github.com/dangrossman/daterangepicker/issues/320 switched js loading order -->
<script src="https://cdn.jsdelivr.net/momentjs/latest/moment.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/daterangepicker/daterangepicker.js"></script>
<link href="https://cdn.jsdelivr.net/npm/daterangepicker/daterangepicker.css" rel="stylesheet"/>
Хотя передача обратного вызова в конструктор является самым простым способом прослушивания изменений в выбранном диапазоне дат, вы также можете делать что-то каждый раз, когда нажимаете кнопку «Применить», даже если выбор не изменился
[115 ]
function checkDateInput() {
var input = document.createElement('input');
input.setAttribute('type','date');
var notADateValue = 'not-a-date';
input.setAttribute('value', notADateValue);
return false;
return (input.value !== notADateValue);
}
// Check if the browser supports the <input type="date" />
if (checkDateInput()) {
// Change the types on the inputs that are dates
$('.date').prop('type', 'date');
} else {
// Iterate through each <input class="date" ... />
$.each($('.date'), function(key, value) {
$(value).daterangepicker({
drops: "auto",
showDropdowns: true,
singleDatePicker: true,
autoUpdateInput: false,
}).on('hide.daterangepicker', function(ev, picker) {
//do something, like clearing an input
// $(this).val(''); if you want to clear un comment this
}).on('apply.daterangepicker', function(ev, picker) {
$(this).val(picker.startDate.format('YYYY-MM-DD'));
});
});
}
<!-- jquery -->
<script src="https://cdn.jsdelivr.net/jquery/latest/jquery.min.js"></script>
<!-- bootstrap -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.6/umd/popper.min.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/js/bootstrap.min.js"></script>
<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/css/bootstrap.min.css" rel="stylesheet"/>
<!-- daterangepicker -->
<link href="https://cdn.jsdelivr.net/npm/daterangepicker/daterangepicker.css" rel="stylesheet"/>
<script src="https://cdn.jsdelivr.net/momentjs/latest/moment.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/daterangepicker/daterangepicker.min.js"></script>
<div class="container">
<form>
<fieldset>
<legend>Dates</legend>
<div class="form-group">
<label for="date_written">Date Written</label>
<input class="form-control date" id="date_written" name="date_written" required="required" />
</div>
<div class="form-group">
<label for="effective_date">Effective Date</label>
<input class="form-control date" id="effective_date" name="effective_date" required="required" />
</div>
<div class="form-group">
<label for="cancellation_date">Cancellation Date</label>
<input class="form-control date" id="cancellation_date" name="cancellation_date" />
</div>
</fieldset>
<button type="submit" class="btn btn-success">Submit</button>
</form>
</div>