Atlas secrets-binding)

Http://dflying.dflying.net/1/archive/109_atlas_unleashed-bindings.html

The Atlas architecture provides a client binding model that is much more powerful than Data Binding in ASP. NET. This model is abnormal and flexible, and is even similar to the binding model in Windows Presentation Foundation. The binding model provided by Atlas allows you to bind any attribute of an object to any attribute of another object. It can be used not only for data binding, but also for binding a widget style to another widget. This makes it possible to associate everything in Atlas.

In this post, I will try to analyze some Atlas implementation code to explain how Atlas completes binding.

First, let's look at the code for applying Atlas binding. The text attribute of a textbox is bound to the selectedvalue attribute of a select list. No matter which one you change, it will be immediately reflected on the other.

HTML and aspx, defining textbox and select list. (Note that a scriptmanager server object must be declared to introduce the JavaScript files required by Atlas .)

<Atlas: scriptmanager id = "scriptmanager1" runat = "server"/>
<Div>
Input an integer from 1 to 5. <br/>
<Input id = "mytextbox" type = "text"/> <br/>
Select an item. <br/>
<Select id = "myselect">
<Option value = "1"> value 1 </option>
<Option value = "2"> value 2 </option>
<Option value = "3"> value 3 </option>
<Option value = "4"> value 4 </option>
<Option value = "5"> value 5 </option>
</SELECT>
</Div>

 

Atlas script to "Upgrade" the above two HTML controls to the Atlas control.

<Page xmlns: script = "http://schemas.microsoft.com/xml-script/2005">
<References>
</References>
<Components>
<Textbox id = "mytextbox">
<Bindings>
<Binding datacontext = "myselect" datapath = "selectedvalue" property = "text" direction = "inout"/>
</Bindings>
</Textbox>
<Select id = "myselect"/>
</Components>
</Page>

 

As shown above, you only need to write a short piece of simple code to implement the required binding function.

How does Atlas implement this? First, Atlas needs a way to monitor changes in the binding properties of bound controls (unless you do not need the automatic binding feature provided by Atlas ). Define an interface named SYS. inotifypropertychanged in Atlas. JS, similar to the interface provided in. net. The object can implement this interface so that other objects can listen to changes in their property values. The base class of all components in Atlas, SYS. component, implements this interface. SYS. component also provides the method raisepropertychanged (propertyname). This method should be called in the setter of each attribute to issue the inotifypropertychanged. propertychanged event.

So far, let's take a look at the implementation of textbox in the Atlas control. Let's see how the propertychanged event is also issued when the corresponding HTML event is sent in textbox.

VaR _ text;
VaR _ changehandler;

This. get_text = function (){
Return this. element. value;
}

This. set_text = function (value ){
If (this. element. value! = Value ){
This. element. value = value;
This. raisepropertychanged ('text ');
}
}

This. initialize = function (){
SYS. UI. textbox. callbasemethod (this, 'initialize ');

_ Text = This. element. value;

_ Changehandler = function. createdelegate (this, this. _ onchanged );
This. element. attachevent ('onchang', _ changehandler );

_ Keypresshandler = function. createdelegate (this, this. _ onkeypress );
This. element. attachevent ('onkeypres', _ keypresshandler );
}

This. _ onchanged = function (){
If (this. element. value! = _ Text ){
_ Text = This. element. value;
This. raisepropertychanged ('text ');
}
}

 

As you can see, when the text attribute changes, Atlas issues the propertychanged event, which makes binding to this attribute possible.

Then, the binding model of Atlas captures this event, finds the target object and corresponding attributes according to the binding declaration, and calls the setter of this attribute to change the attributes of the target object.

 

If the source object implements the inotifypropertychanged interface and the changed attribute is the attribute specified in datapath, and the direction is set to in or inout, the Atlas binding will be analyzedIntroduction (Incoming)(Refer to the evaluatein () method described below ).

Similarly, if the target object implements the inotifypropertychanged interface, and the changed property is the property specified in the property, and the direction is set to out or inout, the Atlas binding will be analyzedOutbound (Outgoing)(Refer to the evaluateout () method described below ).

 

Next, let's look at the public methods and attributes in the binding implementation code to analyze the core implementation of Atlas binding. There is no need to list all the Code involved in binding. If you are interested, you can use the keywords SYS. bindingbase and SYS. Binding to search in the Atlas. js file. FirstSYS. bindingbaseProvided methods and attributes.

 

1. AttributeAutomatic: Specifies whether the binding will be automatically executed when the corresponding attribute of the source object changes (for in and inout) or the corresponding attribute of the target object changes (for out and inout. This attribute is set to true by default. Of course, you can set it to false if you need to fully control the start time of binding. For example, in some cases, you decide to bind the data source and display control only when an Ajax request returns successfully to ensure that the display control is actually bound to some data, in this case, you need to call the evaluate () method of binding to start binding.
2. AttributeDatacontext: Specifies the object with the property to be bound. If this parameter is not specified, Atlas binding calls the datacontext attribute of the parent control that contains it instead. The control can return the set datacontext or return the datacontext of its parent control by default. For example, a listview control can set its datacontext as a datarow object when it creates a listview item to bind it.
3. AttributeDatapath: Attribute of the source object to be bound. Atlas binding can also bind a nested property, such as sourceobjectproperty. nestedproperty. nestednestedproperty. The source code shows that Atlas can automatically convert and run the code for you. The default value of the datapath attribute is null, that is, Atlas binds the object itself.
4. AttributeProperty: Specify the attributes of the target object to be bound. You should always specify this attribute; otherwise, this binding has no meaning.
5. AttributePropertykey: Sometimes we may need to bind to the nested attribute of an object. For example, if you need to bind the color attribute to the style, you can specify the property attribute as style and the propertykey attribute as color.
6. AttributeTransformerargument: The parameter passed to Atlas transformer. Only the setting is required.Transform.
7. EventTransform: This event allows you to specify a transformer when binding. Transformer is a good choice when you need to process data during binding. For example, if you want to display a Boolean value of yes/no instead of the default value of true/false, you should use a custom transformer. Atlas also provides some built-in transformer, such as ADD, multiply, and compare.
8. MethodEvaluatein: Process the introduced binding. If the direction attribute is set to in or inout, this method gets the attribute value of the source object (based on the datacontext and datapath attributes set in the binding) and calls the setter of the corresponding attribute of the target object. This is the core part of implementing binding in Atlas.

SYS. Binding (also in Atlas. JS) also has some important methods/attributes:

 

1. AttributeDirection: Specifies the direction in which attributes to be monitored change. Can be setIn,OutOrInout. The default value is in.
2. MethodEvaluateout: Similar to the method evaluatein in the base class, but executed in the opposite direction. Of course, you need to set the directiton attribute to out or inout.

We hope that these explanations will give you a deeper understanding of Atlas's "magic" binding. You are welcome to leave a message for discussion.

PS: In this article, I do not know how to express it in Chinese. I hope I can get some suggestions and correct them:

1. Evaluate, I translated it into "processing", but the meaning of "calculation" is not shown in this article.
2. Incoming and outgoing, I translated them into "Introduction" and "outbound "...... I think it is not a general awkwardness.
3. Transformer, no translation (I really don't know what to say ).
4. Getter and setter are not translated (you never know how to translate ).