# Using data binding

Abstract

Client-side data binding (or binding, for short) in SPEAK means synchronizing properties between components.

From an application developer's point-of-view, client-side data binding (or binding, for short) in SPEAK is the synchronization of properties between components. For example:

• You bind the IsVisible property of a Button control to the HasMoreItems property of a SearchDataSource component. This means that SPEAK only shows the button when the SearchDataSource can retrieve more items. You use this for a "paging" button that users click to retrieve more items.

• You bind the Items property of a ListControl to the Items property of a SearchDataSource component. This means that the ListControl automatically shows the items that the SearchDataSource retrieves.

• You bind the Text property of a SearchDataSource component to the Text property of a TextBox control. This means that when users enter text in the text box and press

Enter

, the SearchDataSource uses this text as a search string.

Sitecore Rocks shows a dropdown in the value field of many properties and populates this dropdown with possible bindings. The possible bindings are calculated from the components that you have added to your layout. You can always type in a binding that is not in the dropdown list.

The following table shows how you use binding when you specify the value of a property:

### Description

Hello World

Literal value: Hello World

{Binding Name=Button1.Text}

Binding to Button1.Text

{Binding Button1.Text}

Equivalent to {Binding Name=Button1.Text}

{Binding ListControl1.Header.Text}

Binding to ListControl1.Header.Text

\{Hello World\}

Literal value: {Hello World}

{Binding Button1.IsVisible, Converter=Not}

Binding to Button1.IsVisible using converter function Not

{Binding Button1.Text, Converter=Has}

Binding to Button1.IsVisible using converter function Has. This converter returns True if a string has a value or an array is not empty.

{Binding Button1.Text, DefaultValue=Denmark}

Binding to Button1.Text, setting the default value to the literal Denmark

{Binding Button1.Text, DefaultValue={XPath @SampleField}}

Binding to Button1.Text, setting the default value to the result of the XPath expression. This allows a very advanced initialization of the value.

{Binding Name={XPath @BindToField}}

Binding to the value of the BindToField in the current data source