Ajax or json can not restart, does not show the MySQL select in the table

I get these errors does not let me see all the data in the table. but yes in JSON

THIS DOES WORK SEPARATELY

 <?php

$db_host = "localhost";
$db_user = "root";
$db_pass = "";
$db_name = "mva_colegio";

$conectahugo = new mysqli($db_host, $db_user, $db_pass, $db_name);



$sql = "SELECT * FROM mva_servicios  WHERE estado_p = 1 ORDER BY  id_prod DESC;";
$resultado = mysqli_query($conectahugo, $sql);

//si no hay reultado imprimimos que diga error
if (!$resultado) {
    die('Error no hay datos');
}else{
    while ($data = mysqli_fetch_assoc($resultado)) {
        $arreglo["data"][]= $data;
    }
//pasamos los datos json
    echo json_encode($arreglo);
}

mysqli_free_result($resultado);


mysqli_close($conectahugo);


?>

this works, but not this, what will be the error?

 <table id="dataalumnos" class="table table-hover">  
    <thead bgcolor="#eeeeee" align="center">
        <tr>
            <th>Carné</th>
            <th>Alumno </th>
            <th>Dirección </th>
            <th>Tel</th>
            <th>Encargado </th>
            <th>Registrado</th>
            <th class="text-center"> Acciones </th> 
        </tr>
   </thead>
 </table>
      </div> </div>
     </div>
 </div>


<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<!-- Include all compiled plugins (below), or include individual files as needed -->
<script src="bootstrap-3.3.7/js/bootstrap.min.js"></script>  
<script src="datatables/js/jquery.dataTables.min.js"></script>
<script src="datatables/js/dataTables.bootstrap.min.js"></script>

    <script>


    var listar = function(){
        var table = $("#dataalumnos").DataTable({

            "ajax":{
                "method":"POST",
                "url":"listar_servicios.php"
            },
            "columns":[
                {"data":"id_prod"},
                {"data":"descripcion_p"},
                {"data":"tipo_p"},
                {"data":"precio_p"},
                {"data":"estado_p"}
            ]
        });
    }


</script>



    <script>
        $(document).ready(function(){
            listar();
    $('#dataalumnos').DataTable({
        language: {
            "sProcessing":     "Procesando...",
    "sLengthMenu":     "Mostrar _MENU_ registros",
    "sZeroRecords":    "No se encontraron resultados",
    "sEmptyTable":     "Ningún dato disponible en esta tabla",
    "sInfo":           "Mostrando registros del _START_ al _END_ de un total de _TOTAL_ registros",
    "sInfoEmpty":      "Mostrando registros del 0 al 0 de un total de 0 registros",
    "sInfoFiltered":   "(filtrado de un total de _MAX_ registros)",
    "sInfoPostFix":    "",
    "sSearch":         "Buscar:",
    "sUrl":            "",
    "sInfoThousands":  ",",
    "sLoadingRecords": "Cargando...",
    "oPaginate": {
        "sFirst":    "Primero",
        "sLast":     "Último",
        "sNext":     "Siguiente",
        "sPrevious": "Anterior"
    },
    "oAria": {
        "sSortAscending":  ": Activar para ordenar la columna de manera ascendente",
        "sSortDescending": ": Activar para ordenar la columna de manera descendente"
    }
        }
    });
});


    </script>





</body>
</html>

What will be the Error?