日期范围下拉JQuery UI日期选择器

Question

我想有一个下拉菜单快速选择日期范围。例如，“上个星期”，“上个月”，“过去三个月”。那种东西。在挑选其中的一个时，它将使用from和from选择日期填充2个文本框。已经尝试了JUI datepicker的一些东西，但谷歌后，它似乎不是这样做。

任何帮助将不胜感激。

谢谢。

Answer 1

我做了类似的事情，但用单选按钮。希望它能帮助：

function reset_last_checkboxes() { 
     $("#export_last_month").attr("checked", false); 
     $("#export_3_last_months").attr("checked", false); 
     $("#export_last_year").attr("checked", false); 
    } 
    var date_format = "DD, d MM, yy"; 
    $("#id_from_date").attr("readonly", "readonly"); 
    $("#id_till_date").attr("readonly", "readonly"); 
    $("#id_from_date").datepicker(); 
    $("#id_till_date").datepicker(); 
    $("#id_from_date").change(function() { 
     $("#id_from_date").datepicker("option", "dateFormat", date_format); 
    }); 
    $("#id_till_date").change(function() { 
     $("#id_till_date").datepicker("option", "dateFormat", date_format); 
    }); 
    $("#id_from_date").click(function() { 
     reset_last_checkboxes(); 
    }); 
    $("#id_till_date").click(function() { 
     reset_last_checkboxes(); 
    }); 
    $("#id_till_date").val(format_date(new Date(now))); 
    $("#export_last_month").click(function(){ 
     var dt = new Date(now); 
     $("#id_till_date").val(format_date(dt)); 
     $("#id_from_date").val(format_date(prevMonth(dt))); 
    }); 
    $("#export_3_last_months").click(function(){ 
     var dt = new Date(now); 
     $("#id_till_date").val(format_date(dt)); 
     $("#id_from_date").val(format_date(prevMonth(prevMonth(prevMonth(dt))))); 
    }); 
    $("#export_last_year").click(function(){ 
     var dt = new Date(now); 
     $("#id_till_date").val(format_date(dt)); 
     for (var i=0;i<12;i++) { 
      dt = prevMonth(dt); 
     } 
     $("#id_from_date").val(format_date(dt)); 
    }); 

您可以随时用下拉菜单取代我的单选按钮和编写代码的比我好:)

顺便说一句，我prevMonth计算是这样的：

function prevMonth(dt){ 
    var thisMonth = dt.getMonth(); 
    dt.setMonth(thisMonth-1); 
    if(dt.getMonth() != thisMonth-1 && (dt.getMonth() != 11 || (thisMonth == 11 && dt.getDate() == 1))) 
     dt.setDate(0); 
    return dt; 
}