JQuery - JSON в <таблица>

jquery

19732 просмотра

7 ответа

25653 Репутация автора

У меня есть Json формы

[{"id":39,"data":1},{"id":40,"data":2}]

Не правильно разбирается с jQuery.parseJSON()

Мне нужно взять эти данные и создать HTML table. Я думал о создании HTML динамически в JS.

А. Как я могу разобрать JSON?
B. Является ли динамический HTML лучшим маршрутом?

Обновление
прошу прощения. Видимо мой вопрос не ясен. Вот JQuery

 $.get('Service.aspx',
    { p1: value, p2: value },
    function (data) {
        notesJson = data;
        alert(notesJson);//Json comes back as I said here...
        var noteSet = jQuery.parseJSON(notesJson);
        alert(noteSet.notes);                      
 });

примечания существуют в Json. Второе предупреждение завершается ошибкой «неопределено».

Автор: P.Brian.Mackey Источник Размещён: 13.05.2011 07:28

Ответы (7)


5 плюса

58656 Репутация автора

То, что у вас есть массив, вам нужен объект. Пытаться

 { "notes" : [{"id":39,"data":1},{"id":40,"data":2}] } 

как JSON

или сделай это

  alert(noteSet[0]);
  alert(noteSet[1]);
Автор: Hogan Размещён: 13.05.2011 07:31

23 плюса

117041 Репутация автора

Решение

Хорошо, если вы прокомментируете свой вопрос:

Используйте $.getJSONвместо $.get:

$.getJSON('someurl', {/*somedata*/}, function(json_data){

    //no need for parsejson
    //use the json_data object

    var table_obj = $('table');
    $.each(json_data, function(index, item){
         var table_row = $('<tr>', {id: item.id});
         var table_cell = $('<td>', {html: item.data});
         table_row.append(table_cell);
         table_obj.append(table_row);
    })

})
Автор: Neal Размещён: 13.05.2011 07:31

1 плюс

641 Репутация автора

Вы говорите, что используете .NET, чтобы вы могли использовать

return Json(yourObject, JsonRequestBehavior.AllowGet);

вместо JavaScriptSerializer. Вам не придется разбирать его.

Автор: Julien Размещён: 13.05.2011 07:47

1 плюс

15646 Репутация автора

Вот еще одна хорошая библиотека для этого: https://github.com/afshinm/Json-to-HTML-Table

Просто передайте данные JSON в эту библиотеку и получите таблицу HTML:

//Only first parameter is required
var jsonHtmlTable = ConvertJsonToTable(objectArray, 'jsonTable', null, 'Download');
Автор: Afshin Mehrabani Размещён: 29.12.2012 03:44

0 плюса

806 Репутация автора

Плагин jquery, который принимает данные JSON для заполнения таблицы, может подойти. jsonTable

Автор: Omkar Khair Размещён: 23.07.2013 05:21

0 плюса

417 Репутация автора

Вот еще один способ, учитывающий заголовки таблицы для типичного запроса к базе данных. Основываясь на ответе Нила:

$.getJSON('bower.json', {}, function(json_data) {
            var table = $('table');
            $.each(json_data, function(key, item) {
                var table_row = $('<tr>');
                $.each(item, function(itemKey, itemValue) {
                    if (key == 0) {
                        table.append($('<th>', {html: itemKey}));
                    }
                    table_row.append($('<td>', {html: itemValue}));
                });
                table.append(table_row);
            });
        });
Автор: Juan Herrera Размещён: 27.04.2014 03:02

0 плюса

374 Репутация автора

Попробуйте этот полный код:

<head>
    <script type="text/javascript">  
    $.getJSON('URL', function(json_data){

        var table_obj = $('table');
        $.each(json_data, function(index, result){
             var table_row = $('<tr>', {});
             var table_cell1 = $('<td>', {html: result.firstName});//result.yourDataAttributes
             var table_cell2 = $('<td>', {html: result.lastName});
             var table_cell3 = $('<td>', {html: result.age});
             table_row.append(table_cell1,table_cell2,table_cell3);
             table_obj.append(table_row);
        })

    });
    </script>
</head>
<body> 
<table id=""></table> 
</body>
Автор: A_BOSS Размещён: 04.05.2014 10:57
Вопросы из категории :
32x32