A cool thing, did not realise this, you can use a @MasterType directive in an ASP.NET page to strongly type the Master property, quite cool.

<%@ MasterType TypeName="BaseMaster" %>

This is cool, if you write your own http module by implementing IHttpModule you can subscribe to any events that it raises in the Global.asax, just like you would with Application_Start, Application_End, etc you can do the same with your own events with the signature ModuleName_EventName.

So if you had a IHttpModule, say, StatsModule with an event, Start, you can subscribe to the start event with StatsModule_Start.

Its described on this MSDN Docs page for ASP.NET Application Life Cycle Overview for IIS 5.0 and 6.0.

Very cool!

It can be quite handy to use the ~ with ResolveUrl or for url properties of server controls, however, it does not work for ordinary markup, for instance: 

<a href="~/Foo/Bar.aspx"></a>

would not work since you have to add the runat="server". You can work around this with the following if you happen to have access to Page:

<a href="<%=ResolveUrl("~/Foo/Bar.aspx") %>"></a>

But what if you do not have access to Page? Well, there is the option of rolling your own ResolveUrl, which is the approach I have taken many times.

I am still on a mission brushing up on my ASP.NET and found a community comment on the MSDN Docs for ASP.NET Web Site Paths that has a out-of-the-box way of doing this as follows:

<a href="<%=System.Web.VirtualPathUtility.ToAbsolute("~/Foo/Bar.aspx")%>"></a>

 Very handy! and its been in since .NET 2.0 so it shows how much I am missing out on by not thumbing through the ASP.NET docs.

According to the ASP.NET Docs on XHTML Conformance if you try to validate an ASP.NET page with the W3C XHTML validation service it might not report it as valid XHTML simply because the W3C validation service does not report itself as a browser that ASP.NET recognises.

You can get around this problem by creating a browser definition in a .browser file that you put into your App_Browsers folder of your ASP.NET website.

Yoinked directly from the docs:

<browsers>

  <browser id="W3C_Validator" parentID="default">

    <identification>

        <userAgent match="^W3C_Validator" />

    </identification>

    <capabilities>

      <capability name="browser"             
value="W3C Validator" />

      <capability name="ecmaScriptVersion"   
value="1.2" />

      <capability name="javascript"          
value="true" />

      <capability name="supportsCss"         
value="true" />

      <capability name="tables"              
value="true" />

      <capability name="tagWriter" 


         value="System.Web.UI.HtmlTextWriter"
/>

      <capability name="w3cdomversion"       
value="1.0" />

    </capabilities>

  </browser>

</browsers>

This might just be handy to know at some point, although most good browser based web dev tool suites offer the ability to validate XHTML, and I believe they send the content to validate from rendered markup in your browser.

Yesterday, I thumbed through the C# Docs looking for stuff I might not know yet, and today I am doing the same thing for ASP.NET in hope to fill in some gaps that might help me with a technical interview I have coming up on tuesday.

This is something I did not know, in the web.config you can add a tag to define what level of XHTML compliance to render.

<system.web>

<!-- other elements here -->

    <xhtmlConformance 


        mode="Legacy" />

</system.web>

Where mode could be one of 3 values (taken directly from the MSDN How to page for XHTML Conformance):

Legacy (which is similar to how markup was rendered in previous versions of ASP.NET)

Transitional (XHTML 1.0 Transitional)

Strict (XHTML 1.0 Strict)

At work I was implementing a search form that required a 3 tier drop down, so I thought the CascadingDropDown would be perfect for this.

It turns out that the CascadingDropDown was not quite right for the requirements, the last drop down in the 3 tiers had to be enabled and items had to be selectable but also had to filter the other 2 upper tiers.

After some thought, the only way to achieve this was having the ability to programatically add my own values to be passed to the knownCategoryValues argument of the web service method for a CascadingDropDown behavior.

