Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

...

Binding error handling

Binding order

Why is binding order important?

Components on the screen are ordered naturally, by their DOM location as created by the developer. But to handle binding properly it is important that binding is done in proper order.

Let's give an example. We have a screen with two combo boxes:

...

The "Country" combo contains a few countries, the "City" combo contains cities in all of these countries - not just of the selected country.

Now let's see what happens if we order binding in "dom order"... Say the user changes "Netherlands" to "Great Britain":

  • The request enters the server, and binding executes moveControlToModel.
  • "Country" changed to "Great Britain":
    • The model discovers that city "Amsterdam" is not in Great Britain, so it changes the "city" property to "London".
  • But now we bind "city" which is "Amsterdam" from the UI code.
    • The binder overwrites "London" with "Amsterdam", and updates "Country" back to Netherlands.

Clearly this is not really what we want. We need to have some "order" imposed on the bindings, so that it behaves as expected.

How DomUI orders binding

When a request comes in the binder (SimpleBinder) will run moveControlToModel, after all components have obtained their value(s) from the request. It does that as follows:

  • Walk the tree, and find all bindings.
  • Check each binding for a changed value, i.e. where the model value differs from the control value.
    • For items that have the same value: ignore
  • We now have a list of bindings whose value changed. Order these bindings as follows:
    • A "deeper" binding comes before a "higher" binding
    • Bindings at the same "level" execute in order of dom traversal.
  • Now bind all values as per the above ordering.


 




The UI should act as follows:

...

We bind these controls to two properties in our model, called "country" and "city". The model ensures that:

  • As soon as the city's setter is called, the country property is updated with the city's country.
  • As soon as the country's setter is called, the "city" property is checked.