如何突出使用json2html結果表的行？

我從JSON數據使用Json2HTML jQuery插件json2html，這裏建立一個表是當前的狀態：http://jsfiddle.net/hamiltonlima/7u8v9wdq/ 我要的是在加工過程中比較currentID如此「主動」可以添加到類，任何建議？如何突出使用json2html結果表的行？

的HTML

<div class="container"> 
    <p> 
     <table id="placar" class="table table-condensed table-bordered"> 
      <thead> 
       <tr> 
        <th>#</th> 
        <th>Luchador</th> 
        <th>K</th> 
        <th>D</th> 
        <th>Pontos</th> 
       </tr> 
      </thead> 
      <tbody></tbody> 
     </table> 
</div>

JavaScript的

var data = [{ 
    'order': '1', 
     'name': 'nheco', 
     'k': '3', 
     'd': '0', 
     'score': '121', 
     'id': '540' 
}, { 
    'order': '2', 
     'name': 'boingo', 
     'k': '15', 
     'd': '3', 
     'score': '122', 
     'id': '541' 
}, { 
    'order': '3', 
     'name': 'Oswaldo', 
     'k': '0', 
     'd': '23', 
     'score': '123', 
     'id': '542' 
}]; 

var currentID = 541; 

var transform = { 
    tag: 'tr', 
    children: [{ 
     "tag": "td", 
      "html": "${order}" 
    }, { 
     "tag": "td", 
      "html": "${name}" 
    }, { 
     "tag": "td", 
      "html": "${k}" 
    }, { 
     "tag": "td", 
      "html": "${d}" 
    }, { 
     "tag": "td", 
      "html": "${score}" 
    }] 
}; 

$('#placar > tbody ').json2html(data, transform);

來源

2014-12-29 hamilton.lima

由標籤＃json2html搜索發現的其他問題，導致我的解決方案： How can I apply differnt styles when transforming data using json2html based on data value?

只需添加一個功能到class屬性來處理它，每行數據在函數中可用爲'this'

所以是somethig這樣的...

class : function(){ 
     if(this.id == currentID){ 
      return 'info'; 
     } else { 
      return ''; 
     } 
    },

完整的例子是在這裏：http://jsfiddle.net/hamiltonlima/7u8v9wdq/15/

編輯

可悲的是取代從json2html = true選項沒有按預期工作。 ..我寫了另一個解決方案爲每行添加id，並更新值。看看這裏http://jsfiddle.net/hamiltonlima/oqo9otq0/

來源

2014-12-29 20:21:57

如何突出使用json2html結果表的行？

回答

相關問題