2016-03-15 2 views
0

Можно ли изменить класс строк (используя загрузку) на основе значения ячейки данных? Что-то вроде этого: (здесь я жёстко класс в ряд) enter image description hereИзменить класс строки таблицы на основе значения ячейки

Вот фрагмент кода

onEachFeature: function (feature, layer) { 
    if (feature.properties) { 
     var content = "<table class='table table-striped table-bordered table-condensed'>" + "<tr><th>Šifra trafostanice</th><td>" + feature.properties.ts_sifra + 
     "</td></tr>" + "<tr><th>Name</th><td>" + feature.properties.ts_naziv + "</td></tr>" + 
     "<tr><th>Code</th><td>" + feature.properties.sifra_lampe + "</td></tr>" + 
     "<tr><th>Power</th><td>" + feature.properties.tip_lampe + "</td></tr>" + 
     "<tr><th>Pole type</th><td>" + feature.properties.vrsta_stupa + "</td></tr>" + 
     "<tr><th>Adress</th><td>" + feature.properties.adresa + "</td></tr>" + 
     "<tr><th>Services</th><td>" + feature.properties.datum + "</td></tr>" 
     "</table>";..... 

Используя код выше, я получаю что-то вроде этого: enter image description here

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

(пример, если значение строк таблицы Услуг «Нема Servisa» добавить класс успех еще отпуск строки без изменений)

ответ

1

Поскольку вы создаете это с помощью JavaScript да это очень выполнимо.

В этой строке просто проверьте, есть ли feature.properties.datum === 'Nema Servisa'. Если да, добавьте class="success". Если нет, не делайте этого.

onEachFeature: function (feature, layer) { 
    if (feature.properties) { 
    var content = "<table class='table table-striped table-bordered table-condensed'>" + "<tr><th>Šifra trafostanice</th><td>" + feature.properties.ts_sifra + 
    "</td></tr>" + "<tr><th>Name</th><td>" + feature.properties.ts_naziv + "</td></tr>" + 
    "<tr><th>Code</th><td>" + feature.properties.sifra_lampe + "</td></tr>" + 
    "<tr><th>Power</th><td>" + feature.properties.tip_lampe + "</td></tr>" + 
    "<tr><th>Pole type</th><td>" + feature.properties.vrsta_stupa + "</td></tr>" + 
    "<tr><th>Adress</th><td>" + feature.properties.adresa + "</td></tr>" + 
    "<tr" + (feature.properties.datum === 'Nema servisa' ? ' class="success"' : '') + "><th>Services</th><td>" + feature.properties.datum + "</td></tr>" 
    "</table>";..... 
+0

Да, что действительный, аккуратный ответ , спасибо! Я даже немного изменил добавление этой строки функции feature.properties.datum === 'Nema servisa'? 'class = "danger"': '' || feature.properties.datum! = 'Nema servisa'? 'class = "success"': '' – Svinjica

1

При создании таблицы, добавьте class="feature-property" к каждому элементу тд. Тогда можно определить эту функцию и вызвать ее после того, как таблица генерируется:

function highlightTableRow(match){ 
    $('.feature-property').each(function(){ 
     var value = $(this).html(); 
     if(value === match){ 
      $(this).addClass('success'); 
     } 
    }); 
} 

И match будет значение данных вы хотите проверить .. в этом случае, Nema Servisa

+0

Thx для ответа! :) – Svinjica

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