troubleshooting Question

jQuery/javascript/bootstrap - Working with datepicker, combining two scripts, StartDate/EndDate

Avatar of Member_2_1242703
Member_2_1242703 asked on
JavaScriptWeb Development.NET ProgrammingjQuery
4 Comments1 Solution209 ViewsLast Modified:
I have two sets of code, both which work on their own, but I'm really struggling to combine the two.
What I'm trying to do is control start date / end date entries into respective textboxes with datepicker.
When the start date is selected, the date picker disables dates before that selected date when the other text box is clicked.
Also, only days up until the next Sunday (from the selected start date) can be selected as an end date.

So this code works to disable any previous dates for the endDate textbox.

  var dateFormat = "mm/dd/yy";
  var from = $(".start").datepicker({
    changeMonth: true,
    numberOfMonths: 1

  }).on("change", function () {
    to.datepicker("option", "minDate", getDate(this));
  });

  var to = $(".end").datepicker({
    changeMonth: true,
    numberOfMonths: 1
  }).on("change", function() {
    from.datepicker("option", "maxDate", getDate(this));
  });

  function getDate(element) {
    var date;
    try {
      date = $.datepicker.parseDate(dateFormat, element.value);
    } catch (error) {
      date = null;
    }

    return date;
  }

And this code works to only allow dates selected until the next Sunday:

<script>
var dateFormat = "mm/dd/yy";
$(document).ready(function(){
  var from = $("#StartDate").datepicker({
    changeMonth: true,
    dateFormat: dateFormat,
    numberOfMonths: 1,
    onSelect: function(dt, inst){
      var fromDt = $(this).datepicker("getDate");
      var nextSunday = new Date(fromDt.getTime());
      nextSunday.setDate(nextSunday.getDate() + 7 - fromDt.getDay());
());

      to.datepicker("option", "minDate", dt);
      to.datepicker("option", "maxDate", nextSunday);
    }
  });

  var to = $("#EndDate").datepicker({
    changeMonth: true,
    dateFormat: dateFormat,
    numberOfMonths: 1,
    onSelect: function(dt, inst){
      from.datepicker("option", "maxDate", dt);
    }
  });
});
</script>

I need to combine the two, or have a better way to do it. I just can't seem to get them to play together.
ASKER CERTIFIED SOLUTION
Member_2_1242703

Our community of experts have been thoroughly vetted for their expertise and industry experience.

Join our community to see this answer!
Unlock 1 Answer and 4 Comments.
Start Free Trial
Learn from the best

Network and collaborate with thousands of CTOs, CISOs, and IT Pros rooting for you and your success.

Andrew Hancock - VMware vExpert
See if this solution works for you by signing up for a 7 day free trial.
Unlock 1 Answer and 4 Comments.
Try for 7 days

”The time we save is the biggest benefit of E-E to our team. What could take multiple guys 2 hours or more each to find is accessed in around 15 minutes on Experts Exchange.

-Mike Kapnisakis, Warner Bros