How to get the total number of rows in DataTables using Jquery in JSP

Question

I am using a datatable in my application. When loading the page i need to display the number of rows of the table in a span. I am using table.data().count() to get the count of the rows. But its not giving correct value.

JSP:

<table id="example" class="" cellspacing="0" width="100%" style="padding: 10px">
<thead>
    <tr>
        <!-- <th>S No</th> -->
        <th>Doc Id</th>
        <th id="Position">Geo</th>
        <th id="Position">Practice</th>
        <th id="Position">Opportunity Id</th>
        <th id="Position">Reference Id</th>
        <th id="Position">Status</th>
    </tr>
</thead>
<tbody>
</tbody>
</table>

Jquery:

var table = $('#example').DataTable();
$(document).ready(function() {
                            var rowCount = table.data().count();
                            alert(rowCount);
                            });

davidkonrad · Accepted Answer · 2017-10-30 06:28:10Z

6

First of all, you cannot rely on ready() being executed after the table is initialised. It is rare the ready() construct is actually needed or even useful, and when people think they need it, it is often the side effect of bad design. I have literally seen hundreds of posts here on SO where people have problems caused by peculiar nested ready() scopes, and most of the times the only reason for the use of ready() is "tradition" or "just to be sure", i.e cargo cult programming.

Secondly there is no count() method on data(). There is, but this is because data() in fact is returning an API, the data as an array with API methods attached.

So use Array.length to get the number of rows, and place the code inside dataTables initComplete callback :

var table = $('#example').DataTable({
   initComplete: function() {
      $('#count').text( this.api().data().length )
   }
})

the markup could look like this :

<p id="count"></p>

http://jsfiddle.net/f9zq9gn8/

edited Oct 30, 2017 at 6:28

answered Oct 30, 2017 at 5:29

davidkonrad

85.7k17 gold badges211 silver badges273 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Shanmugapriya Over a year ago

thank u for your answer. Now the problem has been solved. But now i need to know how to pass the value of the row to an jsp tag?? I set the value of the count to a variable. i don't know how to pass that to a <p> tag. Please help

davidkonrad Over a year ago

@Shanmugapriya, it all run client side, after the page is loaded, so you just need javascript (jQuery for convenience). I dont know how your tag looks like, but have updated with an example. Add an id to the tag you want to place the row count, that should be all. It does not have to be a <p> tag, it could be <span>, <em> or similar.

TheAlphaGhost Over a year ago

This not right answer. If paging is true, the result are always the pageLength result if more items as pageLengthexist. If i have 200 items, and pageLength = 100, then your length are 100, not 200.

MyChickenNinja · Accepted Answer · 2023-05-26 04:48:11Z

0

To build on davidkonrad's answer, but keeping the function to datatables:

    let table = $('#example').DataTable({
        "ajax": {
            //Do your ajax stuff to get your data
        },
        initComplete: function () {
            //After the ajax has run, initComplete can get the total count of lines .
            console.log(table.data().count())
        }
    });

This was the only thing that worked for me.

Keep in mind that this only works on the content within the currently loaded table. If you use pagination, you're going to need to make an additional call to your backend.

edited May 26, 2023 at 4:48

answered Jul 2, 2021 at 8:03

MyChickenNinja

311 silver badge5 bronze badges

2 Comments

TheAlphaGhost Over a year ago

Thats not the right answer. If paging is true, the result are always the pageLength result if more items as pageLengthexist. If i have 200 items, and pageLength = 100, then your length are 100, not 200.

MyChickenNinja Over a year ago

@TheAlphaGhost yes technically true. However OP wasnt asking for that. And in that case you would need to make an additional call to the backend. Ive amended my post to indicate its only for data in the current table and wont be helpful for pagination tables.

Collectives™ on Stack Overflow

How to get the total number of rows in DataTables using Jquery in JSP

2 Answers 2

3 Comments

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related