JSFiddle - React, Tailwind, and code Playground

by draj8126

HTML

<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
    <link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet" integrity="sha384-wvfXpqpZZVQGK6TAh5PVlGOfQNHSoD2xbE+QkPxCAFlNEevoEH3Sl0sibVcOQVnN" crossorigin="anonymous">
    <script src="https://cdn.jsdelivr.net/npm/gijgo@1.9.10/js/gijgo.min.js" type="text/javascript"></script>
    <link href="https://cdn.jsdelivr.net/npm/gijgo@1.9.10/css/gijgo.min.css" rel="stylesheet" type="text/css" />



<form action="">
    <div class="container">
       <h4>Start Date:</h4>
			<input  type="text" id="startdate" name="fromdate" width="276"
				placeholder="dd/mm/yyyy" required onchange="checkDate()" />
			<h4>End Date:</h4>
			<input  type="text" id="enddate" name="todate" width="276"
				placeholder="dd/mm/yyyy" required onchange="checkDate()"/>
    </div>
    <input type="submit" value="submit">
    </form>

JavaScript

var today = new Date(new Date().getFullYear(), new Date().getMonth(),
    		new Date().getDate());
    $('#startdate').datepicker({
    	uiLibrary : 'bootstrap4',
    	iconsLibrary : 'fontawesome',
    	format : 'dd/mm/yyyy',

    	maxDate : function() {
    		return $('#enddate').val();

    	}
    });
    $('#enddate').datepicker({
    	uiLibrary : 'bootstrap4',
    	iconsLibrary : 'fontawesome',
    	format : 'dd/mm/yyyy',

    	minDate : function() {
    		return $('#startdate').val();
    	}
    
    
    
    });

        //function to check wether date is more than 20 its not workin
        //all plugins are there u just have to run 
        
        function checkDate(){
            var start = $('#startdate').val();
            var end = $('#enddate').val();
            //convert strings to date for comparing
            var startDate = new Date(start);
            var endDate = new Date(end);
            // Calculate the day diffrence
            var oneDay = 24 * 60 * 60 * 1000; // hours*minutes*seconds*milliseconds
            var diffDays = Math.abs((endDate.getTime() - startDate.getTime()) / (oneDay));  
            if(diffDays > 15){
                 alert("Days are more then twenty");
                
            }
        }