如何使用日期范围选择器一起使用Ajax

我使用日期范围选择器JavaScript库从用户如何使用日期范围选择器一起使用Ajax

    $('#date_range').daterangepicker({ 
        arrows:true, 
        dateFormat: 'd-M-yy', 
        rangeSplitter: 'to', 
        datepickerOptions: { 
         changeMonth: true, 
         changeYear: true, 
         minDate: new Date("01/01/2011") //Account created date 
        }, 
        closeOnSelect: true, 
        onChange: function(){ 
            //ajax call goes here 

            } 
        });

在我的Ajax调用我更新了日期范围的屏幕中，选择日期的范围。但是这个更改函数运行两次，并且ajax返回旧的日期值。如果需要在日期范围选择器的更改功能上使用ajax功能。

如果有任何人找到正确使用onchange函数的解决方案，请亲密接触我。由于提前

来源

2011-03-15 Mohan Ram

读documentation你找到

的onChange：功能，回调执行每当日期输入变化（可在范围内发生两次选择）。

我已经安装了一个小演示http://jsfiddle.net/ByzYX/16/

所以的onChange似乎是您的解决方案错误的回调。我不确定你想要在屏幕上更新什么，以及为什么要做Ajax请求，但是你可以尝试一个if条件来执行你的ajax调用一次。

所以onOpen设置一个标志为true，执行ajax调用后将它设置为false。在onChange检查此标志。

来源

2011-03-28 07:25:39

我就是这么做的：

$('#date_range').daterangepicker({ 
    "startDate": "01/01/2016", 
    "endDate": "07/27/2016" 
    }, function(start, end, label) { 
     $.ajax({ 
      url:"/your_url", 
      method: "GET", // or POST 
      dataType: "json", 
      data: {from: start.format('YYYY-MM-DD'), to: end.format('YYYY-MM-DD')}, 
      success:function(result) { 
       console.log("sent back -> do whatever you want now"); 
      } 
     }); 
    });

此函数类似于$("#date_range").change(function(){});，但它有一些参数了。

您可能希望将日期字符串更改为您接收它的有效日期，以防您想要进行一些过滤。

我在http://www.daterangepicker.com/上找到了关于这个功能的信息，看看更多的例子！ :)

来源

2016-07-27 13:56:17

如何使用日期范围选择器一起使用Ajax

回答

相关问题