Tejana

LightSwitch Modal Window Picker and ComboBox

Posted in .net, LightSwitch, Microsoft, Software by tejana on November 8, 2010

Associating one entity record with a related entity record

The Modal Window Picker is used by default on the generated screens, if you prefer this can be changed to ComboBox. In Microsoft’s LightSwitch Beta 1 these two screen controls are at the center of relating records to each other. They facilitate the quick construction of user screens. Working with the tools, this post will introduce the subject and demonstrate cascading pick lists.

Customers have cars described by values for make and model:

AutoDiagram

 

USE [TejanaTemp015]
GO
/****** Object:  Table [dbo].[Make]    Script Date: 11/07/2010 09:02:13 ******/
SET ANSI_NULLS ON
GO
SET QUOTED_IDENTIFIER ON
GO
CREATE TABLE [dbo].[Make](
    [Id] [int] IDENTITY(1,1) NOT NULL,
    [Make] [nchar](10) NOT NULL,
CONSTRAINT [PK_Make] PRIMARY KEY CLUSTERED
(
    [Id] ASC
)WITH (PAD_INDEX  = OFF, STATISTICS_NORECOMPUTE  = OFF, IGNORE_DUP_KEY = OFF, ALLOW_ROW_LOCKS  = ON, ALLOW_PAGE_LOCKS  = ON) ON [PRIMARY]
) ON [PRIMARY]
GO
/****** Object:  Table [dbo].[Model]    Script Date: 11/07/2010 09:02:13 ******/
SET ANSI_NULLS ON
GO
SET QUOTED_IDENTIFIER ON
GO
CREATE TABLE [dbo].[Model](
    [Id] [int] IDENTITY(1,1) NOT NULL,
    [Model] [nchar](10) NOT NULL,
    [MakeId] [int] NOT NULL,
CONSTRAINT [PK_Model] PRIMARY KEY CLUSTERED
(
    [Id] ASC
)WITH (PAD_INDEX  = OFF, STATISTICS_NORECOMPUTE  = OFF, IGNORE_DUP_KEY = OFF, ALLOW_ROW_LOCKS  = ON, ALLOW_PAGE_LOCKS  = ON) ON [PRIMARY]
) ON [PRIMARY]
GO
/****** Object:  Table [dbo].[Customer]    Script Date: 11/07/2010 09:02:13 ******/
SET ANSI_NULLS ON
GO
SET QUOTED_IDENTIFIER ON
GO
CREATE TABLE [dbo].[Customer](
    [Id] [int] IDENTITY(1,1) NOT NULL,
    [Customer] [nchar](10) NOT NULL,
    [MakeId] [int] NOT NULL,
    [ModelId] [int] NOT NULL,
CONSTRAINT [PK_Customer] PRIMARY KEY CLUSTERED
(
    [Id] ASC
)WITH (PAD_INDEX  = OFF, STATISTICS_NORECOMPUTE  = OFF, IGNORE_DUP_KEY = OFF, ALLOW_ROW_LOCKS  = ON, ALLOW_PAGE_LOCKS  = ON) ON [PRIMARY]
) ON [PRIMARY]
GO
/****** Object:  ForeignKey [FK_Customer_Make]    Script Date: 11/07/2010 09:02:13 ******/
ALTER TABLE [dbo].[Customer]  WITH CHECK ADD  CONSTRAINT [FK_Customer_Make] FOREIGN KEY([MakeId])
REFERENCES [dbo].[Make] ([Id])
GO
ALTER TABLE [dbo].[Customer] CHECK CONSTRAINT [FK_Customer_Make]
GO
/****** Object:  ForeignKey [FK_Customer_Model]    Script Date: 11/07/2010 09:02:13 ******/
ALTER TABLE [dbo].[Customer]  WITH CHECK ADD  CONSTRAINT [FK_Customer_Model] FOREIGN KEY([ModelId])
REFERENCES [dbo].[Model] ([Id])
GO
ALTER TABLE [dbo].[Customer] CHECK CONSTRAINT [FK_Customer_Model]
GO
/****** Object:  ForeignKey [FK_Model_Make]    Script Date: 11/07/2010 09:02:13 ******/
ALTER TABLE [dbo].[Model]  WITH CHECK ADD  CONSTRAINT [FK_Model_Make] FOREIGN KEY([MakeId])
REFERENCES [dbo].[Make] ([Id])
GO
ALTER TABLE [dbo].[Model] CHECK CONSTRAINT [FK_Model_Make]
GO

To create the model without attaching to the database, create Customer, Make and Model entities each with Id and one String, Customer1, Make1, Model1. On the Model entity add a relationship to Customers and Models. On the Models entity add a relationship to Customers.

CustomerEntity

The CreateNewCustomer screen has been automatically generated with the Modal Window Pickers to control the association of a make and model with the customer.

Auto1

 

We want a way to limit the selection of Models once the Make has been entered. Right click on Models in the Solution Explorer and Add a Query called ModelsByMake with a parameter for MakeId.

ModelsByMake

 

Add this query as a data item to the generated CreateNewCustomerScreen. On the query set the parameter MakeId to the CustomerProperty.Make1.Id and on the screen control for Model set the Choices to this query:

CreateNewCustomer

 

I have added screens for CreateNewModel, and CreateNewMake and some data. Run the application and notice that selecting Make limits the choices of Model. If Model is selected before Make, no selections are available.

For Make Chevrolet:

 

Chevy

 

For make Ford:

 

ford

 

To disable the modal window picker for the Customer’s model until a make has been selected go to the Customer Entity, click on the Model1 reference to Model, then select Model1IsReadOnly from the  Property Methods under the WriteCode tab and insert:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using Microsoft.LightSwitch;
namespace Application1Auto
{
    public partial class Customer
    {
        partial void Model1_IsReadOnly(ref bool result)
        {
            result = (Make1 == null);
        }

        partial void Make1_Changed()
        {
            Model1 = new Model();
        }   
    }
}

 

When you re-run the application these changes to the read-only state of the property of the entity, will be now reflected on the CreateNewCustomer screen’s modal window picker or combo box for the Customer’s model. For more: How can I manuplate property editors, e.g. disable/enable a editor or make it readonly through code

Advertisements

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: