I ended up changing directions with the project I was working on and this code never got used in production. Testing on it was minimal and I haven’t touched it two years. However, I have received a large number of requests for the code…so here it is:

ASP.NET 2.0 Web Service Membership, Role, and Profile Provider

Feel free to post enhancements or suggestions here.

Control ‘hiddenBalance’ referenced by the ControlToCompare property of ‘CompareValidator1′ cannot be validated.

With a small amount of “googling” I found two useful articles:

• Validating against the value in a hidden input
• MS KB Article 310082

Between these two article I pieced together a solution.

The Solution

1. Create a new web project and add it to your solution. I called my project “CompareValidatorHelper”.
2. Right click on the project and select Add and the Class…. I also named my class “CompareValidatorHelper”.
3. Paste the following C# code into the class:

   
using System;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.HtmlControls;
using System.ComponentModel;
namespace CompareValidatorHelper
{
[DefaultProperty("Value"), ValidationProperty("Value"), ToolboxData("<{0}:VHiddenField runat=server></{0}:VHiddenField>")]
public class VHiddenField : System.Web.UI.WebControls.HiddenField
{
}
}


4. Build the project and add a reference to it in your web application project.
5. Register the inherited control at the top of your page:
   <%@ Register TagPrefix="custom" Namespace="CompareValidatorHelper" Assembly="CompareValidatorHelper" %>
6. Add the HiddenField control to your page:
   <custom:VHiddenField ID="hiddenBalance" runat="server" Value='<%# Eval("Balance") %>' />
7. Finally, set the ControlToCompare attribute of your CompareValidator equal to the ID attribute of your HiddenField:
   <asp:CompareValidator ID="CompareValidator1" Display="Dynamic" runat="server" Type="Double" Operator="LessThanEqual" ErrorMessage="Overpayments are not allowed." ControlToCompare="hiddenBalance" ControlToValidate="txtPaymentAmount">*</asp:CompareValidator>

1. Develop
2. Test
3. Deploy

These three stages can also represent physical locations. Development is done locally, moved to an internal testing server for QA, and finally deployed to the production server. There is frequently a lot of overlap between these stages and locations as bugs are discovered and ironed out or new features added. Managing multiple Google Maps API Keys between all these URL’s can be a hassle.

The Trick

Sign up for the Google Maps API for every URL the site will exist on. Add the keys to the appSettings section of Web.config.

<appSettings>
<!-- Google Map API Keys -->
<add key="localhost" value="http://maps.google.com/maps?file=api&amp;v=2&amp;key=ABQIAAAALZp8x8mYJMinyKDbF6G7bBT2yXp_ZAY8_ufC3CFXhHIE1NvwkxQBOooHv6EDaUJi3lHupS34T4CM5Q"/>
<add key="testserver" value="http://maps.google.com/maps?file=api&amp;v=2&amp;key=ABQIAAAALZp8x8mYJMinyKDbF6G7bBT4S2onT7717RtVeZs20MVAELzRRBSlPqEN-WtDpPooS4i4Rvu50CucoA"/>
<add key="www.productionserver.com" value="http://maps.google.com/maps?file=api&amp;v=2&amp;key=ABQIAAAALZp8x8mYJMinyKDbF6G7bBQzDH33YNyRzvKBWbxIa_7sg2mVwBRnO7qb_i1DY0Vhq-a8wXtFVXcMkg"/>
</appSettings>


Now, register the script in the code behind for the page that needs it.


protected void Page_Init(object sender, EventArgs e)
{
if (!Page.IsStartupScriptRegistered("googleMapScript"))
{
// Register Startup Script for Google Maps API
string myScript = "<script type=\"text/javascript\" src=\"" + ConfigurationManager.AppSettings[Request.ServerVariables["SERVER_NAME"]] + "\"></script>";
this.Page.ClientScript.RegisterStartupScript(typeof(Page), "googleMapScript", myScript);
}
}


You’re done!

PS: I know my code blocks are not too hip right now (overflowing onto the navigation and sidebar). It’s on the list.

1. Atlas Framework
2. Atlas Control Toolkit

Summary

The Atlas Control Toolkit site does a good job a walking through all the steps necessary to build a custom extender. You’ll want to refer to that site for more general detail. I’m going to show you my own custom implementation.

I needed a control that would sum all the TextBoxes on a page, using the onchange event, and display the answer in another TextBox. For my purposes, the input is limited to integers, but it could easily be adapted to handle other numeric input. I call my Atlas extender “SumTextboxes”.

Getting Started

Create a new project. You can do this one of three ways:

• Go to File->New Project…;
• Ctrl + Shift + N;
• Right Click on a solution that is already open and select Add->New Project…

