Добавление строк в таблицу HTML с помощью jquery не работает - PullRequest
Новая
       78

Добавление строк в таблицу HTML с помощью jquery не работает

0 голосов
/ 09 сентября 2018

Я использую цикл for для добавления нескольких строк в мою таблицу HTML, используя jquery.

Цикл for (код ниже) выполняется в ответ на вызов ajax, который возвращает array of arrays. Но только 1 строка добавляется в таблицу независимо от того, нет. элементов в массиве.

Фактический объект ответа довольно большой, поэтому я прикрепляю ссылку Google Drive для ссылки

Как добавить все строки в таблицу?

Фрагмент кода (с использованием Jquery) 

$(document).ready(function() {
            $('#ghsubmitbtn').on('click', function(e) {

                var data = JSON.stringify(JSONObj);

                $.ajax({
                    url: 'https://api-crt.cert.havail.sabre.com/v4.2.0/shop/flights?mode=live&limit=50&offset=1',
                    method: 'POST',
                    contentType: "application/json; charset=utf-8",
                    data: data,
                    headers: {
                        "Authorization": 'Bearer ' + bat
                    },

                    success: function(data) {
                        var BookBtn = '<input type="submit" value="Book" name="book" class="btn btn-primary">';

                        for (var v = 0; v <= 999; v++) {
                            for (var b = 0; b <= 999; b++) {
                                for (var m = 0; m <= 999; m++) {

                                    var row = $('<tr><td>' + data.OTA_AirLowFareSearchRS.PricedItineraries.PricedItinerary[v].SequenceNumber + '</td><td>' +
                                        data.OTA_AirLowFareSearchRS.PricedItineraries.PricedItinerary[v].AirItinerary.OriginDestinationOptions.OriginDestinationOption[b].FlightSegment[m].DepartureDateTime + '</td><td>' +
                                        data.OTA_AirLowFareSearchRS.PricedItineraries.PricedItinerary[v].AirItinerary.OriginDestinationOptions.OriginDestinationOption[b].FlightSegment[m].ArrivalDateTime + '</td><td>' +
                                        data.OTA_AirLowFareSearchRS.PricedItineraries.PricedItinerary[v].AirItinerary.OriginDestinationOptions.OriginDestinationOption[b].FlightSegment[m].DepartureAirport.LocationCode + '</td><td>' +
                                        data.OTA_AirLowFareSearchRS.PricedItineraries.PricedItinerary[v].AirItinerary.OriginDestinationOptions.OriginDestinationOption[b].FlightSegment[m].ArrivalAirport.LocationCode + '</td><td>' +
                                        data.OTA_AirLowFareSearchRS.PricedItineraries.PricedItinerary[v].AirItinerary.OriginDestinationOptions.OriginDestinationOption[b].FlightSegment[m].DepartureDateTime + '</td><td>' +
                                        data.OTA_AirLowFareSearchRS.PricedItineraries.PricedItinerary[v].AirItinerary.OriginDestinationOptions.OriginDestinationOption[b].FlightSegment[m].ArrivalDateTime + '</td><td>' +
                                        data.OTA_AirLowFareSearchRS.PricedItineraries.PricedItinerary[v].AirItinerary.OriginDestinationOptions.OriginDestinationOption[b].FlightSegment[m].DepartureAirport.LocationCode + '</td><td>' +
                                        data.OTA_AirLowFareSearchRS.PricedItineraries.PricedItinerary[v].AirItinerary.OriginDestinationOptions.OriginDestinationOption[b].FlightSegment[m].ArrivalAirport.LocationCode + '</td><td>' +
                                        data.OTA_AirLowFareSearchRS.PricedItineraries.PricedItinerary[v].AirItinerary.OriginDestinationOptions.OriginDestinationOption[b].FlightSegment[m].OperatingAirline.Code + '</td><td>' +
                                        BookBtn + '</td></tr>');

                                    $('#tblData').append(row);
                                }
                            }
                        }
                    }
                });
            });

1 Ответ

0 голосов
/ 09 сентября 2018

Issue

JSON Исключение в консоли для неопределенного свойства JSON

Разрешение

Безопасный доступ к глубоко вложенным значениям в JavaScript

Прочтите эту статью , чтобы избежать исключений JSON в будущем.

Исправление 

if (data && data.OTA_AirLowFareSearchRS && data.OTA_AirLowFareSearchRS.PricedItineraries && data.OTA_AirLowFareSearchRS.PricedItineraries.PricedItinerary[v] && data.OTA_AirLowFareSearchRS.PricedItineraries.PricedItinerary[v].AirItinerary && data.OTA_AirLowFareSearchRS.PricedItineraries.PricedItinerary[v].AirItinerary.OriginDestinationOptions && data.OTA_AirLowFareSearchRS.PricedItineraries.PricedItinerary[v].AirItinerary.OriginDestinationOptions.OriginDestinationOption[b] && data.OTA_AirLowFareSearchRS.PricedItineraries.PricedItinerary[v].AirItinerary.OriginDestinationOptions.OriginDestinationOption[b].FlightSegment && data.OTA_AirLowFareSearchRS.PricedItineraries.PricedItinerary[v].AirItinerary.OriginDestinationOptions.OriginDestinationOption[b].FlightSegment[m]) {
    // Build row using nested JSON
}

Исправлено JSFiddle

P.S Чтобы быстро отладить, вы всегда должны проверять browser console, чтобы искать любые исключения JSON. Почти 90% проблем решаются с помощью отображаемых строк ошибок. Чтобы понять реальную проблему, я сделал то же самое:)

...