TechQA.

Convert multiple tables within different div tags into sortable/searchable tables

687 views Asked by At

I have many tables on one page. However, only the very first table is sortable/searchable. I would like to convert all tables into sortable/searchable tables. I made sure they all had the same class and same ID, but no matter what I do, the first table is the only one that is sortable/searchable. I'm using dataTables.bootstrap and jquery.dataTables.js.

Giving all tables the class display (as per this tutorial)I ran the following js expecting the desired result:

$(document).ready(function() {
    $('table.display').dataTable();
} );

Here's my full html page (sorry it's so long, but I want to display the structure of the page). 

<div id="wrapper">

    <div id="page-wrapper_frame">
        <!-- .row  -->
        <div class="row">
            <div class="col-lg-12">
                <h1 class="page-header">Cost Report</h1>
            </div>
            <!-- /.col-lg-12 -->
        </div>
        <!-- /.row -->

        <!-- .row  -->
        <div class="row">
            <div class="col-lg-12">
                <div class="panel panel-default">
                    <div class="panel-heading">
                        Fiscal Year Dates
                    </div>
                    <!-- /.panel-heading -->
                    <div class="panel-body">
                        <div class="dataTable_wrapper">
                            <table class="table table-striped table-bordered table-hover display" id="dataTables-example">
                            <thead>
                               <tr>
                                  <th>testdata</th>
                                  <th>testdata</th>
                                  <th>testdata</th>
                                  <th>testdata</th>
                                  <th>testdata</th>
                                  <th>testdata</th>
                                  <th>testdata</th>
                               </tr>
                               </thead>
                               <tbody>
                               <tr>
                                  <td>testdata</td>
                                  <td class="align-right">10/1/13</td>
                                  <td class="align-right">7/1/13</td>
                                  <td class="align-right">7/1/13</td>
                                  <td class="align-right">10/1/12</td>
                                  <td class="align-right">10/1/13</td>
                                  <td class="align-right">10/1/13</td>
                               </tr>
                               <tr>
                                  <td>testdata</td>
                                  <td class="align-right">9/30/14</td>
                                  <td class="align-right">6/30/14</td>
                                  <td class="align-right">6/30/14</td>
                                  <td class="align-right">9/30/13</td>
                                  <td class="align-right">9/30/14</td>
                                  <td class="align-right">9/30/14</td>
                               </tr>
                               </tbody>
                            </table>

                        </div>
                    </div>
                    <!-- /.panel-body -->
                </div>
                <!-- /.panel -->
            </div>
            <!-- /.col-lg-12 -->
        </div>
        <!-- /.row -->

        <!-- .row  -->
        <div class="row">
            <div class="col-lg-12">
                <div class="panel panel-default">
                    <div class="panel-heading">
                        Income Statement
                    </div>
                    <!-- /.panel-heading -->
                    <div class="panel-body">
                        <div class="dataTable_wrapper">
                            <table class="table table-striped table-bordered table-hover display" id="dataTables-example">
                               <thead>
                               <tr>
                                  <th>testdata</th>
                                  <th>testdata</th>
                                  <th>testdata</th>
                                  <th>testdata</th>
                                  <th>testdata</th>
                                  <th>testdata</th>
                                  <th>testdata</th>
                               </tr>
                               <thead>
                               <tbody>
                               <tr>
                                  <td>testdata</td>
                                  <td class="align-right">$9,365,981</td>
                                  <td class="align-right">$906,342,935</td>
                                  <td class="align-right">$84,721,081</td>
                                  <td class="align-right">$25,517,352</td>
                                  <td class="align-right">$19,917,566</td>
                                  <td class="align-right">$25,969,753</td>
                               </tr>
                               <tr>
                                  <td>testdata</td>
                                  <td class="align-right">$48,953,782</td>
                                  <td class="align-right">$1,172,748,579</td>
                                  <td class="align-right">$288,978,245</td>
                                  <td class="align-right">$71,797,156</td>
                                  <td class="align-right">$60,472,586</td>
                                  <td class="align-right">$79,334,724</td>
                               </tr>
                               <tr>
                                  <td>testdata</td>
                                  <td class="align-right">$58,319,763</td>
                                  <td class="align-right">$2,079,091,514</td>
                                  <td class="align-right">$373,699,326</td>
                                  <td class="align-right">$97,314,508</td>
                                  <td class="align-right">$80,390,152</td>
                                  <td class="align-right">$105,304,477</td>
                               </tr>
                               <tr>
                                  <td>testdata</td>
                                  <td class="align-right">$17,858,041</td>
                                  <td class="align-right">$1,206,080,155</td>
                                  <td class="align-right">$232,442,441</td>
                                  <td class="align-right">$46,783,039</td>
                                  <td class="align-right">$34,600,804</td>
                                  <td class="align-right">$55,832,703</td>
                               </tr>
                               <tr>
                                  <td>testdata</td>
                                  <td class="align-right">$40,461,722</td>
                                  <td class="align-right">$873,011,359</td>
                                  <td class="align-right">$141,256,885</td>
                                  <td class="align-right">$50,531,469</td>
                                  <td class="align-right">$45,789,348</td>
                                  <td class="align-right">$49,471,774</td>
                               </tr>
                               <tr>
                                  <td>testdata</td>
                                  <td class="align-right">$44,523,416</td>
                                  <td class="align-right">$905,003,970</td>
                                  <td class="align-right">$139,174,532</td>
                                  <td class="align-right">$56,676,758</td>
                                  <td class="align-right">$49,188,951</td>
                                  <td class="align-right">$55,198,560</td>
                               </tr>
                               <tr>
                                  <td>testdata</td>
                                  <td class="align-right">-$4,061,694</td>
                                  <td class="align-right">-$31,992,611</td>
                                  <td class="align-right">$2,082,353</td>
                                  <td class="align-right">-$6,145,289</td>
                                  <td class="align-right">-$3,399,603</td>
                                  <td class="align-right">-$5,726,786</td>
                               </tr>
                               <tr>
                                  <td>testdata</td>
                                  <td class="align-right">$18,523</td>
                                  <td class="align-right">$0</td>
                                  <td class="align-right">$0</td>
                                  <td class="align-right">$653,760</td>
                                  <td class="align-right">$0</td>
                                  <td class="align-right">$47,184</td>
                               </tr>
                               <tr>
                                  <td>testdata</td>
                                  <td class="align-right">$1,846,432</td>
                                  <td class="align-right">$854,475</td>
                                  <td class="align-right">$0</td>
                                  <td class="align-right">$357,147</td>
                                  <td class="align-right">$0</td>
                                  <td class="align-right">$1,058,756</td>
                               </tr>
                               <tr>
                                  <td>testdata</td>
                                  <td class="align-right">$0</td>
                                  <td class="align-right">$1,993,366</td>
                                  <td class="align-right">$0</td>
                                  <td class="align-right">$0</td>
                                  <td class="align-right">$0</td>
                                  <td class="align-right">$0</td>
                               </tr>
                               <tr>
                                  <td>testdata</td>
                                  <td class="align-right">$2,394,137</td>
                                  <td class="align-right">$121,869,720</td>
                                  <td class="align-right">-$1,468,370</td>
                                  <td class="align-right">$5,722,029</td>
                                  <td class="align-right">$3,813,929</td>
                                  <td class="align-right">$2,214,932</td>
                               </tr>
                               <tr>
                                  <td>testdata</td>
                                  <td class="align-right">$4,259,092</td>
                                  <td class="align-right">$122,724,195</td>
                                  <td class="align-right">-$1,468,370</td>
                                  <td class="align-right">$6,732,936</td>
                                  <td class="align-right">$3,813,929</td>
                                  <td class="align-right">$3,320,872</td>
                               </tr>
                               <tr>
                                  <td>testdata</td>
                                  <td class="align-right">$0</td>
                                  <td class="align-right">$0</td>
                                  <td class="align-right">$0</td>
                                  <td class="align-right">$0</td>
                                  <td class="align-right">$0</td>
                                  <td class="align-right">$3</td>
                               </tr>
                               <tr>
                                  <td>testdata</td>
                                  <td class="align-right">$44,523,416</td>
                                  <td class="align-right">$905,003,970</td>
                                  <td class="align-right">$139,174,532</td>
                                  <td class="align-right">$56,676,758</td>
                                  <td class="align-right">$49,188,951</td>
                                  <td class="align-right">$55,198,563</td>
                               </tr>
                               <tr>
                                  <td>testdata</td>
                                  <td class="align-right">$197,398</td>
                                  <td class="align-right">$90,731,584</td>
                                  <td class="align-right">$613,983</td>
                                  <td class="align-right">$587,647</td>
                                  <td class="align-right">$414,326</td>
                                  <td class="align-right">-$2,405,917</td>
                               </tr>
                               <tr>
                                  <td>testdata</td>
                                  <td class="align-right">$1,975,319</td>
                                  <td class="align-right">$34,951,967</td>
                                  <td class="align-right">$8,573,237</td>
                                  <td class="align-right">$3,722,219</td>
                                  <td class="align-right">$1,551,948</td>
                                  <td class="align-right">$2,208,306</td>
                               </tr>
                               <tbody>
                            </table>
                        </div>
                    </div>
                    <!-- /.panel-body -->
                </div>
                <!-- /.panel -->
            </div>
            <!-- /.col-lg-12 -->
        </div>
        <!-- /.row -->

                    <!-- .row  -->
        <div class="row">
            <div class="col-lg-12">
                <div class="panel panel-default">
                    <div class="panel-heading">
                        KPIs
                    </div>
                    <!-- /.panel-heading -->
                    <div class="panel-body">
                        <div class="dataTable_wrapper">
                            <table class="table table-striped table-bordered table-hover display" id="dataTables-example">
                                <thead>
                               <tr>
                                  <td>testdata</td>
                                  <td>testdata</td>
                                  <td>testdata</td>
                                  <td>testdata</td>
                                  <td>testdata</td>
                                  <td>testdata</td>
                                  <td>testdata</td>
                               </tr>
                               </thead>
                               <tbody>
                               <tr>
                                  <td>testdata</td>
                                  <td class="align-right">20</td>
                                  <td class="align-right">294</td>
                                  <td class="align-right">78</td>
                                  <td class="align-right">25</td>
                                  <td class="align-right">25</td>
                                  <td class="align-right">25</td>
                               </tr>
                               <tr>
                                  <td>testdata</td>
                                  <td class="align-right">5</td>
                                  <td class="align-right">93</td>
                                  <td class="align-right">20</td>
                                  <td class="align-right">0</td>
                                  <td class="align-right">0</td>
                                  <td class="align-right">0</td>
                               </tr>
                               <tr>
                                  <td>testdata</td>
                                  <td class="align-right">25</td>
                                  <td class="align-right">387</td>
                                  <td class="align-right">98</td>
                                  <td class="align-right">25</td>
                                  <td class="align-right">25</td>
                                  <td class="align-right">25</td>
                               </tr>
                               <tr>
                                  <td>testdata</td>
                                  <td class="align-right">262</td>
                                  <td class="align-right">3,897</td>
                                  <td class="align-right">483</td>
                                  <td class="align-right">365</td>
                                  <td class="align-right">314</td>
                                  <td class="align-right">292</td>
                               </tr>
                               <tr>
                                  <td>testdata</td>
                                  <td class="align-right">508</td>
                                  <td class="align-right">18,202</td>
                                  <td class="align-right">2,923</td>
                                  <td class="align-right">905</td>
                                  <td class="align-right">320</td>
                                  <td class="align-right">1,681</td>
                               </tr>
                               <tr>
                                  <td>testdata</td>
                                  <td class="align-right">4,135</td>
                                  <td class="align-right">106,400</td>
                                  <td class="align-right">12,619</td>
                                  <td class="align-right">5,640</td>
                                  <td class="align-right">6,068</td>
                                  <td class="align-right">6,194</td>
                               </tr>
                               <tr>
                                  <td>testdata</td>
                                  <td class="align-right">97.0</td>
                                  <td class="align-right">67.9</td>
                                  <td class="align-right">101.0</td>
                                  <td class="align-right">74.0</td>
                                  <td class="align-right">73.1</td>
                                  <td class="align-right">78.0</td>
                               </tr>
                               <tr>
                                  <td>testdata</td>
                                  <td class="align-right">8.1</td>
                                  <td class="align-right">5.8</td>
                                  <td class="align-right">4.3</td>
                                  <td class="align-right">6.2</td>
                                  <td class="align-right">19.0</td>
                                  <td class="align-right">3.7</td>
                               </tr>
                               <tr>
                                  <td>testdata</td>
                                  <td class="align-right">$40,461,722</td>
                                  <td class="align-right">$873,011,359</td>
                                  <td class="align-right">$141,256,885</td>
                                  <td class="align-right">$50,531,469</td>
                                  <td class="align-right">$45,789,348</td>
                                  <td class="align-right">$49,471,774</td>
                               </tr>
                               <tr>
                                  <td>testdata</td>
                                  <td class="align-right">11.3</td>
                                  <td class="align-right">291.5</td>
                                  <td class="align-right">34.6</td>
                                  <td class="align-right">15.5</td>
                                  <td class="align-right">16.6</td>
                                  <td class="align-right">17.0</td>
                               </tr>
                               <tr>
                                  <td>testdata</td>
                                  <td class="align-right">45.3%</td>
                                  <td class="align-right">75.3%</td>
                                  <td class="align-right">35.3%</td>
                                  <td class="align-right">61.8%</td>
                                  <td class="align-right">66.5%</td>
                                  <td class="align-right">67.9%</td>
                               </tr>
                            </tbody>  

                            </table>

                        </div>
                    </div>
                    <!-- /.panel-body -->
                </div>
                <!-- /.panel -->
            </div>
            <!-- /.col-lg-12 -->
        </div>
        <!-- /.row -->



    </div>
    <!-- /#page-wrapper -->

