Question

I have two webmethods returning dates from a .net 3.5 page.
Each return a start and end date string, respectively.
I try calling them and then outputting their results after they both complete as an alert as a simple test, yet I cannot do this successfully.
When I step through my code, the alert is displayed before the global vars are filled. Once the alert is displayed, the vars are filled.
What am I doing wrong?

<script type="javascript">
var startDate, endDate;

$(document).ready(function(){
   $.when(GetStartDate(), GetEndDate()).then(Output());
});

function GetStartDate(){
   return $.ajax({
   type="POST",
   url="myurl/page.aspx/GetStartDate",
   data = {},
   contentType="json",
   success: function(data){ startDate = data.d.toString();},
   failure:failureAlertMsg
  });
}

function GetEndDate(){
   return $.ajax({
   type="POST",
   url="myurl/page.aspx/GetEndDate",
   data = {},
   contentType="json",
   success: function(data){ endDate = data.d.toString();},
   failure:failureAlertMsg
  });
}

function Output(){
    alert('StartDate: ' + startDate + '\nEndDate: ' + endDate');
}
</script>

Answer 1

I figured it out thanks to this article: http://jsfiddle.net/ehynds/Mrqf8/

What I did is edit this:

$(document).ready(function(){    
  $.when(GetStartDate(), GetEndDate()).then(Output()); 
});

to this:

$(document).ready(function(){    
  $.when(GetStartDate(), GetEndDate())
    .then(function(){
      Output();
    })
    //additional option, not required
    .fail(function(){
      alert:'Failed!');
  })
});