На работе мы проделали большую работу с CakePHP и ExtJS.
Наши представления, использующие только ExtJS, имеют только вызовы для включения конкретного файла javascript для этого представления и один div для отображения модуля ExtJS.
Если вы используете <?php echo $scripts_for_layout ?>
в заголовке вашего макета, вы можете легко добавлять отдельные файлы javascript изнутри вашего просмотра, используя
<?php echo $this->Html->script('relative/path/from/js/folder.js', array('inline' => false)) ?>
В Ext выВы захотите настроить свою сетку на использование экземпляра Ext.data.Store
, через хранилище и его зависимости (вам также понадобятся прокси, читатель и записывающее устройство), вы можете отправлять данные туда и обратно на контроллеры CakePHP.
Мы предпочитаем использовать JSON для наших данных, поскольку ими легко манипулировать и сохранять их там, где они нам нужны.
Наша базовая настройка обычно выглядит следующим образом.
В ExtJS
var proxy = new Ext.data.HttpProxy({
api: {
// these will map to cakephp controller actions
create: { url: '/cake_controller/create', method: 'POST' },
read: { url: '/cake_controller/read', method: 'GET' },
update: { url: '/cake_controller/update', method: 'POST' },
destroy: { url: '/cake_controller/destroy', method: 'POST' }
}
});
var fields = Ext.data.Record.create([
// this will map to your database fields (or at least the ones your
// returning from cakephp to put in your grid
{ name: 'id', type: 'int' },
{ name: 'another_model_field' },
{ name: 'created', type: 'date', dateFormat: 'Y-m-d H:i:s' },
{ name: 'modified', type: 'date', dateFormat: 'Y-m-d H:i:s' },
]);
var reader = Ext.data.JsonReader({
root: 'controllerName' // this is the root node of the json cakephp is replying with
}, fields);
var writer = Ext.data.JsonWriter({
encoded: true,
writeAllFields: true
});
var store = Ext.data.Store({
storeId: 'myStore',
proxy: proxy,
reader: reader,
writer: writer,
autoSave: true,
autoLoad: true
});
Затем в вашей сетке установите магазин на тот, который вы только что создали
var grid = Ext.grid.GridPanel({
store: store,
...
...
...
});
Каждый раз, когда хранилище изменяется, оно вызывает соответствующий метод API (создание, чтение, обновление)., уничтожь) которая является картойследите за действиями вашего контроллера CakePHP.Внутри ваших действий вы можете получить доступ к данным через $this->params['form']
.Если вы используете Json, как мы, вы можете декодировать его в ассоциативный массив, используя json_decode($this->params['form'], true)
для легкой манипуляции / постоянства на стороне CakePHP.
Вы можете возвращать определенные вещи из ваших действий CakePHP, чтобы ExtJS зналбыло ли сохранение / обновление / и т.д. прошло успешно.Обычно мы просто возвращаем array('success' => true)
, закодированный в Json.
Я надеюсь, что это поможет вам начать, это много, но это не тонна работы, а просто набор текста.Легко запомнить, как только вы сделали это несколько раз.
Всякий раз, когда вы работаете с ExtJS, помните, что документы ваши друзья!