JQuery: 'Uncaught TypeError: Non lậu' theo yêu cầu ajax - một số phần tử

Tôi có hai phần tử lựa chọn, A và B: khi tùy chọn được chọn của A thay đổi, các tùy chọn của B phải được cập nhật cho phù hợp. Mỗi phần tử trong A bao hàm nhiều phần tử trong B, đó là mối quan hệ một-nhiều (A chứa các quốc gia, B chứa các thành phố nằm trong quốc gia đã cho).

Hàm do_ajaxsẽ chạy yêu cầu không đồng bộ:

function do_ajax(elem, mydata, filename)
{
    $.ajax({
        url: filename,
        context: elem,
        data: mydata,
        datatype: "html",
        success: function (data, textStatus, xhr) {
            elem.innerHTML = data;
        }
    });
}

Để cập nhật các tùy chọn của B, tôi đã thêm một lệnh gọi hàm trong onChangesự kiện của A. Đây là hàm chạy khi sự kiện onChange (of A) được kích hoạt:

function my_onchange(e) // "e" is element "A"
{
    var sel_B = ... ; // get select element "B"

    // I skipped some code here
    // ...

    var data = {
        'mode': 'filter_city',
        'id_A': e[e.selectedIndex]
    };
    do_ajax(city_sel, data, 'ajax_handler.php');
}

}

Tôi đã đọc trong tài liệu JQuery rằng datacó thể là một mảng (cặp giá trị key). Tôi gặp lỗi nếu tôi đặt:

var data = {
        'mode': 'filter_city',
        'id_A': e[e.selectedIndex]
};

Thay vào đó, tôi không gặp lỗi đó nếu dữ liệu của tôi là một chuỗi:

var data = 'mode=filter_city&id_A=' + e[e.selectedIndex];

Nhưng tôi cần "phiên bản mảng" của biến, trong mã php phía máy chủ của tôi.

Tập tin Uncaught TypeError: Illegal invocationnày nằm trong tệp "jquery-1.7.2.min.js", tất cả đều được nén, vì vậy tôi không thể tìm ra phần mã nào gây ra lỗi.

Có bất kỳ cài đặt nào tôi có thể thay đổi trong mã của mình để nó chấp nhận dữ liệu dưới dạng một mảng kết hợp không?

Nhờ cuộc nói chuyện với Sarfraz, chúng tôi có thể tìm ra giải pháp.

Vấn đề là tôi đã chuyển một phần tử HTML thay vì giá trị của nó, đây thực sự là những gì tôi muốn làm (thực tế trong mã php của tôi, tôi cần giá trị đó làm khóa ngoại để truy vấn citiesbảng của tôi và lọc các mục nhập chính xác).

Vì vậy, thay vì:

var data = {
        'mode': 'filter_city',
        'id_A': e[e.selectedIndex]
};

nó phải là:

var data = {
        'mode': 'filter_city',
        'id_A': e[e.selectedIndex].value
};

Lưu ý: hãy kiểm tra câu trả lời của Jason Kulatunga , nó trích dẫn tài liệu JQuery để giải thích lý do tại sao việc truyền một phần tử HTML lại gây ra sự cố.

Từ tài liệu jQuery cho processData:

processData Boolean
^{Default: true}
Theo mặc định, dữ liệu được truyền vào tùy chọn dữ liệu dưới dạng một đối tượng (về mặt kỹ thuật, bất kỳ thứ gì khác ngoài chuỗi) sẽ được xử lý và chuyển đổi thành một chuỗi truy vấn, phù hợp với loại nội dung mặc định "application / x-www -form-urlencoded ". Nếu bạn muốn gửi DOMDocument hoặc dữ liệu không được xử lý khác, hãy đặt tùy chọn này thành false.

Nguồn: http://api.jquery.com/jquery.ajax

Có vẻ như bạn sẽ phải sử dụng processDatađể gửi dữ liệu của mình đến máy chủ hoặc sửa đổi tập lệnh php của bạn để hỗ trợ các tham số được mã hóa chuỗi truy vấn.

Tôi gặp lỗi này khi đăng đối tượng FormData vì tôi không thiết lập lệnh gọi ajax một cách chính xác. Thiết lập bên dưới đã khắc phục sự cố của tôi.

var myformData = new FormData();        
myformData.append('leadid', $("#leadid").val());
myformData.append('date', $(this).val());
myformData.append('time', $(e.target).prev().val());

$.ajax({
    method: 'post',
    processData: false,
    contentType: false,
    cache: false,
    data: myformData,
    enctype: 'multipart/form-data',
    url: 'include/ajax.php',
    success: function (response) {
        $("#subform").html(response).delay(4000).hide(1); 
    }
});

Tôi đã đọc trong tài liệu JQuery rằng dữ liệu có thể là một mảng (các cặp giá trị khóa). Tôi gặp lỗi nếu tôi đặt:

Đây là đối tượng không phải là một mảng:

var data = {
        'mode': 'filter_city',
        'id_A': e[e.selectedIndex]
};

Bạn có thể muốn:

var data = [{
        'mode': 'filter_city',
        'id_A': e[e.selectedIndex]
}];

Gần đây gặp vấn đề tương tự, được giải quyết bằng cách thêm traditional: true,

function do_ajax(elem, mydata, filename)
{
    $.ajax({
        url: filename,
        context: elem,
        data: mydata,
        **contentType: false,
        processData: false**
        datatype: "html",
        success: function (data, textStatus, xhr) {
            elem.innerHTML = data;
        }
    });
}

$.ajax({
                    url:"",
                    type: "POST",
                    data: new FormData($('#uploadDatabaseForm')[0]),
                    contentType:false,
                    cache: false,
                    processData:false,
                    success:function (msg) {}
                  });

Thử cái này:

            $.ajax({
                    url:"",
                    type: "POST",
                    data: new FormData($('#uploadDatabaseForm')[0]),
                    contentType:false,
                    cache: false,
                    processData:false,
                    success:function (msg) {}
                  });