DataTable不能像我在CodeIgniter中预期的那样工作

I'm starting with CodeIgniter and i'm not getting the dataTable works. I have the following peace of page:

<table class="table table-striped table-bordered table-hover dataTables_default" id="dataTables-example">
                                    <thead>
                                        <tr>
                                            <th></th>
                                            <th>Título</th>
                                            <th>Conteúdo</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        <?php foreach($rows as $row){ ?>
                                           <tr class="odd gradeX">
                                            <td></td>
                                            <td><?= $row->titulo ?></td>
                                            <td><?= $row->conteudo ?></td>
                                         </tr>
                                        <?php } ?>

                                    </tbody>
                                </table>

Important: I'm using the admin template: http://ironsummitmedia.github.io/startbootstrap-sb-admin-2/pages/tables.html

My table page is exactly equal above link, but i want to insert more features, like: pagitation and filter.

I tried to insert in sb-admin-2.js the following:

$(function() {

    $('#side-menu').metisMenu();

    //this was add
    $('#dataTables-example').dataTable();

}); 

But it made no effect. I tried put a alert() message in my javascript but this alert is never called, see:

$(function() {

        $('#side-menu').metisMenu();

       alert('im here');
    }); 

My sb-admin-2.js file is imported in end of page, i saw in source code of browser (CTRL+U in Google Chrome). So what's is wrong ? Why alert() is not called and dataTable changes don't make any effect.

Edit 1

I don't know if can help to solve my problem, but in browser console i'm getting the error:

Uncaught Error: Graph container element not found    morris.min.js:6

I think this is error is just because i'm not showing any graph in this page and javascript function is trying call the graph.

In the file morris-data.js remove the following code:

$(function() {

});

then, make sure morris-data.js only contains the following code:

    Morris.Area({
    element: 'morris-area-chart',
    data: [{
        period: '2010 Q1',
        iphone: 2666,
        ipad: null,
        itouch: 2647
    }, {
        period: '2010 Q2',
        iphone: 2778,
        ipad: 2294,
        itouch: 2441
    }, {
        period: '2010 Q3',
        iphone: 4912,
        ipad: 1969,
        itouch: 2501
    }, {
        period: '2010 Q4',
        iphone: 3767,
        ipad: 3597,
        itouch: 5689
    }, {
        period: '2011 Q1',
        iphone: 6810,
        ipad: 1914,
        itouch: 2293
    }, {
        period: '2011 Q2',
        iphone: 5670,
        ipad: 4293,
        itouch: 1881
    }, {
        period: '2011 Q3',
        iphone: 4820,
        ipad: 3795,
        itouch: 1588
    }, {
        period: '2011 Q4',
        iphone: 15073,
        ipad: 5967,
        itouch: 5175
    }, {
        period: '2012 Q1',
        iphone: 10687,
        ipad: 4460,
        itouch: 2028
    }, {
        period: '2012 Q2',
        iphone: 8432,
        ipad: 5713,
        itouch: 1791
    }],
    xkey: 'period',
    ykeys: ['iphone', 'ipad', 'itouch'],
    labels: ['iPhone', 'iPad', 'iPod Touch'],
    pointSize: 2,
    hideHover: 'auto',
    resize: true
});

For info on Uncaught Error: Graph container element not found, see https://github.com/morrisjs/morris.js/issues/137

Hope this helps in making your datatables work.