</div>

Here are some screenshots:

enter image description here enter image description here

I have no idea why only the first table is sortable/searchable and not all. Any help would be greatly appreciated! Thanks!

javascript jquery twitter-bootstrap jquery-ui-sortable
Original Q&A
2

There are 2 answers

1
Coding Enthusiast On

first and foremost: you added same id? no you don't do that. Ids are unique and duplicating them is a bad bad thing.

Give your tables unique ids and then follow instructions from your plugin site: 

//according to the site: this should make your table searchable
$(document).ready(function(){
    $('#myTable').DataTable();
}); 
//have you called the js files and css for the plugins ? 

//cdn.datatables.net/1.10.7/css/jquery.dataTables.min.css
//cdn.datatables.net/1.10.7/js/jquery.dataTables.min.js
2
Mark C. On

Given that your posted code is the code that you're actually using, with references to jQuery, jQuery dataTables, jQuery dataTable css, and what looks like Bootstrap, everything should fall into place.

jQuery dataTables comes with Sorting/Filtering out of the box (along with many other useful functionalities), so there really isn't much that you need to do to configure it.

Here's proof that your code works. I would make sure you're loading jQuery before you load dataTables, as it is a dependency.

$(document).ready(function() {
  var s = $('table.display').dataTable();
  s.css({
    'color': 'blue'
  });
});

