Atlas databinding and Custom transformers
In Atlas, its very easy to delcaratively perform databainding between 2 controls, or a control and some datasource such as a web service.
For this example, lets assume we have 2 simple textboxes. Lets also assume that we have an exchange rate and we want to convert values between the 2 textboxes based on this exchange rate. We will make use of Atlas databinding and a custom transformer to achieve this task.
Our textbox markup would look something like this:
<
asp:TextBox ID="txt1" runat="server"></asp:TextBox><asp:TextBox ID="txt2" runat="server"></asp:TextBox> Using Atlas declarative (XML Script) code, we can databind these 2 textboxes so that changes in one are reflected in the other. The declarative/XML Script to do this is:
<textBox id="txt1">
<bindings>
<binding id="b1" dataContext="txt2" dataPath="text" transform="myTransform" property="text" transformerArgument="ONE" direction="Out" />
</bindings>
</textBox>
What we have said with the above binding is that we are using the 'txt1' textbox as the owner control. The direction if "Out" means that the owner (in our case txt1) will act as the source of the data. We would set the direction to 'In' which would cause the owner (txt1) to act as the target for our operation. Optionally, we could also use a direction of 'InOut'. The dataContext and dataPath properties refer to the input data, in this case the property 'text' of the control 'txt2'. The 'property' attribute of our binding specifies what property on the owner (txt1) the input data is bound to.
We have also setup an identical binding but for our other textbox. The net effect being whatever is typed into one textbox, is reflected in the other.
<textBox id="txt2">
<bindings>
<binding id="b2" dataContext="txt1" dataPath="text" transform="myTransform" property="text" transformerArgument="TWO" direction="Out" />
</bindings>
</textBox>
Just copying over what is typed is not very interesting though. We have specified an additional 2 attributes on each binding. 'transform' and 'transformerArgument'. Atlas comes with some predefined transforms such as 'Add, mutiply, toString' and others (see the Atlas doco for a complete list). For this example, we could probably use one of the built in transformers, but lets do a custom one, just for the hell of it. The 'transform' attribute specifies a handler to call when the databding occurs, the 'tranformerArgument' is passed to the handler during this call. The handler looks like this:
function
myTransform(sender, e){
var txt1Amt = $object('txt1').get_text();
var txt2Amt = $object('txt2l').get_text();
var result = '';
var _exchangeRate = 0.75;
if (!isNaN(parseInt(txt1Amt)) || !isNaN(parseInt(txt2Amt)))
{
// We multiply the value with the exchange rate
if (txt1Amt != '' && e.get_transformerArgument() == "ONE")
{
result = (txt1Amt * _exchangeRate);
}
// We divide the value with the exchange rate
if (txt2Amt != '' && e.get_transformerArgument() == "TWO")
{
result = (txt2Amt / _exchangeRate);
}
}
// Set the result of this binding event argument which is the result of this binding
// transformer routine.
e.set_value(result);
}
Sure, its not the most elegant code, but it shows how easy it is to define your own transformer routines, and parse the tranformer arguments specified within your Atlas declarative bindngs.
Hopefully, thats helped others understand and get started with custom transformers and declarative bindings. All this can be done imperatively/via client script as well, but thats a post for another day.