Develop Reference

How to set max date in a kendodatepicker every time another date is chosed

i have two kendodatepickers "startDate" and "endDate". I want every time the user set a date in startdate, establish the max date one month forward from the selected date to pick in endDate datepicker.
I am setting up the first time in this way:
$("#datStartDate").kendoDatePicker({
start: "month",
depth: "year",
format: "dd/MM/yyyy",
dateInput: true,
change: (e) => {
return moc.rangeStartDate("datStartDate", "datEndDate");
},
min: new Date(1900, 0, 1),
max: new Date(),
value: new Date()
});
$("#datEndDate").kendoDatePicker({
start: "month",
depth: "year",
format: "dd/MM/yyyy",
dateInput: true,
max: new Date(),
change: (e) => {
return moc.rangeEndDate("datStartDate", "datEndDate");
},
value: new Date()
});
I tried this to set the max value, each time the startDate picker is cheanged:
$("#datStartDate").change(() => {
let startDate = ($("#datStartDate").val()).split("/");
console.log("cambio de fecha", parseInt(startDate[2]), parseInt(startDate[1]), parseInt(startDate[0]))
let datePicker = $("#datEndDate").data("kendoDatePicker");
datePicker.max(new Date(parseInt(startDate[2]), parseInt(startDate[1]), parseInt(startDate[0])));
datePicker.value(new Date(parseInt(startDate[2]), parseInt(startDate[1]), parseInt(startDate[0])))
})
It doesnt works and i dont get an error. How can i do this? Thank you so much for you time.
I am using this:
KendoUI
JavaScript
ASP .NET MVC
RAZOR
jquery

you can use it in Jquery
function startChange() {
var endPicker = $("#dtpStartDate").data("kendoDatePicker"),
startDate = this.value();
if (startDate) {
startDate = new Date(startDate);
startDate.setDate(startDate.getDate());
endPicker.max(startDate + 30);
}
}
function endChange() {
var startPicker = $("#dtpEndDate").data("kendoDatePicker"),
endDate = this.value();
if (endDate) {
endDate = new Date(endDate);
endDate.setDate(endDate.getDate());
startPicker.max(endDate - 30);
}
}
and in razor files you can create datepickers like this
<div class="form-group">
<label class="col-md-4 control-label">#Html.LabelFor(m => m.StartDate)</label>
<div class="col-md-8">
#(Html.Kendo().DatePickerFor(m => m.StartDate)
.HtmlAttributes(new { #Id = "dtpStartDate", style = "width:100%", required = "required", validationMessage = "Select Start Date" })
.Events(e => e.Change("startChange")))
</div>
</div>
<div class="form-group">
<label class="col-md-4 control-label">#Html.LabelFor(m => m.EndDate)</label>
<div class="col-md-8">
#(Html.Kendo().DatePickerFor(m => m.EndDate)
.HtmlAttributes(new { #Id = "dtpEndDate", style = "width:100%", required = "required", validationMessage = "Select End Date" })
.Events(e=>e.Change("endChange")))
</div>
</div>

Can't pass value from input field daterangepicker - Zeppelin Angular

I have 2 input form fields that use daterangepicker to get single timestamps, I want to pass these to another paragraph after a button is clicked.
This is what the script looks like in para 1,
<label class = "name">From Date : </label>
<input type="text" id="fromDate" class = "dates" placeholder = "Select timestamp" ng-model="fromTs"></input>
<label class = "name">To Date : </label>
<input type="text" id="toDate" class = "dates" placeholder = "Select timestamp" ng-model="toTs"></input>
<script>
$(function() {
var start = moment();
var end = moment();
$('#fromDate').daterangepicker({
timePicker: true,
startDate: start,
singleDatePicker: true,
showDropdowns: true,
timePickerSeconds: true,
timePicker24Hour: true,
locale: {
format: 'DD-MM-YYYY HH:mm:ss'
}
});
$('#toDate').daterangepicker({
endDate: end,
timePicker: true,
singleDatePicker: true,
showDropdowns: true,
timePickerSeconds: true,
timePicker24Hour: true,
locale: {
format: 'DD-MM-YYYY HH:mm:ss'
}
});
});
</script>
<button type="submit" class="btnbtn-primary" ng-click="z.angularBind( 'fromTs', fromDate, 'paragraph_1590566438633_806469898'); z.angularBind('toTs', toTs, 'paragraph_1590566438633_806469898'); z.runParagraph( 'paragraph_1590566438633_806469898');">Apply</button>
And this is in para2,
%md
### Date range is ${fromTs} to ${toTS}
I get Nullpointer exception when I run this, checked in the console that there is no object being passed in case of fromTs and toTs.
Initially I was using bootstrap-datepicker but later moved to daterangepicker as it had the option of selection of time as well, using the ng-model value to pass the input field value worked there, but it doesn't seem to be working with daterangepicker.
Why is this happening and how do I go about this error?

Symfony display datepicker when i use jquery

Hi everyone i need your help.
I put dates in Jquery in my form with the id:
twig :
{{ form_label(Form.date, 'Date') }}
{{ form_widget(Form.date, {'id': 'datejquery', 'attr': {'class' :'form-control'}}) }}
formType :
$builder->add('date', DateType::class, ['label' => 'Date', 'widget' => 'single_text', 'html5' => false, 'format' => 'dd/MM/yyyy']);
The code works with 'format' => 'dd/MM/yyyy'
But the display of the datepicker no longer works when I click on the form fields.
I just have the date that appears in the input but I don't have the calendar display...
When : {'class' :'js-datepicker'}})
display empty calendar

