0

我正在使用 daterangepicker.js，在更改日期时，当我更改需要调用 getchart() 的日期时，我必须调用 getchart 方法，任何人都可以帮助我，这是我的代码：

$(document).ready(function() {
        $('#dateRangeSelector').daterangepicker(); //textbox id
        var start = Date.today().setTimeToNow(); 
        var end =  Date.today().setTimeToNow();
        var displayValue = start.toString("yyyy/MM/dd") + " - " + end.toString("yyyy/MM/dd");
        $('#dateRangeSelector').val(displayValue);

        var host = '<?=$host ?>'
        var dateRangeSelector = $("#dateRangeSelector").val();
        var dates = dateRangeSelector.split(" - ");
        var value = "'"+dates.join("' , '")+"'";
        var array = value.split(',');
        var startTime = array[0];
        var endTime = array[1];

       $.get(SITE_URL + 'admin/SystemMonitor/charts/getChartsData', {'host' : host,'startTime' : startTime,'endTime' : endTime}, function(response){
            console.log("viewCharts", response);
            obj = response;
            //bootbox.alert(obj.status, obj.label);
            if (obj.status == 'OK') {
                $('.one_half').show();
                showMonitoringServer(host, obj);

            } else {
               show_message('Show Chart Error -' +host, 'Unexpected error occured! Please try again later!', 'error' );
            }
        }, "json");
        });
4

4 回答 4

0

你试过这个onChange活动吗？

$('#dateRangeSelector').daterangepicker({ 
    onChange: function(){                  
        //do ajax stuff
    }
);

onChange被调用两次似乎是一个已知问题。如果您的版本中没有修复它，您可以随时使用：

$('#dateRangeSelector').on('blur', function(){
    //do ajax stuff
});

我现在为 onChange 添加了一个回调函数，您可以使用它。请记住，它可能无法完全满足您的需求，因为它会在输入中发生的每一次更改时触发。一键范围快捷方式实际上会触发 2 个更改回调，因为此插件仅触发每个日期选择器上的日期更改，一次一个。一旦这个插件被 jQuery UI 采用，我相信我们会解决这个问题，并将 rangepicker 触发事件作为一个小部件。现在，您需要在设置页面时考虑到这个问题。

于 2013-09-19T09:09:29.407 回答
0

试试这个。

$(document).ready(function() {
        $('#dateRangeSelector').change(function(){
       $.get(SITE_URL + 'admin/SystemMonitor/charts/getChartsData', {'host' : host,'startTime' : startTime,'endTime' : endTime}, function(response){
            console.log("viewCharts", response);
            obj = response;
            //bootbox.alert(obj.status, obj.label);
            if (obj.status == 'OK') {
                $('.one_half').show();
                showMonitoringServer(host, obj);

            } else {
               show_message('Show Chart Error -' +host, 'Unexpected error occured! Please try again later!', 'error' );
            }
        }, "json");

 });
        });
于 2013-09-19T09:11:39.730 回答
0

您可以使用

$( "#dateRangeSelector" ).change(function() {
    alert( "Handler for .change() called." );
});

您还可以查看 Jquery API：http ://api.jquery.com/change/

于 2013-09-19T09:14:20.180 回答
0

从文档本身显示：

按照此文档链接

$('#dp5').datepicker().on('changeDate', function(ev){
    if (ev.date.valueOf() < startDate.valueOf()){
         ....
    }
});

所以你需要这样做：

$('#dateRangeSelector').datepicker().on('changeDate', function(ev){
    $.get(SITE_URL + 'admin/SystemMonitor/charts/getChartsData', {'host' : host,'startTime' : startTime,'endTime' : endTime}, function(response){
        console.log("viewCharts", response);
        obj = response;
        //bootbox.alert(obj.status, obj.label);
        if (obj.status == 'OK') {
            $('.one_half').show();
            showMonitoringServer(host, obj);

        } else {
           show_message('Show Chart Error -' +host, 'Unexpected error occured! Please try again later!', 'error' );
        }
    }, "json");
});
于 2013-09-19T09:19:30.953 回答