-1

Я разрабатываю проект Dashboard, компонент которого отображает сводную таблицу в «миниатюрном» окне на панели управления, с параметрами запроса пользовательский ввод для создания конкретный отчет.Internet Explorer Incompatibility v9 & v8 [object Object] ~ дополнительная

Код отлично подходит для Chrome, Firefox, Internet Explorer 11 и 10, Microsoft Edge и вот пример того, что правильно отображается.

Correctly Rendered

Однако некоторые из моих клиентов все еще используют Internet Explorer 9 и 8, и я должен поддерживать их с кодом, который совместим и это с этими версиями, что у меня есть проблемы, как показано в следующем примере.

Incorrectly Rendered

Итак, как вы можете видеть, для каждого объекта ввода пользователя, по какой-то причине [объект Object] отображается выше в сводной таблице.

пользовательского ввода переменных хранятся в виде скрытого тега, а ниже пример

Hidden Input Variables

Процесс выглядит следующим образом

1) Я заполнить таблицу, передавая сохраненные входные переменные сервер и вернуть объект JSON с результатами

$.getJSON('/analyticsdashboard/SysoutSearch/GetSysout?' + $('#hdnParameters').val().slice($('#hdnParameters').val().indexOf('?') + 1)).done(function (result) { 
      var tbl = $("#tbl"); 
      var tbody = $('#tbl>tbody'); 

2) Я затем и 'strip' из переменных в конкретные объекты

var jobName = getURLParameterForHtml('jobName', $('#hdnParameters').val()); 
      var startDate = getURLParameterForHtml('startDate', $('#hdnParameters').val()); 
      var startTime = getURLParameterForHtml('startTime', $('#hdnParameters').val()); 
      var endDate = getURLParameterForHtml('endDate', $('#hdnParameters').val()); 
      var endTime = getURLParameterForHtml('endTime', $('#hdnParameters').val()); 
      var lastxDays = getURLParameterForHtml('lastxDays', $('#hdnParameters').val()); 
      var tableName = getURLParameterForHtml('tableName', $('#hdnParameters').val()); 
      var groupName = getURLParameterForHtml('groupName', $('#hdnParameters').val()); 
      var applicationName = getURLParameterForHtml('applicationName', $('#hdnParameters').val()); 
      var memberName = getURLParameterForHtml('memberName', $('#hdnParameters').val()); 
      var owner = getURLParameterForHtml('owner', $('#hdnParameters').val()); 
      var nodeId = getURLParameterForHtml('nodeId', $('#hdnParameters').val()); 
      var endStatus = getURLParameterForHtml('endStatus', $('#hdnParameters').val()); 
      var serverName = getURLParameterForHtml('serverName', $('#hdnParameters').val()); 
      var orderId = getURLParameterForHtml('orderId', $('#hdnParameters').val()); 

Функция getUrlParameter ниже

var getUrlParameter = function (sParam, url) { 
//debugger; 
//window.location.search 
var sPageURL = decodeURIComponent(url.substring(1)), 
    sURLVariables = sPageURL.split('&'), 
    sParameterName, 
    i; 

for (i = 0; i < sURLVariables.length; i++) { 
    sParameterName = sURLVariables[i].split('='); 

    if (sParameterName[0] === sParam) { 
     return sParameterName[1] === undefined ? true : sParameterName[1]; 
    } 
} 

};

3) Затем я проверить для объектов, которые содержат данные, т.е. не пустые и присоединять их в виде строки в тело сводной таблицы, пример ниже

if (jobName[1]) { 
         var newRow = "<tr><td></td><td>" + "Job Name" + "</td>" + "<td>" + jobName[1] + "<td></td></tr>" + tbody.append(newRow); 
        } 

Я попытался исследовать это здесь SO, например Internet Explorer Incompatibility - page just shows "[object Object]" WTH?

Но не смогли найти решение или полностью понять проблему.

Я хотел бы знать,

1) Почему эта проблема происходит в IE9 и IE8, а не Chrome, Firefox, IE 10 и IE11, Microsoft края?

2) Что делать, чтобы разрешить это?

+0

Я рекомендую потратить некоторое время на отладку (IE9 имеет отладчик встроенный) или, по крайней мере, делает достаточно, чтобы создать [mcve] с работоспособный на месте, например (с использованием стека Snippets, метод '<>' кнопка панели инструментов). –

ответ

0

Эта проблема была вызвана моей косой ошибкой HTML для добавления новой строки в итоговую таблицу.

Раньше я приложил каждую новую строку, например, как

if (jobName[1]) { 
        var newRow = "<tr><td></td><td>" + "Job Name" + "</td><td>" + jobName[1] + "</td></tr>" + tbody.append(newRow); 
       } 

Именно этот промах кодирования, что вызвало проблемы в IE8 и IE9.

Я изменил код, разделив новую строку и tbody.append (NewRow) на два отдельных заявления, пример следует

if (jobName[1]) { 
       var newRow = "<tr>" + "<td></td>" + "<td>" + "Job Name" + "</td><td>" + jobName[1] + "</td>" + "</tr>"; 
       tbody.append(newRow); 
      } 

и мой «уменьшенная» Теперь окно отображается правильно в IE8> IE11, Microsoft Edge, Chrome и Firefox.

Okay in IE8 and IE9

Смежные вопросы