изменение CSS на основе связывания данных из ответа в HTML-таблицу - PullRequest
0 голосов
/ 09 мая 2018

У меня есть HTML-таблица, созданная циклом for, как показано ниже:

for (var i = 0; i < 12; i++) {
var row = $('<tr>').appendTo("#zoning tbody");
for (var j = 1; j < 11; j++) {
    $(`<td class=${i * 10 + j}>${i * 10 + j}<\/td>`).appendTo(row);

как я могу написать оператор IF, который говорит

if (числа в ответе совпадают с номерами в таблице, запускающими этот код) { сделай это } } else if (числа в таблице отсутствуют в ответе, запустите this) { сделай это }

если число, присутствующее в таблице, отсутствует в ответе, сделать что-то еще, если число отсутствует, сделать что-то еще.

например. Я пытался написать что-то вроде следующего, но не уверен, что добавить в оператор IF

function updateTable() {
    $('td.coloured').css({'background-color':'#8F8F8F','border-color':'black','border-width':'thin'}).toggleClass('coloured');
    $.get('php/test2.php', function(response) {
  console.log(response);
    $.each(response, function(index, item) {
console.log(item.beacon)
      $(`td.${item.beacon}`).css({'background-color':item.location,'border-color':'black','border-width':'thin'}).addClass('coloured');
      if (item.delivery_avg <= 4.00) {
        return $('td.coloured').css({'border-color': 'lime','border-width': 'thick'}).toggleClass('coloured');
      } else if (item.delivery_avg >= 4.01 && item.delivery_avg <= 7.00) {
        return $('td.coloured').css({'border-color': 'orange','border-width': 'thick'}).toggleClass('coloured');
      } else if (item.delivery_avg >= 7.01 && item.delivery_avg <= 10.00) {
        return $('td.coloured').css({'border-color': 'pink','border-width': 'thick'}).toggleClass('coloured');
      } else if (item.delivery_avg >= 10.01) {
        return $('td.coloured').css({'border-color': 'red','border-width': 'thick'}).toggleClass('coloured');
      } else {             
        return $('td.coloured').css({'background-color':'#8F8F8F','border-color':'black','border-width':'thin'}).removeClass('coloured');
      } else {
    console.log("key not found");
    $('td').css({'background-color':'#8F8F8F','border-color':'black','border-width':'thin'}).removeClass('coloured');
  }

});
}
 var updateTableInterval = setInterval(updateTable, 5000);
});

пример

1,2,3,4,5,6,7,8,9,10 присутствуют в ячейках изменения ответа 1,2,3,4,5,6,7,8,9,10 на желтый

1,2,4,5,6,7,9,10 присутствуют в ячейках изменения ответа на желтый 3,8 нет ячеек изменения на серый.

1 Ответ

0 голосов
/ 09 мая 2018

Я думаю, что вам вообще не нужен IF, вы можете иметь таблицу со всеми строками серым по умолчанию, а затем изменить ячейки на желтый из ВСЕХ чисел в ответе, так что если 1,2,4 , 5,6,7,9,10 присутствуют в ответе, 3 и 8 не изменятся на желтый и будут серыми

Также вы должны очищать таблицу до серого каждый раз, когда вам нужно обновить данные.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...