datetimepicker error submitting form

I'm trying to use a jquery datetimepicker.
And I have some trouble when I submit the form:
This value is not valid. : Unable to reverse value for property path "debut": Date parsing failed: U_PARSE_ERROR
Here is my form:
public function buildForm(FormBuilderInterface $builder, array $options)
{
$builder
->add('debut', 'datetime', array(
'widget' => 'single_text',
'label' => 'Debut',
'html5' => false,
'format' => 'dd/MM/yyyy H:m'
))
//...
And the javascript is:
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-datetimepicker/2.5.4/build/jquery.datetimepicker.full.min.js"></script>
<script>
$(document).ready(function () {
$( '#mybundle_evenement_debut' ).datetimepicker({
startDate: new Date(),
format: 'd/m/y H:i',
autoclose: true,
});
});
</script>
How would you fix this?

Daterangepicker date defaults to zero in CakePHP

I'm developing a small app with CakePHP and I need to save a startdate and an enddate for an event. I went with the Bootstrap Daterangepicker to let users visually input the dates.
In my add.ctp view I have two fields:
<div class="form-group">
<?php echo $this->Form->input('start', array(
'class' => 'form-control',
'type' => 'text',
'id' => 'start',
'name' => 'start',
'data-mask')); ?>
</div><!-- .form-group -->
<div class="form-group">
<?php echo $this->Form->input('end', array(
'class' => 'form-control',
'type' => 'text',
'id' => 'end',
'name' => 'end',
'data-mask')); ?>
</div>
And the Javascript that controls the inputs:
<script type="text/javascript">
$(function() {
$('input[name="start"]').daterangepicker({
timePicker24Hour: true,
singleDatePicker: true,
timePicker: false,
timePickerIncrement: 30,
locale: {
format: 'YYYY-MM-DD HH:mm:ss'
}
});
$('input[name="end"]').daterangepicker({
timePicker24Hour: true,
singleDatePicker: true,
timePicker: false,
timePickerIncrement: 30,
locale: {
format: 'YYYY-MM-DD HH:mm:ss'
}
});
});
</script>
The picker works just fine, it updates the field values properly, but when I attempt to save the form, the start field gets written to the database as follows:
start 0000-00-00 00:00:00
end (null)
The form data for the start and end fields saves properly if I'm reverting to the default configuration of the fields.
Any clue as to where I'm failing would be highly appreciated.

try something like this
$correctdate = date("Y-m-d j:h:m",strtotime($yourdate));
It's not a great peace of code, but it should help to go further in the right direction.
We take this string and make a timestamp out of it. Then we change it to a proper datetime value.

Okay, so I was passing text to a datetime field and the save operation failed. In order to fix this I had to convert the strings to the proper type by processing it in the beforeSave() function of the model.
Here is the code that worked for me:
public function beforeSave($options = array()) {
if (!empty($this->data['Task']['start']) && !empty($this->data['Task']['end'])) {
$this->data['Task']['start'] = $this->dateFormatBeforeSave($this->data['Task']['start']);
$this->data['Task']['end'] = $this->dateFormatBeforeSave($this->data['Task']['end']);
}
return true;
}
public function dateFormatBeforeSave($dateString) {
return date('Y-m-d h:m:s', strtotime($dateString));
}