+++ /dev/null
-<html>\r
-<head>\r
- <title>The source code</title>\r
- <link href="../resources/prettify/prettify.css" type="text/css" rel="stylesheet" />\r
- <script type="text/javascript" src="../resources/prettify/prettify.js"></script>\r
-</head>\r
-<body onload="prettyPrint();">\r
- <pre class="prettyprint lang-js">// Application instance for showing user-feedback messages.
-var App = new Ext.App({});
-
-// Create HttpProxy instance. Notice new configuration parameter "api" here instead of load. However, you can still use
-// the "url" paramater -- All CRUD requests will be directed to your single url instead.
-var proxy = new Ext.data.HttpProxy({
- api: {
- read : 'app.php/users/view',
- create : 'app.php/users/create',
- update: 'app.php/users/update',
- destroy: 'app.php/users/destroy'
- }
-});
-
-// Typical JsonReader. Notice additional meta-data params for defining the core attributes of your json-response
-var reader = new Ext.data.JsonReader({
- totalProperty: 'total',
- successProperty: 'success',
- idProperty: 'id',
- root: 'data'
-}, [
- {name: 'id'},
- {name: 'email', allowBlank: false},
- {name: 'first', allowBlank: false},
- {name: 'last', allowBlank: false}
-]);
-
-// The new DataWriter component.
-var writer = new Ext.data.JsonWriter({
- encode: true,
- writeAllFields: false
-});
-
-// Typical Store collecting the Proxy, Reader and Writer together.
-var store = new Ext.data.Store({
- id: 'user',
- proxy: proxy,
- reader: reader,
- writer: writer, // <-- plug a DataWriter into the store just as you would a Reader
- autoSave: true, // <-- false would delay executing create, update, destroy requests until specifically told to do so with some [save] buton.
- listeners: {
- write : function(store, action, result, res, rs) {
- App.setAlert(res.success, res.message); // <-- show user-feedback for all write actions
- },
- exception : function(proxy, type, action, options, res, arg) {
- if (type === 'remote') {
- Ext.Msg.show({
- title: 'REMOTE EXCEPTION',
- msg: res.message,
- icon: Ext.MessageBox.ERROR,
- buttons: Ext.Msg.OK
- });
- }
- }
- }
-});
-
-
-// A new generic text field
-var textField = new Ext.form.TextField();
-
-// Let's pretend we rendered our grid-columns with meta-data from our ORM framework.
-var userColumns = [
- {header: "ID", width: 40, sortable: true, dataIndex: 'id'},
- {header: "Email", width: 100, sortable: true, dataIndex: 'email', editor: textField},
- {header: "First", width: 50, sortable: true, dataIndex: 'first', editor: textField},
- {header: "Last", width: 50, sortable: true, dataIndex: 'last', editor: textField}
-];
-
-// load the store immeditately
-store.load();
-
-
-Ext.onReady(function() {
- Ext.QuickTips.init();
-
- // create user.Form instance (@see UserForm.js)
- var userForm = new App.user.Form({
- renderTo: 'user-form',
- listeners: {
- create : function(fpanel, data) { // <-- custom "create" event defined in App.user.Form class
- var rec = new userGrid.store.recordType(data);
- userGrid.store.insert(0, rec);
- }
- }
- });
-
- // create user.Grid instance (@see UserGrid.js)
- var userGrid = new App.user.Grid({
- renderTo: 'user-grid',
- store: store,
- columns : userColumns,
- listeners: {
- rowclick: function(g, index, ev) {
- var rec = g.store.getAt(index);
- userForm.loadRecord(rec);
- },
- destroy : function() {
- userForm.getForm().reset();
- }
- }
- });
-});
-</pre> \r
-</body>\r
-</html>
\ No newline at end of file
git.ithinksw.org / extjs.git / blobdiff