Search code examples
javascriptyui

Dynamically update dataTable Row Count


I'm trying to update the row_count of my dataTable upon retrieval of data

I create an empty dataTable and render it myDiv:

var dataTable = new Y.DataTable({
            columns: columns,
            footerView:   Y.FooterView,  
            footerConfig: {
                fixed:   true,
                heading: {
                    colspan:    3,
                    content:    "Number Records : {row_count}  "
                }
            }
        }).render("#myDiv");

On the click of a button, the dataTable gets populated by an IO request.

var node = Y.one('#searchButton');
node.on(
            'click', 
            function() {
            dataSource = new Y.DataSource.IO({source:'mySource'});
            ...
            //code to set data in dataTable
            ...
            size = dataTable.data.size(); //retrieves the number of records, but row_count in the footer of course remains '0'

How could I dynamically update the footerView content's 'row_count' to reflect size?


Solution

  • Rendering my table on 'click' of #searchButton fetches the number of rows and displays them within the table:

    var node = Y.one('#searchButton');
    node.on(
        ...
        dataTable.render("#myDiv"); //renders the table to the Div, # of records and all