| <!DOCTYPE HTML> |
| <html lang="en"> |
| <head> |
| <meta charset="utf-8"> |
| <title>MySports: DataGrid</title> |
| <link rel="stylesheet" |
| href="http://ajax.googleapis.com/ajax/libs/dojo/1.7.1/dojo/resources/dojo.css"> |
| <link rel="stylesheet" |
| href="http://ajax.googleapis.com/ajax/libs/dojo/1.7.1/dijit/themes/claro/claro.css"> |
| <link rel="stylesheet" |
| href="http://ajax.googleapis.com/ajax/libs/dojo/1.7.1/dojox/grid/resources/claroGrid.css"> |
| |
| <script |
| src="http://ajax.googleapis.com/ajax/libs/dojo/1.7.1/dojo/dojo.js" |
| data-dojo-config="isDebug: true,parseOnLoad: true"> |
| |
| </script> |
| <script type="text/javascript" src="division-teams-tree.js"> |
| |
| </script> |
| <script> |
| var grid, store, dataStore; |
| require( |
| [ "dojox/grid/DataGrid", "dojo/store/Memory", |
| "dojo/data/ObjectStore", "dojo/_base/xhr", "dojo/domReady!" ], |
| |
| function(DataGrid, Memory, ObjectStore, xhr) { |
| xhr |
| .get( |
| { |
| url : "../persistence/mysports-HTHL/query/Player.findByTeam;team=2", |
| handleAs : "json", |
| headers : { |
| "Accept" : "application/json" |
| }, |
| contentType : "application/json" |
| }).then(function(data) { |
| store = new Memory({ |
| data : data |
| }); |
| |
| dataStore = new ObjectStore({ |
| objectStore : store |
| }); |
| |
| grid = new DataGrid({ |
| store : dataStore, |
| query : { |
| id : "*" |
| }, |
| structure : [ { |
| cells : [ { |
| name : "ID", |
| field : "id" |
| }, { |
| name : "First Name", |
| field : "firstName" |
| }, { |
| name : "Last Name", |
| field : "lastName" |
| }, { |
| name : "Number", |
| field : "number" |
| } ] |
| } ] |
| }, "grid"); |
| |
| // since we created this grid programmatically, call startup to render it |
| grid.startup(); |
| }); |
| }); |
| </script> |
| </head> |
| <body class="claro"> |
| <table width="100%" cellpadding="20" cellspacing="20"> |
| <tr> |
| <td><img src="../images/mysports.png"></td> |
| <td width="100%" align="right">User: <input name="login" |
| type="text"> Password: <input name="login" type="text"> |
| <button id="login hidden="true">Login</button> |
| </td> |
| </tr> |
| |
| |
| <tr> |
| <td colspan="2" valign="top"> |
| <h1>MySports: Ottawa Soccer League</h1> |
| </td> |
| </tr> |
| |
| <tr> |
| <td height="500" width="150" valign="top"> |
| <h2>Divisions</h2> |
| <div id="tree" /> |
| <p align="center"> |
| <button id="add-new-child" hidden="true">Add</button> |
| </p> |
| </td> |
| |
| <td valign="middle" align="left" width="100%"> |
| <h2 id="team-name-header"> </h2> |
| <div id="grid" /> |
| </td> |
| </tr> |
| </table> |
| |
| |
| </body> |
| </html> |