To do this, I had to redefine a method on the CascadingDropDown behavior, I could then invoke this method to force the ajax callback for any CascadingDropDown of my choice. Here is that method.

          AjaxControlToolkit.CascadingDropDownBehavior.prototype._onParentChange2 =function(evt,
inInit, moreKnownCatValues) { ///
<summary>///
Handler for the parent drop down's change event///
</summary>///
<param name="evt" type="Object">///
Set by the browser when called as an event handler (unused here)///
</param>///
<param name="inInit" type="Boolean">///
Whether this is being called from the initialize method///
</param>///
<returns />var e =this.get_element(); //
Create the known category/value pairs string for sending to the helper web service//
Follow parent pointers so that the complete state can be sent//
Format: 'name1:value1;name2:value2;...'var knownCategoryValues = ''; var parentControlID =this._parentControlID; while (parentControlID)
{ var parentElement = $get(parentControlID); if (parentElement
&& (-1 != parentElement.selectedIndex))
{ var selectedValue = parentElement.options[parentElement.selectedIndex].value; if (selectedValue
&& selectedValue !="")
{ knownCategoryValues = parentElement.CascadingDropDownCategory + ':' + selectedValue + ';' + knownCategoryValues;
parentControlID = parentElement.CascadingDropDownParentControlID; continue;
} } break;
} if (knownCategoryValues
!= ''
&& this._lastParentValues
== knownCategoryValues) { return;
} this._lastParentValues = knownCategoryValues; //
we have a parent but it doesn't have a valid value//if (knownCategoryValues
== '' && this._parentControlID)
{ this._setOptions(null,
inInit); return;
} //
Show the loading text (if any)this._setOptions(null,
inInit, true); if (this._servicePath
&& this._serviceMethod)
{ //
Raise the populating event and optionally cancel the web service invocationvar eventArgs = new
Sys.CancelEventArgs(); this.raisePopulating(eventArgs); if (eventArgs.get_cancel())
{ return;
} if (moreKnownCatValues)
{ knownCategoryValues += ";"+ moreKnownCatValues;
} //
Create the service parameters and optionally add the context parameter//
(thereby determining which method signature we're expecting...)var params = {
knownCategoryValues: knownCategoryValues, category: this._category
}; if (this._useContextKey)
{ params.contextKey =this._contextKey;
} //
Call the helper web service Sys.Net.WebServiceProxy.invoke(this._servicePath, this._serviceMethod,
false, params, Function.createDelegate(this, this._onMethodComplete), Function.createDelegate(this, this._onMethodError));
$common.updateFormToRefreshATDeviceBuffer(); } }
        

The method above is just a copy of _onParentChange method of the CascadingDropDown behavior, I called it _onParentChange2 and call this one when I want to invoke an ajax callback, the only difference is the extra argument moreKnownCatValues, the value of this argument will be appended to the knownCategoryValues which will get passed to the callback method. The changes to the original method have been bolded.

Now its possible to invoke a callback on any CascadingDropDown with the code below. 

          $find('CDD1')._onParentChange2(null,
false, "CountryId:25");
        

The line above will get a reference to a CascadingDropDown behaviour that I have given a BehaviorID of CDD1, it will then invoke the new _onParentChange2 method passing through my extra value of CountryId:25.

Its a shame that the CascadingDropDown does not have a more elegant approach for adding to the knownCategoryValues programatically, but at least this workaround is not to hacky. 

I've created a new Ajax Snippets demo video, like my last one, its very rough but I hope I communicate the general idea of the project effectively.

The video covers the new SnippetCallback wizard and best guess parameter mapping. 

Watch the demonstration video

Download the source code from the video

I just released my latest updates to the Ajax Snippets project, the following notes summarise whats new.

ADDED

• SnippetCallback now has an action list item, 'Javascript function stubs to clipboard'
• SnippetCallback now has a designer action list option to configure the callback through a wizard
• Ability to override default value extractors and add new ones
• The Map parameters wizard step of the SnippetCallback wizard now best guesses the mappings by matching the name of the parameter to a control id
• Snippets can now be used as ordinary web user controls where they can be dropped straight on a page with the advantage of SnippetCallbacks
  

