How to make the value of one variable of one javascript function available in any other function?

Question

I want the value of someDate to be available to my datepicker's minDate. At present I have kept it as new Date() for it to work, but in place of this I need someDate value. someDate logic is there in myFunction(). How can I achieve this?

Declaring a global variable someDate didn't work. It passed only the value for today's date. Changes made in myFunction() to someDate need to be incorporated in the Datepicker function.

Below is my code.

 function myFunction() { var check = document.getElementById('check'); var time = new Date().getHours(); var currentday=new Date().getDate(); alert(currentday); var someDate = new Date(); var day=0; if(!check.checked && time>10) { alert(time); alert(check.checked); day=6-currentday-1; var someDate = new Date(); if(day>=3) { alert(day); someDate.setDate(someDate.getDate() + 3); alert(someDate); } else { alert(someDate); someDate.setDate(someDate.getDate() + 5); alert('yayy!!'); } } else if(check.checked && time<10) { alert('Time <10 and checked'); } else if(!check.checked && time <10) { alert('Time <10 and UNchecked'); } else { alert(time); alert(check.checked); day=6-currentday-1; if(day>1) { alert(day); someDate.setDate(someDate.getDate() + 1); alert(someDate); } else { alert(day); someDate.setDate(someDate.getDate() + 3); alert(someDate); } } } $(function() { alert(window.someDate); $( "#datepicker-5" ).datepicker({ beforeShowDay : function (date) { var dayOfWeek = date.getDay (); // 0 : Sunday, 1 : Monday, ... if (dayOfWeek == 0 || dayOfWeek == 6) return [false]; else return [true]; }, minDate: someDate }); }); 

 <link href="http://code.jquery.com/ui/1.10.4/themes/ui-lightness/jquery-ui.css" rel="stylesheet"> <script src="http://code.jquery.com/jquery-1.10.2.js"></script> <script src="http://code.jquery.com/ui/1.10.4/jquery-ui.js"></script> <p id="demo"></p> <p>Enter Date: <input type="text" id="datepicker-5" ></p> <input type="checkbox" id="check" onclick="myFunction()" > 

Answer 1

The global namespace isn't required to solve this. You could put myFunction inside your document ready handler like this:

$(function(){
  var someDate;
  function myFunction(){ ... }

  //add the change handler to the checkbox
  $("#check").change(function(){
    myFunction();
  });
}

Note: this adds the checkbox change handler with jquery instead of in the dom so your input tag can just be:

<input type="checkbox" id="check" >

Answer 2

Even when you set someDate in the global scope the Datepicker doesn't know to use the new value. Datepicker does have a refresh method but in order to avoid using the global scope it would be much better to...

Use the Datepicker option setter like this:

function myFunction() {
    var someDate;

    // [Do the logic to decide value of someDate] 
    someDate = '+3d';     // three days from today, for example

    // Set the minDate option on the datePicker:
    $('#datepicker-5').datepicker('option', 'minDate', someDate);
}

Also note:

• You should remove minDate: someDate from your main datePicker initialisation.
• You might want to check the jQueryUI documentation for valid values for minDate .