$(document).ready(function () {
$("#dt1").datepicker({
dateFormat: "dd-M-yy",
minDate: 0,
onSelect: function (date) {
var dt2 = $('#dt2');
var startDate = $(this).datepicker('getDate');
var minDate = $(this).datepicker('getDate');
dt2.datepicker('setDate', minDate);
startDate.setDate(startDate.getDate() + 30);
//sets dt2 maxDate to the last day of 30 days window
dt2.datepicker('option', 'maxDate', startDate);
dt2.datepicker('option', 'minDate', minDate);
$(this).datepicker('option', 'minDate', minDate);
}
});
$('#dt2').datepicker({
dateFormat: "dd-M-yy"
});
});
Sep 7, 2020
11
Level 2
How to validate that end date is greater than start date
Hi,
I want to validate if the end date is ggreater than start date. I add a script in my page's blade but it doesn't work. What is the problem and also where should I put this script?
Here is my blade:
@extends('layouts.admin')
@section('content')
{{ trans('global.create') }} {{ trans('cruds.excuse.title_singular') }}<div class="card-body">
<form method="POST" action="{{ route("admin.excuses.store") }}" enctype="multipart/form-data">
@csrf
<div class="form-group">
<label for="user_id">{{ trans('cruds.excuse.fields.user') }}</label>
<select class="form-control select2 {{ $errors->has('user') ? 'is-invalid' : '' }}" name="user_id" id="user_id">
@foreach($users as $id => $user)
<option value="{{ $id }}" {{ old('user_id') == $id ? 'selected' : '' }}>{{ $user }}</option>
@endforeach
</select>
@if($errors->has('user'))
<div class="invalid-feedback">
{{ $errors->first('user') }}
</div>
@endif
<span class="help-block">{{ trans('cruds.excuse.fields.user_helper') }}</span>
</div>
<div class="form-group">
<label for="start_date">{{ trans('cruds.excuse.fields.start_date') }}</label>
<input class="form-control date {{ $errors->has('start_date') ? 'is-invalid' : '' }}" type="text" name="start_date" id="start_date" value="{{ old('start_date') }}">
@if($errors->has('start_date'))
<div class="invalid-feedback">
{{ $errors->first('start_date') }}
</div>
@endif
<span class="help-block">{{ trans('cruds.excuse.fields.start_date_helper') }}</span>
</div>
<div class="form-group">
<label for="end_date">{{ trans('cruds.excuse.fields.end_date') }}</label>
<input class="form-control date {{ $errors->has('end_date') ? 'is-invalid' : '' }}" type="text" name="end_date" id="end_date" value="{{ old('end_date') }}">
@if($errors->has('end_date'))
<div class="invalid-feedback">
{{ $errors->first('end_date') }}
</div>
@endif
<span class="help-block">{{ trans('cruds.excuse.fields.end_date_helper') }}</span>
</div>
<div class="form-group">
<button class="btn btn-danger" type="submit">
{{ trans('global.save') }}
</button>
</div>
</form>
</div>
@endsection
And here is my script at the end of my blade:
<script>
$(function(){
$("#start_date").datepicker({
numberOfMonths: 1,
onSelect: function(selected) {
$("#end_date").datepicker("option","minDate", selected)
}
});
$("#end_date").datepicker({
numberOfMonths: 1,
onSelect: function(selected) {
$("#start_date").datepicker("option","maxDate", selected)
}
});
});
Please or to participate in this conversation.