FIXED

• Javascript function stubs to clipboard feature was creating incorrect javascript
• SnippetCallback wizard was not saving WebServiceVirtualPath property
• Snippets now throw the correct exception if errors occur whilst retrieving them from a web service
• SnippetManager was not managing css references correctly
  

I almost wrote off the idea that this was even remotely possible until I looked into it more on msdn and found an example.

/// <reference name "Ajax.js" assembly="System.Web.Extensions, ..." /> 



After doctoring it for my own script and assembly it was not working after trying
several different renditions and wondering if it would ever work with the missing
= in the name attribute and what the hell the ... was, I finally came to something
that worked. 

/// <reference name="AjaxSnippets.SnippetManager.js" assembly="AjaxSnippets" />

SnippetManager.js is the file in my AjaxSnippets.dll.

The only snag is that I have not been able to get it to work in a script block inside an aspx page, but it does work in a js file. 

In an SnippetCallback, when defining mapping between a web service method parameter and a control, there is a client-side function for each control type that deals with extracting the value from the control and passing it as the web service methods parameter.

By default most of the simple web controls (TextBox, Checkbox, RadioButtonList, etc) that come out-of-the-box with ASP.NET already have a corresponding client-side value extractor function defined, but obviously this is not good enough if you want to use custom controls.

To override these or add new ones there are two things that need to be done, first off a new extractor function would have to be defined in configuration.

<configSections>

  <section name="ajaxSnippets" type="AjaxSnippets.Configuration.AjaxSnippetsConfigurationSection,
AjaxSnippets"/>

</configSections>

<ajaxSnippets>

  <extractors>

    <add controlType="System.Web.UI.WebControls.TextBox" functionName="myCustomTextBoxExtractor"
/>

    <add controlType="My.Custom.Control" functionName="fromMyCustomControl"
/>

  </extractors>

</ajaxSnippets>

In this example, I am overriding the textbox extractor with my own function myCustomTextBoxExtractor, secondly I am defining a new value extractor fromMyCustomControl for My.Custom.Control.

Now the next thing that needs to be done is to write the client functions, this can be done by creating a new javascript file, which would need to be included in the page that Ajax Snippets are being used.

          AjaxSnippets.ValueExtractors.prototype.myCustomTextBoxExtractor =function(id){ var el = $get(id); //
Extract value from el and return it here  } AjaxSnippets.ValueExtractors.prototype.fromMyCustomControl =function(id){ var el = $get(id); //
Extract value from el and return it here  } 
        

Ajax Snippets has a ValueExtractors class, and its simply just a job of adding functions to its prototype.

To give a better example, the ValueExtractors default prototype is below in full, in its current state from Ajax Snippets 0.3a release.

          AjaxSnippets.ValueExtractors.prototype= {
fromAny: function(id)
{ return id;
}, fromTextBox: function(id)
{ return $get(id).value;
}, fromDropDown: function(id)
{ var el = $get(id); return el.options[el.selectedIndex].value;
}, fromRadioList: function(id)
{ var i,
els = $get(id).getElementsByTagName('input'); for (i = 0;
i < els.length;
i++) { if (els[i].checked)
{ return els[i].value;
} } return null;
}, fromCheckList: function(id)
{ var i,
els = $get(id).getElementsByTagName('input'),
vals = new Array(); for (i = 0;
i < els.length;
i++) { vals.push(els[i].checked);
} return vals;
}, fromListBox: function(id)
{ var i,
el = $get(id),
vals = new Array(); for (i = 0;
i < el.options.length;
i++) { if (el.options[i].selected)
{ vals.push(el.options[i].value);
} } return vals;
}, fromCheckBox: function(id)
{ return $get(id).checked;
} };