<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css" rel="stylesheet" />
<link href="//cdn.datatables.net/1.10.7/css/jquery.dataTables.css" rel="stylesheet" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="//cdn.datatables.net/1.10.7/js/jquery.dataTables.min.js"></script>
<div id="wrapper">

  <div id="page-wrapper_frame">
    <!-- .row  -->
    <div class="row">
      <div class="col-lg-12">
        <h1 class="page-header">Cost Report</h1>
      </div>
      <!-- /.col-lg-12 -->
    </div>
    <!-- /.row -->

    <!-- .row  -->
    <div class="row">
      <div class="col-lg-12">
        <div class="panel panel-default">
          <div class="panel-heading">
            Fiscal Year Dates
          </div>
          <!-- /.panel-heading -->
          <div class="panel-body">
            <div class="dataTable_wrapper">
              <table class="table table-striped table-bordered table-hover display" id="dataTables-example">
                <thead>
                  <tr>
                    <th>testdata</th>
                    <th>testdata</th>
                    <th>testdata</th>
                    <th>testdata</th>
                    <th>testdata</th>
                    <th>testdata</th>
                    <th>testdata</th>
                  </tr>
                </thead>
                <tbody>
                  <tr>
                    <td>testdata</td>
                    <td class="align-right">10/1/13</td>
                    <td class="align-right">7/1/13</td>
                    <td class="align-right">7/1/13</td>
                    <td class="align-right">10/1/12</td>
                    <td class="align-right">10/1/13</td>
                    <td class="align-right">10/1/13</td>
                  </tr>
                  <tr>
                    <td>testdata</td>
                    <td class="align-right">9/30/14</td>
                    <td class="align-right">6/30/14</td>
                    <td class="align-right">6/30/14</td>
                    <td class="align-right">9/30/13</td>
                    <td class="align-right">9/30/14</td>
                    <td class="align-right">9/30/14</td>
                  </tr>
                </tbody>
              </table>

            </div>
          </div>
          <!-- /.panel-body -->
        </div>
        <!-- /.panel -->
      </div>
      <!-- /.col-lg-12 -->
    </div>
    <!-- /.row -->

    <!-- .row  -->
    <div class="row">
      <div class="col-lg-12">
        <div class="panel panel-default">
          <div class="panel-heading">
            Income Statement
          </div>
          <!-- /.panel-heading -->
          <div class="panel-body">
            <div class="dataTable_wrapper">
              <table class="table table-striped table-bordered table-hover display" id="dataTables-example">
                <thead>
                  <tr>
                    <th>testdata</th>
                    <th>testdata</th>
                    <th>testdata</th>
                    <th>testdata</th>
                    <th>testdata</th>
                    <th>testdata</th>
                    <th>testdata</th>
                  </tr>
                  <thead>
                    <tbody>
                      <tr>
                        <td>testdata</td>
                        <td class="align-right">$9,365,981</td>
                        <td class="align-right">$906,342,935</td>
                        <td class="align-right">$84,721,081</td>
                        <td class="align-right">$25,517,352</td>
                        <td class="align-right">$19,917,566</td>
                        <td class="align-right">$25,969,753</td>
                      </tr>
                      <tr>
                        <td>testdata</td>
                        <td class="align-right">$48,953,782</td>
                        <td class="align-right">$1,172,748,579</td>
                        <td class="align-right">$288,978,245</td>
                        <td class="align-right">$71,797,156</td>
                        <td class="align-right">$60,472,586</td>
                        <td class="align-right">$79,334,724</td>
                      </tr>
                      <tr>
                        <td>testdata</td>
                        <td class="align-right">$58,319,763</td>
                        <td class="align-right">$2,079,091,514</td>
                        <td class="align-right">$373,699,326</td>
                        <td class="align-right">$97,314,508</td>
                        <td class="align-right">$80,390,152</td>
                        <td class="align-right">$105,304,477</td>
                      </tr>
                      <tr>
                        <td>testdata</td>
                        <td class="align-right">$17,858,041</td>
                        <td class="align-right">$1,206,080,155</td>
                        <td class="align-right">$232,442,441</td>
                        <td class="align-right">$46,783,039</td>
                        <td class="align-right">$34,600,804</td>
                        <td class="align-right">$55,832,703</td>
                      </tr>
                      <tr>
                        <td>testdata</td>
                        <td class="align-right">$40,461,722</td>
                        <td class="align-right">$873,011,359</td>
                        <td class="align-right">$141,256,885</td>
                        <td class="align-right">$50,531,469</td>
                        <td class="align-right">$45,789,348</td>
                        <td class="align-right">$49,471,774</td>
                      </tr>
                      <tr>
                        <td>testdata</td>
                        <td class="align-right">$44,523,416</td>
                        <td class="align-right">$905,003,970</td>
                        <td class="align-right">$139,174,532</td>
                        <td class="align-right">$56,676,758</td>
                        <td class="align-right">$49,188,951</td>
                        <td class="align-right">$55,198,560</td>
                      </tr>
                      <tr>
                        <td>testdata</td>
                        <td class="align-right">-$4,061,694</td>
                        <td class="align-right">-$31,992,611</td>
                        <td class="align-right">$2,082,353</td>
                        <td class="align-right">-$6,145,289</td>
                        <td class="align-right">-$3,399,603</td>
                        <td class="align-right">-$5,726,786</td>
                      </tr>
                      <tr>
                        <td>testdata</td>
                        <td class="align-right">$18,523</td>
                        <td class="align-right">$0</td>
                        <td class="align-right">$0</td>
                        <td class="align-right">$653,760</td>
                        <td class="align-right">$0</td>
                        <td class="align-right">$47,184</td>
                      </tr>
                      <tr>
                        <td>testdata</td>
                        <td class="align-right">$1,846,432</td>
                        <td class="align-right">$854,475</td>
                        <td class="align-right">$0</td>
                        <td class="align-right">$357,147</td>
                        <td class="align-right">$0</td>
                        <td class="align-right">$1,058,756</td>
                      </tr>
                      <tr>
                        <td>testdata</td>
                        <td class="align-right">$0</td>
                        <td class="align-right">$1,993,366</td>
                        <td class="align-right">$0</td>
                        <td class="align-right">$0</td>
                        <td class="align-right">$0</td>
                        <td class="align-right">$0</td>
                      </tr>
                      <tr>
                        <td>testdata</td>
                        <td class="align-right">$2,394,137</td>
                        <td class="align-right">$121,869,720</td>
                        <td class="align-right">-$1,468,370</td>
                        <td class="align-right">$5,722,029</td>
                        <td class="align-right">$3,813,929</td>
                        <td class="align-right">$2,214,932</td>
                      </tr>
                      <tr>
                        <td>testdata</td>
                        <td class="align-right">$4,259,092</td>
                        <td class="align-right">$122,724,195</td>
                        <td class="align-right">-$1,468,370</td>
                        <td class="align-right">$6,732,936</td>
                        <td class="align-right">$3,813,929</td>
                        <td class="align-right">$3,320,872</td>
                      </tr>
                      <tr>
                        <td>testdata</td>
                        <td class="align-right">$0</td>
                        <td class="align-right">$0</td>
                        <td class="align-right">$0</td>
                        <td class="align-right">$0</td>
                        <td class="align-right">$0</td>
                        <td class="align-right">$3</td>
                      </tr>
                      <tr>
                        <td>testdata</td>
                        <td class="align-right">$44,523,416</td>
                        <td class="align-right">$905,003,970</td>
                        <td class="align-right">$139,174,532</td>
                        <td class="align-right">$56,676,758</td>
                        <td class="align-right">$49,188,951</td>
                        <td class="align-right">$55,198,563</td>
                      </tr>
                      <tr>
                        <td>testdata</td>
                        <td class="align-right">$197,398</td>
                        <td class="align-right">$90,731,584</td>
                        <td class="align-right">$613,983</td>
                        <td class="align-right">$587,647</td>
                        <td class="align-right">$414,326</td>
                        <td class="align-right">-$2,405,917</td>
                      </tr>
                      <tr>
                        <td>testdata</td>
                        <td class="align-right">$1,975,319</td>
                        <td class="align-right">$34,951,967</td>
                        <td class="align-right">$8,573,237</td>
                        <td class="align-right">$3,722,219</td>
                        <td class="align-right">$1,551,948</td>
                        <td class="align-right">$2,208,306</td>
                      </tr>
                      <tbody>
              </table>
            </div>
          </div>
          <!-- /.panel-body -->
        </div>
        <!-- /.panel -->
      </div>
      <!-- /.col-lg-12 -->
    </div>
    <!-- /.row -->

    <!-- .row  -->
    <div class="row">
      <div class="col-lg-12">
        <div class="panel panel-default">
          <div class="panel-heading">
            KPIs
          </div>
          <!-- /.panel-heading -->
          <div class="panel-body">
            <div class="dataTable_wrapper">
              <table class="table table-striped table-bordered table-hover display" id="dataTables-example">
                <thead>
                  <tr>
                    <td>testdata</td>
                    <td>testdata</td>
                    <td>testdata</td>
                    <td>testdata</td>
                    <td>testdata</td>
                    <td>testdata</td>
                    <td>testdata</td>
                  </tr>
                </thead>
                <tbody>
                  <tr>
                    <td>testdata</td>
                    <td class="align-right">20</td>
                    <td class="align-right">294</td>
                    <td class="align-right">78</td>
                    <td class="align-right">25</td>
                    <td class="align-right">25</td>
                    <td class="align-right">25</td>
                  </tr>
                  <tr>
                    <td>testdata</td>
                    <td class="align-right">5</td>
                    <td class="align-right">93</td>
                    <td class="align-right">20</td>
                    <td class="align-right">0</td>
                    <td class="align-right">0</td>
                    <td class="align-right">0</td>
                  </tr>
                  <tr>
                    <td>testdata</td>
                    <td class="align-right">25</td>
                    <td class="align-right">387</td>
                    <td class="align-right">98</td>
                    <td class="align-right">25</td>
                    <td class="align-right">25</td>
                    <td class="align-right">25</td>
                  </tr>
                  <tr>
                    <td>testdata</td>
                    <td class="align-right">262</td>
                    <td class="align-right">3,897</td>
                    <td class="align-right">483</td>
                    <td class="align-right">365</td>
                    <td class="align-right">314</td>
                    <td class="align-right">292</td>
                  </tr>
                  <tr>
                    <td>testdata</td>
                    <td class="align-right">508</td>
                    <td class="align-right">18,202</td>
                    <td class="align-right">2,923</td>
                    <td class="align-right">905</td>
                    <td class="align-right">320</td>
                    <td class="align-right">1,681</td>
                  </tr>
                  <tr>
                    <td>testdata</td>
                    <td class="align-right">4,135</td>
                    <td class="align-right">106,400</td>
                    <td class="align-right">12,619</td>
                    <td class="align-right">5,640</td>
                    <td class="align-right">6,068</td>
                    <td class="align-right">6,194</td>
                  </tr>
                  <tr>
                    <td>testdata</td>
                    <td class="align-right">97.0</td>
                    <td class="align-right">67.9</td>
                    <td class="align-right">101.0</td>
                    <td class="align-right">74.0</td>
                    <td class="align-right">73.1</td>
                    <td class="align-right">78.0</td>
                  </tr>
                  <tr>
                    <td>testdata</td>
                    <td class="align-right">8.1</td>
                    <td class="align-right">5.8</td>
                    <td class="align-right">4.3</td>
                    <td class="align-right">6.2</td>
                    <td class="align-right">19.0</td>
                    <td class="align-right">3.7</td>
                  </tr>
                  <tr>
                    <td>testdata</td>
                    <td class="align-right">$40,461,722</td>
                    <td class="align-right">$873,011,359</td>
                    <td class="align-right">$141,256,885</td>
                    <td class="align-right">$50,531,469</td>
                    <td class="align-right">$45,789,348</td>
                    <td class="align-right">$49,471,774</td>
                  </tr>
                  <tr>
                    <td>testdata</td>
                    <td class="align-right">11.3</td>
                    <td class="align-right">291.5</td>
                    <td class="align-right">34.6</td>
                    <td class="align-right">15.5</td>
                    <td class="align-right">16.6</td>
                    <td class="align-right">17.0</td>
                  </tr>
                  <tr>
                    <td>testdata</td>
                    <td class="align-right">45.3%</td>
                    <td class="align-right">75.3%</td>
                    <td class="align-right">35.3%</td>
                    <td class="align-right">61.8%</td>
                    <td class="align-right">66.5%</td>
                    <td class="align-right">67.9%</td>
                  </tr>
                </tbody>

              </table>

            </div>
          </div>
          <!-- /.panel-body -->
        </div>
        <!-- /.panel -->
      </div>
      <!-- /.col-lg-12 -->
    </div>
    <!-- /.row -->


  </div>
  <!-- /#page-wrapper -->

</div>

Related Questions in JAVASCRIPT

Related Questions in JQUERY

Related Questions in TWITTER-BOOTSTRAP

Related Questions in JQUERY-UI-SORTABLE

Popular Questions

Popular Tags

javascript python java c# php android html jquery c++ css ios sql mysql r reactjs node.js arrays c asp.net json python-3.x ruby-on-rails .net sql-server swift django angular objective-c pandas excel

Trending Questions