ExtJS 5.1, grid load data from database with PHP - php

Question

I am doing an online course of Ext JS 5.1 and in this exercise I have a service.php file which connects to database and returns JSON Data. I try to show this data but it never gets displayed (doesn't show any error message in firebug) and I can`t find what is the problem with the code.
This is the code of the store:
var storeUsuario = Ext.create('Ext.data.Store', {
model : 'js.clase.Usuario',
proxy: {
type: 'rest',
url: 'service.php?method=getUsuarios',
reader: {
type: 'json',
}
},
autoLoad: true
});
This is the code of the grid:
Ext.create('Ext.grid.Panel', {
renderTo: Ext.getBody(),
store: storeUsuario,
width: 600,
height: 400,
title: 'Grid Usuarios',
columns: [
     {
text: 'id',
dataIndex: 'id'
},{
            text: 'nombre',
            width: 100,
            dataIndex: 'nombre'          
},{
        text: 'apellidos',
        dataIndex: 'apellidos'
},{
        text: 'email',
        dataIndex: 'email'
},{
        text: 'nacionalidad',
        dataIndex: 'nacionalidad'
},{
        text: 'rutaAvatar',
        dataIndex: 'rutaAvatar'
}
]
});
and the service.php method:
<?php
header('Content-Type: text/html; charset=utf-8');
$conexion = mysql_connect("127.0.0.1", "root", "");
mysql_select_db("usertest", $conexion);
$method = $_GET['method'];
switch($method) {
case "getUsuarios":
$query = "SELECT * FROM Usuario ORDER BY id ASC";
$result = mysql_query($query, $conexion) or die(mysql_error());
$numRows = mysql_num_rows($result);
$usuarios = array();
if ($numRows > 0) {
$i = 0;
while ($row = mysql_fetch_assoc($result)) {
$usuarios[$i] = $row;
$i++;
}
}
$usuariosJSON = json_encode($usuarios);
echo $usuariosJSON;
break;
}
?>

Answer 1

Your PHP code doesn't return a valid JSon.
See this fiddle works correctly: https://fiddle.sencha.com/#fiddle/q9k

Answer 2

According to this post you should specify the header.
And I suggest you to return a "hand formed" json like this:
$data = /** whatever you're serializing **/;
$data_length = /* the length of the result according to the request response */;
header('Cache-Control: no-cache, must-revalidate'); // just to be sure
header('Content-Type: application/json');
echo "{ \"success\": true, \"total\": $data_length, \"records\": " . json_encode($data) . " }";
The json data could need []...
echo "{ \"success\": true, \"total\": $data_length, \"records\": [ " . json_encode($data) . " ] }";