ExtJS4 JSON data not populating Ext.grid.Panel
===

I've looked at numerous posts regarding this issue, but I'm still having problems for some reason. I have even tried to create a Panel with minimal data, but still no luck. This is really racking my brain. Below is the code that I'm working with:

    Ext.onReady(function () {
        var proxy = new Ext.data.HttpProxy({
            url: path/to/app
            api: {
                load: path/to/app
            }
        });
   

        var reader = new Ext.data.JsonReader({
            successProperty : 'success',
            idProperty      : 'id',
            root            : 'data',
            fields          : [{name:'id', type: 'int'}]
        });

        var writer = new Ext.data.JsonWriter({
            encode: false,
            writeAllFields: true
        });

        var store = new Ext.data.Store({
            autoLoad : true,
            autoSync : true,
            root     : 'data',
            restful  : true,
            fields   : [{name: 'id'}],
            proxy    : proxy,
            reader   : reader,
            writer   : writer
        });

        Ext.create('Ext.grid.Panel', {
            renderTo : 'gadgetview',
            store    : store,
            columns  : [{
                           header    : 'ID',
                           text      : 'ID',
                           dataIndex : 'id',
                           width     : 50
                       }],
            height   : 200,
            width    : 450,
            title    : 'Example'
        });
    });

The response from the server is:

    {"data":[{"id":1}], "success":true}

I'm hoping that it's something that's readily apparent.
