EXTJS Загрузить JSONStore в сетку после асинхронного получения - PullRequest
Новая
       21

EXTJS Загрузить JSONStore в сетку после асинхронного получения

3 голосов
/ 23 ноября 2011

У меня есть магазин JSON, который я хотел бы автоматически загрузить в grid.panel. К сожалению, после завершения асинхронного получения в сетке ничего не заполняется. Firebug показывает, что JSON был успешно получен.

магазин: 

var datasetStore = new Ext.data.JsonStore({
    root: 'rows',
    fields: ['griddap', 'Subset', 'tabledap', 'Make A Graph', 'wms', 'Title', 'Summary', 'Info', 'Background Info', 'RSS', 'Email', 'Institution', 'Dataset ID'],
    proxy: new Ext.data.HttpProxy({
        url: 'http://localhost:8080/proxy.php?u=http://coastwatch.pfeg.noaa.gov/erddap/info/index.json'
        }),
    autoLoad: true
});

сетка: 

var datasetListingGridPanel = new Ext.grid.GridPanel({
        id: 'datasetListingGridPanel',
        preventHeader: true,
        store: datasetStore,
        layout: 'fit',
        viewConfig: {
            forceFit:true,
            fitcontainer:true
        },
        columns: 
        [
            {
                header: 'Dataset Title', 
                dataIndex: 'Title'
            }
        ]
        });

РЕДАКТИРОВАТЬ - JSON 

{
    "table": {
        "columnNames": ["griddap", "Subset", "tabledap", "Make A Graph", "wms", "Title", "Summary", "Info", "Background Info", "RSS", "Email", "Institution", "Dataset ID"],
        "columnTypes": ["String", "String", "String", "String", "String", "String", "String", "String", "String", "String", "String", "String", "String"],
        "rows": [
            ["", "", "", "", "", "", "", "", "", "", "", "", ""],
            ["", "", "", "", "", "", "", "", "", "", "", "", ""]
         ]
    }
}

Я вынул значения, так как они были очень длинными.

Есть идеи, что происходит не так?

Ответы [ 2 ]

3 голосов
/ 11 декабря 2012

Это потому, что загрузка магазина асинхронная.Таким образом, сетка загружает в первую очередь и, наконец, хранилища, в которых требуются данные для сетки.

Это обсуждение может быть полезным для вас: http://www.sencha.com/forum/showthread.php?119836-Store-asynchronous-loading-and-Form-loading/page2

Использование функции обратного вызова может бытьрешение для вас тоже: 

yourStore.load({  
  callback: function() {  
    //here you can be sure that the store is loaded.  
    }  
});
3 голосов
/ 23 ноября 2011

Поскольку вы используете JsonStore, очевидно, что вы все еще используете ExtJS-3 (а не 4), и поэтому следующая ссылка по-прежнему актуальна:

http://www.sencha.com/learn/grid-faq/

При этом, глядя на ваш JSON, проблема в том, что указанный вами корень, "строки", не является свойством уровня top : скорее он вложен в свойство "таблицы" .

Также см .: extJS: чтение вложенного JSON

Что, в свою очередь, ссылается на это: http://docs.sencha.com/ext-js/3-4/#!/api/Ext.data.JsonReader

Ниже представлен ряд опций:

  1. Переключить код на стороне сервера, который возвращает JSON, чтобы возвращать данные со строками в качестве свойства верхнего уровня
  2. Сделайте Ajax-вызов для данных, проанализируйте их вручную, а затем отправьте в свой магазин
  3. Расширить (или найти существующее расширение) необходимый компонент ExtJS (JsonReader?), Чтобы он мог работать с данными как есть, но, возможно, вы можете указать свойство root как «table.rows»
...