One of my long time goals has been to be able to easily display tournament brackets on the web. It seems to be a difficult problem to solve with lots of questions out there, and few answers. There are a few solutions, but they have various issues and downfalls.

I decided to give it another try myself. And this is what I have come up with: A bracket builder, a saved file with raw data, and a bracket viewer that can read the files. If all that sounds like too much, the bracket builder can just spit out the HTML code to display the tree.

I’ve outlined how it works, uploaded an example and have provided a download so you can integrate it with your own applications.

Those references are for the app I had built around the bracket creator to prevent people from making changes unauthenticated. You can simply:
* comment out/delete lines 4 - 16 in treesetup.php
* Add define('SAVED_TREES','/path/on/your/server/the/web/server/can/write/to'); before line 19.
* Remove line 269 in treesetup.php (That is just an include to my navigation for the app)

* In bracketviewer.php you need to change line 3 to point to the path defined in point 2 above.
* You also need to update the paths in line 414, 415, and 416 to where you place the javascript files.

I removed the link because it didn’t work and seemed to send viewer to a bunch of ads.

However, I do know what the problem is, I had the same problem the other day when I was moving some files around. You need to modify the source code includes in the scripts to point to the location on your server where the javascript files are located, or if this is correct, you need to enable javascript.

By default when the page loads, it creates a small box like you noticed. When the javascript executes (which happens automatically when javascript is enabled) it expands the box and displays the trees correctly. So check your paths, that is most likely the source of your problem.

As for the viewer, you need to make sure the parameter in the URL is set to the filename of a valid file. For example: ?file=2011-preseason-mens-consolation at the end of your bracket viewer url. It is the file name minus any extension. Also, the files must be stored in the directory that is specified and readable by the web server.

I noted some of the changes in my second comment above that you will need to make to the files for it to work on your server.