commit extjs-2.2.1
[extjs.git] / examples / grid / from-markup.html
1 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">\r
2 <html>\r
3 <head>\r
4 <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">\r
5 <title>From Markup Grid Example</title>\r
6 <link rel="stylesheet" type="text/css" href="../../resources/css/ext-all.css" />\r
7 <!-- GC -->\r
8         <!-- LIBS -->\r
9         <script type="text/javascript" src="../../adapter/ext/ext-base.js"></script>\r
10         <!-- ENDLIBS -->\r
11 \r
12 <script type="text/javascript" src="../../ext-all.js"></script>\r
13 <script type="text/javascript" src="from-markup.js"></script>\r
14 <link rel="stylesheet" type="text/css" href="grid-examples.css" />\r
15 <!-- Common Styles for the examples -->\r
16 <link rel="stylesheet" type="text/css" href="../shared/examples.css" />\r
17 <style type="text/css">\r
18 #the-table { border:1px solid #bbb;border-collapse:collapse; }\r
19 #the-table td,#the-table th { border:1px solid #ccc;border-collapse:collapse;padding:5px; }\r
20 </style>\r
21 </head>\r
22 <body>\r
23 <script type="text/javascript" src="../shared/examples.js"></script><!-- EXAMPLES -->\r
24 <h1>From Markup Grid Example</h1>\r
25 <p>This example shows how to create a grid with from an existing, unformatted HTML table.</p>\r
26 <p>Note that the js is not minified so it is readable. See <a href="from-markup.js">from-markup.js</a>.</p>\r
27 <button id="create-grid" type="button">Create grid</button>\r
28 <br />\r
29 <br />\r
30 <table cellspacing="0" id="the-table">\r
31         <thead>\r
32             <tr style="background:#eeeeee;">\r
33                 <th>Name</th>\r
34                 <th>Age</th>\r
35                 <th>Sex</th>\r
36             </tr>\r
37         </thead>\r
38         <tbody>\r
39             <tr>\r
40                 <td>Barney Rubble</td>\r
41                 <td>32</td>\r
42                 <td>Male</td>\r
43             </tr>\r
44             <tr>\r
45                 <td>Fred Flintstone</td>\r
46                 <td>33</td>\r
47                 <td>Male</td>\r
48             </tr>\r
49             <tr>\r
50                 <td>Betty Rubble</td>\r
51                 <td>32</td>\r
52                 <td>Female</td>\r
53             </tr>\r
54             <tr>\r
55                 <td>Pebbles</td>\r
56                 <td>1</td>\r
57                 <td>Female</td>\r
58             </tr>\r
59             <tr>\r
60                 <td>Bamm Bamm</td>\r
61                 <td>2</td>\r
62                 <td>Male</td>\r
63             </tr>\r
64         </tbody>\r
65     </table>\r
66 \r
67 </body>\r
68 </html>