Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    primarykey
    data
    text
    <p>Here is how to disabled date as per selection of start or end dates:</p> <p>If a date is selected in start datebox, then end date will be limited to selection of days after start date (inclusive of start date) and vise-verse for end date too.</p> <pre><code>$(document).on('pageinit', '#index', function(){ $('#end-date').bind('datebox', function(e, p) { if ( p.method === 'open') { // Make it a date var startDate = new Date($('#start-date').val()); var todaysDate = new Date(); // Length of 1 Day var lengthOfDay = 24 * 60 * 60 * 1000; // Get the difference var diff = parseInt((((startDate.getTime() - todaysDate.getTime()) / lengthOfDay)+1)*-1,10); // Set minDays to disallow anything earlier $('#end-date').datebox({'minDays': diff}); } }); $('#start-date').bind('datebox', function(e, p) { if ( p.method === 'open') { // Make it a date var endDate = new Date($('#end-date').val()); var todaysDate = new Date(); // Length of 1 Day var lengthOfDay = 1000 * 60 * 60 * 24; // Get the difference var diff = parseInt((((endDate.getTime() - todaysDate.getTime()) / lengthOfDay)+1),10); // Set minDays to disallow anything earlier $('#start-date').datebox({'maxDays': diff}); } }); }); </code></pre> <p>check the updated fiddle link: <a href="http://jsfiddle.net/QTuma/6/" rel="nofollow">http://jsfiddle.net/QTuma/6/</a></p> <p>OR as per below solution a simpler method to set min and max:</p> <pre><code>$(document).on('pageinit', '#index', function(){ $('#start-date').bind('datebox', function(e, p) { if ( p.method === 'set') { var endDate = $('#start-date').val().replace(/(\d{1,2})\/(\d{1,2})\/(\d{4})$/,'$3-$1-$2'); $('#end-date').attr({'min':endDate,'max':'2999-01-01'}); $('#end-date').datebox('applyMinMax'); } }); $('#end-date').bind('datebox', function(e, p) { if ( p.method === 'set') { var endDate = $('#end-date').val().replace(/(\d{1,2})\/(\d{1,2})\/(\d{4})$/,'$3-$1-$2'); $('#start-date').attr({'min':'1000-01-01','max':endDate}); $('#start-date').datebox('applyMinMax'); } }); }); </code></pre>
    singulars
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. VO
      singulars
      1. This table or related slice is empty.
    2. VO
      singulars
      1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload