<div class="col-xs-12 col-md-6">
                            <div class="well with-header">
                                <div class="header bordered-primary">
                                    <i id="topproducts_spinner" style="display: none;" class="fa fa-spinner fa-spin"></i>
                                    <?php echo $this->lang->line("TOPPRODUCTS"); ?>
                                </div>
                                <div class="table-scrollable">
                                    <table class="table table-striped table-bordered table-hover databox-text">
                                        <thead>
                                            <tr>
                                                <th scope="col" style="width:30% !important">
                                                    <?php echo $this->lang->line("PRODUCT"); ?>
                                                </th>
                                                <th scope="col" style="text-align: center; width:10% !important">
                                                    <?php echo $this->lang->line("UNITS"); ?>
                                                </th>
                                                <th scope="col" style="text-align: center; width:10% !important">
                                                    <?php echo $this->lang->line("TOTAL"); ?>
                                                </th>
                                            </tr>
                                        </thead>
                                        <tbody id="topproducts">
                                            
                                            
                                        </tbody>
                                    </table>
                                </div>
                                
                            </div>

                        </div>

<script>
$(document).ready(function() {
$("#topproducts_spinner").show();
        $.ajax({ url: "<?= base_url() ?>dashboard/databoxes/topproducts",
                    data: { count: <?= $count ?>},
                    dataType: "json",
                    type: "POST",
                    success: function(data){
                        var html = '';
                var len = data.length;
                for (var i = 0; i< len; i++) {
                 
            html+="<tr style='font-size: 12px'>"+
                    "<td>"+data[i].name+"</td>"+
                    "<td style='text-align: center'>"+data[i].units+"</td>"+
                    "<td style='text-align: right'>"+data[i].total+"</td>"+
                "</tr>";
            
            
                }
                $("#topproducts").append(html);
                $("#topproducts_spinner").hide();
                    }
                });
    
});
</script>