【问题标题】:Datepicker not working after AJAX reload [closed]AJAX重新加载后日期选择器不工作[关闭]
【发布时间】:2012-12-17 14:59:05
【问题描述】:

我在一个 div 中有一个非常复杂的日期选择器,它在提交后使用 AJAX 重新加载,但在提交(以及页面的 AJAX 重新加载)之后,日期选择器不再工作。

日期选择器代码:

        dates[x] = $( "#from_"+x+", #to_"+x ).datepicker({ 
        dateFormat: "dd-mm-yy",
        numberOfMonths: 3,
        showWeek: true,
        maxDate: max_date_ini,
        minDate: min_date_ini, 
        beforeShow:function legen_array() {
            var from_of_to = this.id.indexOf("from_") != -1 ? "from" : "to";
            //eerst een check of er niet nog een datepicker periode half gevuld is (want dan is overlap mogelijk)
            if (periode_half_gevuld != x && periode_half_gevuld != 0){
                alert('Er is nog een periode niet geheel ingevuld, er is alleen een vanaf of alleen een tot datum ingevuld. Maak deze periode eerst compleet of maak hem leeg door op verwijderen te klikken');
                return false;           
            }
            var date_from_open = $("#from_"+x).val();
            var date_to_open = $("#to_"+x).val();
            var timestamp_from_open = Date.UTC(date_from_open.substring(6,10),date_from_open.substring(3,5)-1,date_from_open.substring(0,2))/1000;
            var timestamp_from_open_teller = Date.UTC(date_from_open.substring(6,10),date_from_open.substring(3,5)-1,date_from_open.substring(0,2))/1000;
            var timestamp_to_open = Date.UTC(date_to_open.substring(6,10),date_to_open.substring(3,5)-1,date_to_open.substring(0,2))/1000;
            //als from en to gevuld zijn dan eerst deze waardes uit array halen (Anders kan 1 dag verder of terug niet gekozen worden)
            if (timestamp_from_open > 0 && timestamp_to_open > 0){
                geselecteerde_vanaf_datums.splice( $.inArray(timestamp_from_open,geselecteerde_vanaf_datums), 1 );
                geselecteerde_tot_datums.splice( $.inArray(timestamp_to_open,geselecteerde_tot_datums), 1 );
                while (timestamp_from_open_teller <= (timestamp_to_open+1)){
                    datums_niet_beschikbaar.splice( $.inArray(timestamp_from_open_teller,datums_niet_beschikbaar), 1 );
                    timestamp_from_open_teller = timestamp_from_open_teller + 86400;                    
                }
                if (this.id.indexOf("from_") == 0 && $("#to_"+x).val() != '' && geselecteerde_tot_datums.length >= 1){
                    var min_datum = new Date (getNextMinVal(geselecteerde_tot_datums, timestamp_to_open)*1000);
                    $('#from_'+x).datepicker('option', {minDate: min_datum,maxDate: $("#to_"+x).val()});
                }
                else if (this.id.indexOf("from_") == 0 && $("#to_"+x).val() != '' && geselecteerde_tot_datums.length == 0){
                    $('#from_'+x).datepicker('option', {minDate: new Date(volgend_jaar, 1 - 1,1),maxDate: $("#to_"+x).val()});
                }
                else if (this.id.indexOf("from_") == -1 && $("#from_"+x).val() != '' && geselecteerde_vanaf_datums.length >= 1){
                    var max_datum = new Date (getNextMaxVal(geselecteerde_vanaf_datums, timestamp_from_open)*1000);
                    $('#'+this.id).datepicker('option', {minDate:$("#from_"+x).val(),maxDate: max_datum});
                }
                else if (this.id.indexOf("from_") == -1 && $("#from_"+x).val() != '' && geselecteerde_vanaf_datums.length == 0){
                    $('#to_'+x).datepicker('option', {minDate: $("#from_"+x).val(),maxDate: new Date(volgend_jaar, 12,0)});
                }
                else {alert('10');}
            }
            else if(timestamp_from_open > 0 && timestamp_to_open < 0 && from_of_to == 'to' && geselecteerde_vanaf_datums.length >= 1){
                var closest_max = getNextMaxVal(geselecteerde_vanaf_datums, timestamp_from_open);
                $("#"+this.id).datepicker('option', {maxDate: new Date(closest_max*1000)});
                $("#"+this.id).datepicker('option', {minDate: new Date(timestamp_from_open*1000)});
            }
            else if(timestamp_from_open < 0 && timestamp_to_open > 0 && from_of_to == 'from'){
                var closest_min = getNextMinVal(geselecteerde_tot_datums, timestamp_to_open);
                $("#"+this.id).datepicker('option', {minDate: new Date(closest_min*1000)});
                $("#"+this.id).datepicker('option', {maxDate: new Date(timestamp_to_open*1000)});
            }
        },
        beforeShowDay: unavailable,
        onSelect: function(selectedDate) {
                var option = this.id.indexOf("from_") != -1 ? "minDate" : "maxDate"; 
                dates[x].not(this).datepicker("option", option, selectedDate); 
        },
        onClose: function (geselecteerdedatums) {
            var from_of_to = this.id.indexOf("from_") != -1 ? "from" : "to"; 
            var date_from = $("#from_"+x).val();
            var date_to = $("#to_"+x).val();
            var timestamp_from = Date.UTC(date_from.substring(6,10),date_from.substring(3,5)-1,date_from.substring(0,2))/1000;
            var timestamp_to = Date.UTC(date_to.substring(6,10),date_to.substring(3,5)-1,date_to.substring(0,2))/1000;
            var aantal_dagen = (timestamp_to - timestamp_from)/86400;
            if (timestamp_from > 0 && timestamp_to > 0){
                    geselecteerde_vanaf_datums.push(timestamp_from);
                    geselecteerde_vanaf_datums.sort();
                    geselecteerde_tot_datums.push(timestamp_to);
                    geselecteerde_tot_datums.sort();
                    geselecteerde_tot_datums.reverse();
                while (timestamp_from <= timestamp_to){
                    datums_niet_beschikbaar.push(timestamp_from);
                    timestamp_from = timestamp_from + 86400;
                }
                periode_half_gevuld = 0;
                $("#half_gevulde_datepicker").val(0);
                $("#datums_bezet").val(datums_niet_beschikbaar);
                $("#datums_vanaf").val(geselecteerde_vanaf_datums);
                $("#datums_tot").val(geselecteerde_tot_datums);
            }
            else if (this.value != ''){
                periode_half_gevuld = x;
                $("#half_gevulde_datepicker").val(x);
            }
        }
    }); 
}); 

【问题讨论】:

  • AJAX 重新加载是如何完成的?我们是在谈论 .NET 更新面板吗?我过去也遇到过问题,因为它丢失了页面和 javascript 文件的上下文。我也同意算法,您可能需要重新初始化日期选择器。

标签: jquery datepicker


【解决方案1】:

我认为您必须在 AJAX 重新加载后再次初始化日期选择器。

jQuery('.datepicker').datepicker({...});

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2019-09-28
    • 2021-05-16
    • 2018-07-27
    • 1970-01-01
    • 2023-03-06
    • 2016-03-24
    • 2014-04-26
    相关资源
    最近更新 更多