In short, if the following line exists in your web.config, REMOVE IT!!!
<xhtmlConformance mode="Legacy" />
It is in confiugration\system.web.
By default when you convert a VS2003 web project to VS3005, the legacy switch is added to your web.config automatically. I have found some background information about this magical line (click here).
I can't remember where did I find this so I cannot put the reference here.
function Hashtable(){
this.clear = hashtable_clear;
this.containsKey = hashtable_containsKey;
this.containsValue = hashtable_containsValue;
this.get = hashtable_get;
this.isEmpty = hashtable_isEmpty;
this.keys = hashtable_keys;
this.put = hashtable_put;
this.remove = hashtable_remove;
this.size = hashtable_size;
this.toString = hashtable_toString;
this.values = hashtable_values;
this.hashtable = new Array();
}
/*=======Private methods for internal use only========*/
function hashtable_clear(){
this.hashtable = new Array();
}
function hashtable_containsKey(key){
var exists = false;
for (var i in this.hashtable) {
if (i == key && this.hashtable[i] != null) {
exists = true;
break;
}
}
return exists;
}
function hashtable_containsValue(value){
var contains = false;
if (value != null) {
for (var i in this.hashtable) {
if (this.hashtable[i] == value) {
contains = true;
break;
}
}
}
return contains;
}
function hashtable_get(key){
return this.hashtable[key];
}
function hashtable_isEmpty(){
return (this.size == 0) ? true : false;
}
function hashtable_keys(){
var keys = new Array();
for (var i in this.hashtable) {
if (this.hashtable[i] != null)
keys.push(i);
}
return keys;
}
function hashtable_put(key, value){
if (key == null || value == null) {
throw 'NullPointerException {' + key + '},{' + value + '}';
}else{
this.hashtable[key] = value;
}
}
function hashtable_remove(key){
var rtn = this.hashtable[key];
this.hashtable[key] = null;
return rtn;
}
function hashtable_size(){
var size = 0;
for (var i in this.hashtable) {
if (this.hashtable[i] != null)
size ++;
}
return size;
}
function hashtable_toString(){
var result = '';
for (var i in this.hashtable)
{
if (this.hashtable[i] != null)
result += '{' + i + '},{' + this.hashtable[i] + '}\n';
}
return result;
}
function hashtable_values(){
var values = new Array();
for (var i in this.hashtable) {
if (this.hashtable[i] != null)
values.push(this.hashtable[i]);
}
return values;
}
I keep things simple in this blog, because when I search on web, I would like to find simple explanations and examples, not a sophisticated one. I can write a sophisticated one once I know the basic.
It is easy to load another xaml onto the existing one - if you have not use 1.1 before 1.0. Since I have developed 1.1 first, I actually found it confusing in the first place, anyway.
Here is a simple Page.xaml, named "Page", have a canvas, and a TextBlock:
<Canvas
xmlns="http://schemas.microsoft.com/client/2007"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Width="970" Height="616"
Background="White"
x:Name="Page"
>
<TextBlock x:Name="RandomButton" Width="36.258" Height="14.1" TextWrapping="Wrap"
Canvas.Left="19.639" Canvas.Top="110.283">
<Run FontFamily="Arial" FontSize="12" FontWeight="Bold"
Foreground="#FFFFFFFF" Text="Random"/>
</TextBlock>
</Canvas>
In the javascript "code behind" I add an event listener to the RandomButton textblock. I want to load Random.xaml onto this page when I click on RandomButton.
if (!window.Trash)
window.Trash = {};
Trash.Page = function() {}
Trash.Page.prototype =
{
handleLoad: function(control, userContext, rootElement)
{
this.control = control;
this.root = control.content.findName("Page");
this.RandomButton = control.content.findName("HomeButton");
this.RandomButton.addEventListene("MouseLeftButtonUp",
this.Random_onMouseLeftButtonUp);
}
}
We are going to send request for the xaml, and add it to the page asynchronously after it is loaded.
Trash.Page.prototype.Random_onMouseLeftButtonUp = function(sender, e)
{
Control_Send(sender.getHost(), "Random.xaml");
}
function Control_Send(host, control_path)
{
var downloader = host.createObject("downloader");
downloader.addEventListener("completed", Control_DownloaderCompleted);
downloader.open("GET", control_path);
downloader.send();
}
function Control_DownloaderCompleted(sender, e)
{
var xamlItem = sender.getResponseText("");
var host = sender.getHost();
var page = host.content.findName("Page");
var control = host.content.createFromXaml(xamlItem, true);
page.children.Add(control);
}
That's it!
I found my year IV project final report online. I looked through it, and it's very funny. As usual, my project partner implemented the back end C++ logic - decoding a strange string into a tree, and I do the front end GUI.
The hardest part was drawing tree correctly on the screen. Branch lengths have to visually tell the distant between the nodes. It requires quite a bit of Maths to calculate the drawing branch length, and have to fit them all on the screen. It was also quite interesting implementing tree traversal, i.e. moving up (towards the root) and down (towards the bottom).
Anyway, if anyone interested, here's the link:
http://www.ece.auckland.ac.nz/~PIVprojects/archive/reports2004/pdfs/ccho096.pdf
I know this sounds stupid, but I was having a problem with mouse events.
So what happened was I have another control on top of the one that has mouse events. The control on top has a canvas as big as the one underneath, but a transparent background. Well, "transparent" <> "not exists", it's like a piece of glass on top. I forgot.
So if you find your mouse events not working, check if there is a piece of transparent control on top of it!
