Phân tích cú pháp JSON từ dữ liệu thành công của JQuery.ajax

Tôi gặp sự cố khi lấy nội dung của đối tượng JSON từ lệnh gọi JQery.ajax. Cuộc gọi của tôi:

$('#Search').click(function () {
    var query = $('#query').valueOf();
    $.ajax({
        url: '/Products/Search',
        type: "POST",
        data: query,
        dataType: 'application/json; charset=utf-8',
        success: function (data) {
            alert(data);
            for (var x = 0; x < data.length; x++) {
                content = data[x].Id;
                content += "<br>";
                content += data[x].Name;
                content += "<br>";
                $(content).appendTo("#ProductList");
               // updateListing(data[x]);
            }
        }
    });
});

Có vẻ như đối tượng JSON đang được trả về chính xác vì "alert (data)" hiển thị như sau

[{"Id": "1", "Name": "Shirt"}, {"Id": "2", "Name":"Pants"}]

nhưng khi tôi thử hiển thị Id hoặc Tên cho trang bằng cách sử dụng:

content = data[x].Id;
content += "<br>";
content += data[x].Name;
content += "<br>";

nó trả về "không xác định" cho trang. Tôi đang làm gì sai?

Cảm ơn đã giúp đỡ.

Dữ liệu sẽ quay trở lại dưới dạng biểu diễn chuỗi của JSON và bạn sẽ không chuyển đổi nó trở lại đối tượng JavaScript. Đặt dataTypethành chỉ 'json'để nó được chuyển đổi tự động.

Tôi khuyên bạn nên sử dụng:

var returnedData = JSON.parse(response);

để chuyển đổi chuỗi JSON (nếu nó chỉ là văn bản) thành một đối tượng JavaScript.

Nó hoạt động tốt, ví dụ:

$.ajax({
    url: "http://localhost:11141/Search/BasicSearchContent?ContentTitle=" + "تهران",
    type: 'GET',
    cache: false,
    success: function(result) {
        //  alert(jQuery.dataType);
        if (result) {
            //  var dd = JSON.parse(result);
            alert(result[0].Id)
        }

    },
    error: function() {
        alert("No");
    }
});

Cuối cùng, bạn cần sử dụng câu lệnh này ...

result[0].Whatever

Một trong những cách bạn có thể đảm bảo rằng loại lỗi này (sử dụng chuỗi thay vì json) không xảy ra là xem những gì được in trong alert. Khi bạn làm

alert(data)

nếu dữ liệu là một chuỗi, nó sẽ in mọi thứ được chứa trong đó. Tuy nhiên nếu bạn in là đối tượng json. bạn sẽ nhận được phản hồi sau trong cảnh báo

[object Object]

Nếu đây là phản hồi thì bạn có thể chắc chắn rằng bạn có thể sử dụng nó như một đối tượng (json trong trường hợp này).

Vì vậy, trước tiên bạn cần chuyển đổi chuỗi của mình thành json, trước khi sử dụng nó bằng cách làm như sau:

JSON.parse(data)

Chà ... bạn đã đi được khoảng 3/4 chặng đường đến đó ... bạn đã có JSON dưới dạng văn bản.

Vấn đề là bạn có vẻ đang xử lý chuỗi này như thể nó đã là một đối tượng JavaScript với các thuộc tính liên quan đến các trường được truyền.

Nó không ... nó chỉ là một chuỗi.

Các truy vấn như "content = data [x] .Id;" nhất định không thành công vì JavaScript không tìm thấy các thuộc tính này được gắn với chuỗi mà nó đang xem ... một lần nữa, CHỈ LÀ một chuỗi.

Bạn có thể chỉ cần phân tích cú pháp dữ liệu dưới dạng JSON thông qua ... yup ... phương thức phân tích cú pháp của đối tượng JSON.

myResult = JSON.parse(request.responseText);

Bây giờ myResult là một đối tượng javascript chứa các thuộc tính được truyền qua AJAX.

Điều đó sẽ cho phép bạn xử lý nó theo cách bạn dường như đang cố gắng.

Có vẻ như JSON.parse đã được thêm vào khi ECMA5 được thêm vào, vì vậy mọi thứ khá hiện đại đều có thể xử lý điều này nguyên bản ... nếu bạn phải xử lý hóa thạch, bạn cũng có thể thử các thư viện bên ngoài để xử lý điều này, chẳng hạn như jQuery hoặc JSON2 .

Đối với hồ sơ, điều này đã được trả lời bởi Andy E cho một người khác TẠI ĐÂY .

chỉnh sửa - Đã thấy yêu cầu về 'nguồn chính thức hoặc nguồn đáng tin cậy' và có lẽ một trong những người viết mã mà tôi thấy đáng tin cậy nhất sẽ là John Resig ~ ECMA5 JSON ~ Tôi đã liên kết với thông số ECMA5 thực tế về hỗ trợ JSON gốc, nhưng tôi sẽ thay vì giới thiệu ai đó với một bậc thầy như Resig hơn là một thông số kỹ thuật khô khan.

Hãy thử eachhàm jquery để xem qua đối tượng json của bạn:

$.each(data,function(i,j){
    content ='<span>'+j[i].Id+'<br />'+j[i].Name+'<br /></span>';
    $('#ProductList').append(content);
});

bạn có thể sử dụng phương thức jQuery parseJSON:

var Data = $.parseJSON(response);

loại đầu vào Nút

<input type="button" Id="update" value="Update">

Tôi đã đăng thành công một biểu mẫu với AJAX trong perl. Sau khi đăng biểu mẫu, bộ điều khiển trả về phản hồi JSON như bên dưới

$(function() {

    $('#Search').click(function() {
        var query = $('#query').val();
        var update = $('#update').val();

        $.ajax({
            type: 'POST',
            url: '/Products/Search/',
            data: {
                'insert': update,
                'query': address,
            },
            success: function(res) {
                $('#ProductList').empty('');
                console.log(res);
                json = JSON.parse(res);
                for (var i in json) {
                    var row = $('<tr>');
                    row.append($('<td id=' + json[i].Id + '>').html(json[i].Id));
                    row.append($('<td id=' + json[i].Name + '>').html(json[i].Name));
                    $('</tr>');
                    $('#ProductList').append(row);
                }
            },
            error: function() {
                alert("did not work");
                location.reload(true);
            }
        });
    });
});

Từ API jQuery: với cài đặt dataType, Nếu không có gì được chỉ định, jQuery sẽ cố gắng suy ra nó $.parseJSON()dựa trên kiểu MIME (kiểu MIME cho văn bản JSON là "application / json") của phản hồi (trong 1.4 JSON sẽ mang lại một đối tượng JavaScript).

Hoặc bạn có thể thiết lập dataTypeđể jsonchuyển đổi nó tự động.

Tôi không chắc có chuyện gì xảy ra với thiết lập của bạn. Có thể máy chủ không đặt tiêu đề đúng cách. Không chắc. Như một cảnh quay dài, bạn có thể thử điều này

$.ajax({
    url : url,
    dataType : 'json'
})
.done(function(data, statusText, resObject) {
   var jsonData = resObject.responseJSON
})

phân tích cú pháp và chuyển đổi nó thành đối tượng js.

success: function(response) {
    var content = "";
    var jsondata = JSON.parse(response);
    for (var x = 0; x < jsonData.length; x++) {
        content += jsondata[x].Id;
        content += "<br>";
        content += jsondata[x].Name;
        content += "<br>";
    }
    $("#ProductList").append(content);
}