Upgrade to ExtJS 3.1.0 - Released 12/16/2009
[extjs.git] / examples / writer / writer.html
1 <html>
2 <head>
3 <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
4 <title>Grid with DataWriter Example</title>
5
6 <link rel="stylesheet" type="text/css" href="../../resources/css/ext-all.css" />
7
8     <!-- GC -->
9      <!-- LIBS -->
10      <script type="text/javascript" src="../../adapter/ext/ext-base.js"></script>
11      <!-- ENDLIBS -->
12
13     <script type="text/javascript" src="../../ext-all.js"></script>
14     <script type="text/javascript" src="../shared/extjs/App.js"></script>
15     <script type="text/javascript" src="writer.js"></script>
16     <script type="text/javascript" src="UserForm.js"></script>
17     <script type="text/javascript" src="UserGrid.js"></script>
18
19     <!-- Common Styles for the examples -->
20     <link rel="stylesheet" type="text/css" href="../shared/examples.css" />
21     <link rel="stylesheet" type="text/css" href="../shared/icons/silk.css" />
22 </head>
23 <body>
24 <script type="text/javascript" src="../shared/examples.js"></script><!-- EXAMPLES -->
25 <h1>Ext.data.DataWriter Example</h1>
26 <p>This example shows how to implement a Writer for your Store.  A Writer-enabled Store frees you from having to manually compose Ajax requests
27 to perform CRUD actions on a Store.</p>
28 <p>Note that the js is not minified so it is readable. See <a href="writer.js">writer.js</a>, <a href="UserForm.js">UserForm.js</a> and
29 <a href="UserGrid.js">UserGrid.js</a>.</p>
30
31 <p>The HttpProxy plugged into the store in this example uses the new <em>api</em> configuration instead of an <em>url</em>.
32 A simple MVC-like php backend has been created for this example which simulates a database by storing records in $_SESSION.  See the file /remote/app/controllers/users.php.  You may have to configure
33 your web-server to allow scripts to be executed in the /examples directory.</p>
34
35 <code><pre>
36 var proxy = new Ext.data.HttpProxy({
37     api: {
38         read    : 'app.php/users/read',
39         create  : 'app.php/users/create',
40         update  : 'app.php/users/update',
41         destroy : 'app.php/users/destroy'
42     }
43 });
44 </pre></code>
45
46 <p>Take note of the requests being generated in Firebug as you interact with the Grid and Form.</p>
47
48 <p>An <b>Error has been simulated</b> on the server-side:  Attempting to update a record having ODD-numbered id will generate this errror.
49 Responses from the update action will have successProperty === false along with a message.  This error can be handled by
50 listening to the <b>"exception"</b> event upon your Store.</p>
51
52 <code><pre>
53 exception : function(proxy, type, action, options, res, arg) {
54     if (type === 'remote') {
55         Ext.Msg.show({
56             title: 'REMOTE EXCEPTION',
57             msg: res.message,
58             icon: Ext.MessageBox.ERROR
59         });
60     }
61 }
62 </pre></code>
63 <p><b>Note: This new "exception" event supercedes the old loadexception event which is now deprecated.</b></p>
64
65 <div class="container" style="width:500px">
66     <div id="user-form"></div>
67     <div id="user-grid"></div>
68 </div>
69
70 </body>
71 </html>