Error filling in html table with JSON

This is my HTML table

<div class="modal-body"> <!--EMPIEZA BODY DEL MODAL -->
                             <div class="panel-body">
                                <table async="async" width="100%" class="table table-striped table-bordered table-hover" id="dataTables-example">
                                    <thead>
                                        <tr>
                                            <th> # </th>
                                            <th> PART NUMBER </th>
                                        </tr>
                                    </thead>
                                    <tbody id="contenido">
                                    </tbody>
                                </table>
                        </div><!--TERMINA BODY DEL MODAL -->

This is the JS, I open a modal and fill it with a JSON

$('#myModal').modal('show');

    $.each(json, function (index, value) {
        $("#contenido")
    .append("<tr><td>" + value.Row + "</td><td>" + value.Row2+ "</td></tr>");
    });

And this is the detail: link (I could not load the image here), but the detail is that the table does not detect the records, I can not show 10 only for example , I can not change pages when they are more than 10, I do not mark the records there are, etc ..