当通过AJAX加载时,jQuery datepicker返回“inst is null”错误

时间:2010-03-03 21:53:08

标签: jquery jquery-ui-datepicker

我正在通过AJAX调用将内容加载到动态添加到DOM的表行中。我在回调函数中调用了datepicker功能,日历显示正常。但是,当我点击日期时,我收到一个错误:inst为null。这是我的代码:

$(document).ready(function() {
    $(".edit").live("click", function() {
        //Delete previously loaded edit row
        $("#tempEditRow").remove();

        //Get the record id of the row to be edited
        var recordID = $(this).parent("td").parent("tr").attr("id");

        //Add the new row to the document
        $(this).parent("td").parent("tr").after("<tr id=\"tempEditRow\"><td id=\"tempEditCell\" colspan=\"100\"></td></tr>")

        //Get a reference to the new row
        var container = $("#tempEditCell");

        //Populate the container
        populateContainer("/wpm/includes/ajax_editApplication.cfm?id=" + recordID, container);
    });
});

function populateContainer(ajaxUrl, container) {
    //Populate the container
    $.ajax({
        url: ajaxUrl,
        cache: false,
        success: function(html){
            $(container).html(html);
            $('.datepicker').datepicker();
        }
    }); 
}

我尝试删除hasDatepicker类,删除对datepicker的任何引用等,但没有任何工作。在此先感谢您的帮助!

2 个答案:

答案 0 :(得分:5)

我有同样的错误,这是因为我有两个具有相同id的两个datepickers输入字段,一个在运行时设置,另一个通过ajax。 给他们一个独特的身份,这一切都有效

答案 1 :(得分:0)

尝试调用datepicker('destroy')作为消除前一行的一部分(在remove()调用之前执行此操作)。

$("#tempEditRow .datepicker").datepicker('destroy');
$("#tempEditRow").remove();