All three methods will open up the Add New Project dialog. Select your language preference (VB or C#) the “Atlas” Control Project. The Atlas Control Project does not exist for any other languages right now. Give your project a name and specify the location.

Next, right click on your new project and select Add->New Item…. This will open the Add New Item dialog. Choose the “Atlas” Extender Control template, give it a name, and click Add. Four files appear in your project. These are the base files needed to build a custom extender.

Write the Code

Open all four of the template files and make the following changes:

SumTextboxesDesigner.cs

Change the word Control to the more specific TextBox.

SumTextboxesExtender.cs

Same thing: Change the word Control to the more specific TextBox.

SumTextboxesProperties.cs

Looks like this:

[DefaultProperty("TargetResultTextBoxID")]
public class SumTextboxesProperties : TargetControlPropertiesBase<TextBox>
{
// TODO: Add your property accessors here.
//
[IDReferenceProperty(typeof(TextBox))]
public string TargetResultTextBoxID
{
get
{
return GetPropertyStringValue("TargetResultTextBoxID");
}
set
{
SetPropertyStringValue("TargetResultTextBoxID", value);
}
}
}


SumTextboxesBehavior.js

First, initialize your property variable: var _TargetResultTextBoxIDValue;. You can delete the this._onkeyup function; create a new function called this._onchange…we’ll get to the code for _onchange in a second. Change the initialize function to look like this:

this.initialize = function() {
SumTextboxes.SumTextboxesBehavior.callBaseMethod(this, 'initialize');
// TODO: add your initalization code here
this.control.element.attachEvent('onchange', Function.createDelegate(this, this._onchange));
this._onchange();
}


You will also need to change the code inside this.getDescriptor to this:
td.addProperty('TargetResultTextBoxID', String);

…and your property accessors:

// These are helper functions for communicating state back to the extender on the
// server side. They take or return a custom string that is available in your initialize method
// and later.
//
this.getClientState = function() {
var value = SumTextboxes.SumTextboxesBehavior.callBaseMethod(this, 'get_ClientState');
if (value == '') value = null;
return value;
}
//
this.setClientState = function(value) {
return SumTextboxes.SumTextboxesBehavior.callBaseMethod(this, 'set_ClientState',[value]);
}


And finally, back to this._onchange. This is where the meat of this extender is:

this._onchange = function() {
if (!document.getElementsByTagName)
{
return;
}
var e = document.getElementById(_TargetResultTextBoxIDValue);
var total = 0;
oTextboxes = new Array();
oInputs = document.getElementsByTagName('input');
for (i=0;i {
if (oInputs[i].type == 'text')
{
oTextboxes.push(oInputs[i]);
}
}
var msg = "Found " + oTextboxes.length + " text boxes";
for (i=0;i {
if (!isNaN(parseInt(oTextboxes[i].value)) && oTextboxes[i] != e)
{
total += parseInt(oTextboxes[i].value);
}
}
e.value = total;
}


You're almost done! Save the project and build. You can now use this extender in an ASP.NET website!

Implementation

Add a reference to SumTextboxes in the project by right clicking on the project and selection Add Reference.... This will open the Add Reference dialog. Select the Projects tab, the SumTextboxes project, and click OK.

Drag a ScriptManager control from your toolbar onto the design view. This is control is required for Atlas enabled applications.

Add some TextBoxes to your page. For each TextBox, you will also need a SumTextboxes control. I chose to use another Atlas Extender, the FilteredTextBoxExtender to restrict the user input to numbers. Here's a snippet of my code for each textbox:

<asp:Label ID="lblHundreds" runat="server" AssociatedControlID="txtHundreds">Hundreds (100s):</asp:Label>
<cc2:FilteredTextBoxExtender ID="FilteredTextBoxExtender1" runat="server">
<cc2:FilteredTextBoxProperties TargetControlID="txtHundreds" FilterType="numbers" />
</cc2:FilteredTextBoxExtender>
<cc3:SumTextboxesExtender ID="SumTextboxesExtender1" runat="server">
<cc3:SumTextboxesProperties
TargetControlID="txtHundreds"
TargetResultTextBoxID="txtTotal" />
</cc3:SumTextboxesExtender>
$<asp:TextBox ID="txtHundreds" runat="server" Text="0" />.00


Notice that the TargetResultTextBoxID property has been set to "txtTotal". txtTotal is the TextBox control at the bottom of the page where the results are displayed. It is updated everytime the user tabs off a field that has the SumTextboxes control attached to it!

Mono provides the necessary software to develop and run .NET client and server applications on Linux, Solaris, Mac OS X, Windows, and Unix.

Excited about the prospect of building .NET applications on my Apple iMac, I went straight for a link labeled “Multi-platform”, and then clicked on “Mac OS X”

I downloaded the Mac .dmg and then read the steps involved with installation and use. In addition to the framework, there were an additional six installs to perform to get the development environment up and running. The steps looked pretty scary and I decided not to jump in with both feet without a little more research.

After a little more looking around it appears that Mono is geared more towards Linux application development. I can’t tell if it would be useful for web development or not. I don’t need another framework to learn, but I think it would be cool (in a super geeky kind of way) to be able to develop .NET apps on my Mac. Is anyone else doing this?