通过外部按钮浏览jQuery日期选择器之间的星期几

我正在使用asp.net mvc。我试图在网页中显示日期选择器，以及两个按钮，即上一个和下一个用于在datepicker中的几周之间进行导航的按钮。我能显示日期选择器，并能够基于用户选择的日期总星期日期，就像通过外部按钮浏览jQuery日期选择器之间的星期几

$('#txtSrchFrom').datepicker({ 
     showOtherMonths: true, 
     selectOtherMonths: true, 
     onSelect: function (dateText, inst) { 
      var date = $(this).datepicker('getDate'); 
      startDate = new Date(date.getFullYear(), date.getMonth(), date.getDate() - date.getDay()); 
      endDate = new Date(date.getFullYear(), date.getMonth(), date.getDate() - date.getDay() + 6); 
      var dateFormat = inst.settings.dateFormat || $.datepicker._defaults.dateFormat; 
      $('#startDate').text($.datepicker.formatDate(dateFormat, startDate, inst.settings)); 
      $('#endDate').text($.datepicker.formatDate(dateFormat, endDate, inst.settings)); 
      if (startDate.getMonth() == endDate.getMonth()) { 
       $('#txtSrchFrom').val(getMonthName(startDate.getMonth()) + " " + startDate.getDate() + " - " + endDate.getDate() + ", " + startDate.getFullYear()); 
      } 
      else { 
       $('#txtSrchFrom').val(getMonthName(startDate.getMonth()) + " " + startDate.getDate() + " - " + getMonthName(endDate.getMonth()) + " " + endDate.getDate() + ", " + startDate.getFullYear()); 
      } 
      selectCurrentWeek(); 
     }, 
     beforeShowDay: function (date) { 
      var cssClass = ''; 
      if (date >= startDate && date <= endDate) 
       cssClass = 'ui-datepicker-current-day'; 
      return [true, cssClass]; 
     }, 
     onChangeMonthYear: function (year, month, inst) { 
      selectCurrentWeek(); 
     } 
    }); 

    $('#txtSrchFrom .ui-datepicker-calendar tr').live('mousemove', function() { $(this).find('td a').addClass('ui-state-hover'); }); 
    $('#txtSrchFrom .ui-datepicker-calendar tr').live('mouseleave', function() { $(this).find('td a').removeClass('ui-state-hover'); });

，这里是我的标记，

<input type="button" class="btn btn-info" value="<< Prev" /> 
<div class="input-group" style="width: 220px;"> 
    <input type="text" class="form-control" id="txtSrchFrom" name="txtSrchFrom" readonly="readonly" placeholder="Search by From Date" /> 
    <span class="input-group-addon"><i class="icon-calendar"></i></span> 
</div> 
<input type="button" class="btn btn-info" value="Next >>" onclick="return gotoNextweek();"/> 
<br /> 
<label>Week :</label> <span id="startDate"></span> - <span id="endDate"></span>

假设我目前在第1周，当我点击下一个按钮，我需要切换到下周，并需要选择该周的所有日期。和以前的按钮需要以类似的方式工作。我试图通过设置endDate + 7天到datepicker像，

但它不适用于我。请指导我，如何做到这一点。

来源

2014-01-06 Karthik Bammidi

如果你只是想〜7天添加到当前选定的日期用途：

var new_date = $("#datepicker").datepicker("getDate"); 
new_date = new_date.setDate(new_date.getDate()+7); 
new_date = new Date(new_date);  
$("#datepicker").datepicker("setDate", new_date);

来源

2014-01-06 15:22:02 cretzzzu3000

日期从$picker.datepicker('getDate')回来已经是一个约会对象，你不能把它传递给new Date()一次

$('#next, #prev').on('click', function(e) { 
    var date = $('#datepicker').datepicker('getDate'); 
    e.target.id == 'next' ? date.setDate(date.getDate()+7) : date.setDate(date.getDate()-7); 
    $('#datepicker').datepicker('setDate', date); 
});

FIDDLE

来源

2014-01-06 15:24:29 adeneo

通过外部按钮浏览jQuery日期选择器之间的星期几

回答

相关问题