Bootstrap дизайн стиль таблицы

Здесь у меня есть DataTable http://jsbin.com/aMAQUWe/1/edit Bootstrap дизайн стиль таблицы

КОД:

<html> 
    <head> 
    <script type='text/javascript' src='https://www.google.com/jsapi'></script> 
    <script type='text/javascript'> 
     google.load('visualization', '1', {packages:['table']}); 
     google.setOnLoadCallback(drawTable); 
     function drawTable() { 
     var data = new google.visualization.DataTable(); 
     data.addColumn('string', 'Name'); 
     data.addColumn('number', 'Salary'); 
     data.addColumn('boolean', 'Full Time Employee'); 
     data.addRows([ 
      ['Mike', {v: 10000, f: '$10,000'}, true], 
      ['Jim', {v:8000, f: '$8,000'}, false], 
      ['Alice', {v: 12500, f: '$12,500'}, true], 
      ['Bob', {v: 7000, f: '$7,000'}, true] 
     ]); 

     var table = new google.visualization.Table(document.getElementById('table_div')); 
     table.draw(data, {showRowNumber: true}); 
     } 
    </script> 
    </head> 

    <body> 
    <div id='table_div'></div> 
    </body> 
</html>

Есть ли способ, чтобы добавить твиттер дизайн начальной загрузки в этой таблице?

источник

2014-01-26 MikiMrki

Вы проверили документацию Tables в Bootstrap? Это покажет вам, как настроены табличные эффекты.

Я предполагаю, что вам необходимо динамически вставлять правила CSS с помощью того, как вы создаете таблицу, например, используйте <table> вместо <div>.

источник

2014-01-26 18:13:55

Да, но посмотрите здесь: http://jsbin.com/EXeGebE/1/edit ничего не случилось, потому что сначала загрузите google css вместо twitter bootstrap css ... – MikiMrki

Похоже, скрипт 'jsapi' переопределяет все. Используется класс '.google-visualization-table-table', переопределяющий классы Bootstrap. Если вы проверите DOM, вы увидите, что при добавлении таблицы «class =» «to»

'классы Bootstrap переопределяются, поскольку классы Google Charts добавляются далее в таблицу. Можете ли вы переопределить это? –

Попробуйте это решение: http://stackoverflow.com/questions/14205446/how-to-prevent-loading-google-charts-table-css Надеюсь, это сработает для вас. –

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

Bootstrap дизайн стиль таблицы

ответ

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