Patwan

Creating a custom validation comparing 2 input fields using JavaScript

Posted 5 months ago by Patwan

I have got 2 date input fields (one for departure date and the next for return date) in my form and want to create a custom JavaScript/Jquery logical validation which compares the values from the 2 input fields and make sure the value of the departure date is the current date the user fills the form or any date in the future while the return date value must be after the departure date.

Am stuck while creating the Js code

~ Kindly assist?

<!-- Departure date-->
        <div class="form-line registar2 love {{ $errors->has('departure_date') ? ' has-error' : '' }}">
                 <input type="date" class="form-input" id="depart" name="departure_date" value="{{ old('departure_date') }}" required>

                 <label>Departure Date *</label>
                <div class="error-label">Field is required!</div>
                <div class="check-label"></div>
                  @if ($errors->has('departure_date'))
                    <span class="help-block">
                      <strong>{{ $errors->first('departure_date') }}</strong>
                    </span>
                  @endif
        </div>
    <!--End departure-->

    <!-- Return date-->
        <div class="form-line registar2 move {{ $errors->has('return_date') ? ' has-error' : '' }}">
                 <input type="date" class="form-input" id="return" name="return_date" value="{{ old('return_date') }}" required>

                 <label>Return Date *</label>
                <div class="error-label">Field is required!</div>
                <div class="check-label"></div>
                  @if ($errors->has('return_date'))
                    <span class="help-block">
                      <strong>{{ $errors->first('return_date') }}</strong>
                    </span>
                  @endif
        </div>
    <!-- End return date-->


Jquery code

     $('.departure_date').on('change', function () {
        $('.return_date').val('');
        var depart_date = $(this).val();
        var departdate = new Date(depart_date);
        var currdate = new Date();
        var diff = (departdate - currdate)
        var days = diff / (1000 * 60 * 60 * 24);
    });

Please sign in or create an account to participate in this conversation.

Reply to

Use Markdown with GitHub-flavored code blocks.