Data Binding With Custom Control in LightSwitch

Prologue:

In my previous article, we discussed how to access a custom control from a LightSwitch screen. In this article, we shall see how to bind the added custom control with the screen property in LightSwitch.

We can take the LightSwitch demo application we have created in part I of this article series. As we discussed in part I, create a demo application.

We have added the custom control; if you want to do something with the control then we need to access the custom control. So access the custom control as we discussed in this article.

So as we are going to bind the control with the screen property [entity property], we need to add a property to the Person entity.

Updating the Entity:



As shown in the above figure, add a new property "Status" to the Person entity.

The status property is used to hold the status message for the Save action.

To display the status message, we need to create a new Label control and need to bind with the Status property of Person entity.



Here:

1. Select the "Person Property" screen element.
2. To add the new control to the screen, select the "Add" dropdown list.
3. Select the "New Custom Control"

Once you click on "New Custom Control" option, you will be getting the "New Custom Control" dialog as shown in the below figure.



To add the Windows Label control as a custom control to the LightSwitch screen:

1. Select the "System. Windows.Controls.Data.Input" namespace.
2. Select the Label control under "Controls" namespace of "System. Windows.Controls.Data.Input".
3. Select the Property to be bound with the Status custom control as shown in the figure.
   
   
    
4. Click OK to proceed.

The next step is to enable the control to bind with the property defined in the Person entity.

Enabling the Control to bind with Property:



As shown in the above figure:

• The highlighted part with the yellow color specifies which property of the control the status property of the entity should bind to.
• The highlighted part with the orange color specifies the relationship of the entity property with the Control.
• The highlighted part with the gray color specifies the way of binding.

To bind the screen property with the custom control, we need to access the control as a Windows button in code-behind.

To access the control, we need to include the control namespace as shown in the figure.



Here we have added the Windows control namespaces and the LightSwitch threading namespace.

The Binding functionality:



Here,

• Here we have handled the click event of the custom button control.
• We are saving the record on click of the custom control "button" click. For more info about how to save the record while adding it please read this article.
• Here we are assigning the message to the Status property of the Person entity. As we have bound the Status property with the Label control, it will automatically display the message in the Label.

We are done. Hit F5 to see the Application in Action.

Application in Action:



You can see the Label and button as a custom control. As we have bound the status property with the label control the "Information saved" message is displayed.

Summary:

In this article We have seen how to bind the property with custom control of the LightSwitch screen.

Thanks for spending your precious time here. Please provide your valuable feedbacks and comments, which enable me to give a better article the next time.

Thanks.