Getting started with bindings – part IV

Now that we already know how to use live bindings from JavaScript (aka, imperative approach), it’s time to see how we can use them directly on the markup (ie, it’s time to see how we can use bindings through a declarative approach). We’ll reuse our previous example so that you can compare both approaches. Without further delay, here’s the declarative approach code:

<body xmlns:sys="javascript:Sys">
    <input type="text" id="origin"
        value="Hi from bindings world!" />
    <input type="text" id="target"
        sys:value="{binding value, source=origin, mode=twoWay}" />
</body>

Once again, we need to reuse the sys alias again to ensure proper parsing of the binding. As you can see, a binding is represented through a {binding } *markup expression*. Within a { binding } expression, you can set the various properties of the binding through pairs of key=value entries. For instance, we set the source property by using the pair source=origin.  You’ve probably noticed that there’s a single entry called value (right after the {binding) which isn’t a pair. To understand what’s going on here, we need to make a small detour into markup extensions.

Bindings defined through a declarative approach are parsed through markup extensions. In practice,markup extensions are just functions which get an object built from the string you’ve used and that do something with it (this is enough for now,but rest assured that we’ll come back to this topic in future posts). Markup extensions introduced the concept of default value. A default value doesn’t require a pair key/value entry in the expression list; in fact, whenever the binding sees an single entry value, it will simply set that value as the default property value.

Advertisements

~ by Luis Abreu on October 10, 2009.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

 
%d bloggers like this: