umair96 / jquery-datepicker

Automatically exported from code.google.com/p/jquery-datepicker
0 stars 0 forks source link

Custom range function dont work after upgrade to version 4.0.2 #236

Closed GoogleCodeExporter closed 8 years ago

GoogleCodeExporter commented 8 years ago
I have  custom range function that works fine with version 3.7.1

I have try to upgrade to the newest version 4.0.2 and now the custom range 
function does not work.

<input type="text" size="18" name="arrivalDate" id="arrivalDate" value="Sun, 
22.08.2010"/>
<input type="text" size="18" name="departureDate" id="departureDate" 
value="Sun, 29.08.2010"/>

<script type="text/javascript">

jQuery('#arrivalDate,#departureDate').datepick({
 onSelect: customRange,
 showOtherMonths: true,
 firstDay: 1,
 monthsToShow: 4, 
 minDate: +1,
 dateFormat: 'D, dd.mm.yy',
 regional: 'en'
});

document.getElementById('arrivalDate').onmouseover = function() 
{ 
 if (this.value == 'Sun, 22.08.2010' && document.getElementById('departureDate').value == 'Sun, 29.08.2010')
 {
  this.value = '';
  document.getElementById('departureDate').value = '';
 }
};

function formatNum(num){
  var mynum = num * 1;
  var retVal = mynum<10?'0':'';
  return (retVal + mynum)
}

// this function sets the departurdate to 7 days more as the arrivalDate
document.getElementById('arrivalDate').onchange = function() 
 { 
  var arrivalDate = document.getElementById('arrivalDate').value;
  if(arrivalDate != '')
   {
    var weekday   = new Array("Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat");
    var d         = new Date(arrivalDate.substr((arrivalDate.length-4),4), (parseInt(arrivalDate.substr((arrivalDate.length-7),2),10)-1), parseInt(arrivalDate.substr((arrivalDate.length-10),2),10));
    d.setDate(d.getDate()+7);
    document.getElementById('departureDate').value = weekday[d.getDay()] +", "+ formatNum(d.getDate()) +"."+ formatNum((d.getMonth()+1)) +"."+ d.getFullYear();
   }
 };

//check if the dates are selected
document.getElementById('bookingForm').onsubmit = function()
 {
  var returnval = false;
  if(document.getElementById('arrivalDate').value == '' || document.getElementById('departureDate').value == '' || document.getElementById('arrivalDate').value == '')
  {
alert('Select arrival day !');document.getElementById('arrivalDate').value = 
''; document.getElementById('departureDate').value = ''; 
this.arrivalDate.focus();return false;}
  return true;
 }

function customRange(input) {
 return {minDate: (input.id == "departureDate" ?
 jQuery("#arrivalDate").datepick("getDate") : +1),
 maxDate: (input.id == "arrivalDate" ?
 jQuery("#departureDate").datepick("getDate") : +1000)};
}

</script>

I dont find any errors in firebug :-(

Can you me suggest how to modify the function in order to use the new version 
of your Script ?

Thank you and sorry for my english 

Original issue reported on code.google.com by egon.pescollderungg@gmail.com on 21 Aug 2010 at 7:49

GoogleCodeExporter commented 8 years ago
I have resolve the problem with the following code, but i think, it is possible 
to get the same result with a more simply way:

<input type="text" size="18" name="arrivalDate" id="arrivalDate"  value="Mon, 
23.08.2010" class="moduli_campi_testo"/>
<input type="text" size="18" name="departureDate" id="departureDate"  
value="Mon, 30.08.2010" class="moduli_campi_testo"/>

<script type="text/javascript">
jQuery('#arrivalDate,#departureDate').datepick({
    onSelect: customRange,
    showOtherMonths: true, firstDay: 1, monthsToShow: 4, 
    minDate: +1,
    dateFormat: 'D, dd.mm.yyyy',
    regional: 'en'
});

jQuery('#arrivalDate').mouseover(function() {
    if (this.value == 'Mon, 23.08.2010' && document.getElementById('departureDate').value == 'Mon, 30.08.2010'){
        this.value = '';
        jQuery('#departureDate').val('');
    }
});

function formatNum(num){
    var mynum = num * 1;
    var retVal = mynum<10?'0':'';
    return (retVal + mynum)
}

// this function sets the departurdate to 7 days more as the arrivalDate
function customRange(dates) { 
    if (this.id == 'arrivalDate') { 
        $('#departureDate').datepick('option', 'minDate', dates[0] || null);
        var weekday   = new Array("Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat");

        var arrivalDate = document.getElementById('arrivalDate').value;
        var d = $.datepick.parseDate('dd.mm.yyyy', arrivalDate.substr((arrivalDate.length-10),2)+'.'+arrivalDate.substr((arrivalDate.length-7),2)+'.'+arrivalDate.substr((arrivalDate.length-4),4));
        d.setDate(d.getDate() + 7); // Add ?? days
        document.getElementById('departureDate').value = weekday[d.getDay()] +", "+ formatNum(d.getDate()) +"."+ formatNum((d.getMonth()+1)) +"."+ d.getFullYear();
    } 
    else { 
        $('#arrivalDate').datepick('option', 'maxDate', dates[0] || null); 
    } 
}

//check if the dates are selected
document.getElementById('bookingForm').onsubmit = function(){
    var returnval = false;
    if(document.getElementById('arrivalDate').value == '' || document.getElementById('departureDate').value == '' || document.getElementById('arrivalDate').value == ''){
        alert('Select arrival day !');document.getElementById('arrivalDate').value = ''; document.getElementById('departureDate').value = '';
        this.arrivalDate.focus();
        return false;
    }
    return true;
}
</script>

Original comment by egon.pescollderungg@gmail.com on 22 Aug 2010 at 10:28

GoogleCodeExporter commented 8 years ago
http://code.google.com/p/jquery-datepicker/wiki/NotTheUIDatePicker

Original comment by kelvin.l...@gmail.com on 22 Aug 2010 at 2:38