Articles → LIGHT SWITCH 2011 → Enable Multi Selection In Grid In Lightswitch 2011

Enable Multi Selection In Grid In Lightswitch 2011

In this article I will explain how to enable multi selection in grid in lightswitch 2011.

Software Requirement

Before you start reading this tutorial you should make sure that

Visual studio 2010 is installed on your machine.
Visual Studio 2010 service pack 1 is installed on your machine.
Microsoft Visual Studio Light switch 2011 is installed on your machine.

Prerequisite Knowledge

Before you go ahead, it is required that you should know

How to create lightswitch project?
How to create an entity in lightswitch?
How to create a screen in lightswitch?
What is ControlAvailable event in lightswitch?

Steps Of Execution

In this tutorial I will execute certain steps for the demonstration of multi selection in grid. These steps are

Creation of new project.
Creation of new table.
Creation of new screen.
Add data to table.
Add ControlAvailable event in screen’s created event.
Set the grid’s SelectionMode property.

Let us work on each step one by one

First step is to create new project. See the screen shot below for project structure

Picture showing the project structure of the lightswitch application in the solution explorer of visual studio

Click to Enlarge

Second step is to create a new table. For this tutorial I have created a table Employee. See the screen shot below

Picture showing the Employee entity in the lightswitch designer

Click to Enlarge

Third step is to add a new screen. For this tutorial I am adding one screen of type ‘Editable Grid Screen’. See the screen shot below for screen designer

Picture showing the designer screen of the Editable Grid Screen

Click to Enlarge

Fourth step is to add data into the table. To add data I will run the application and add data from editable grid screen. See the screen shot below

Picture showing the data added in the editable grid screen

Click to Enlarge

Fifth step is to add grid’s ControlAvailable event. See the code section below

partial void EditableEmployeesGrid_Created(){
  // Write your code here.
  this.FindControl("grid").ControlAvailable += new EventHandler<ControlAvailableEventArgs>(EditableEmployeesGrid_ControlAvailable);   
}

Sixth and the last step is to set the SelectionMode property of grid. So the code becomes

Partial void EditableEmployeesGrid_Created(){
            // Write your code here.
            this.FindControl("grid").ControlAvailable += new EventHandler<ControlAvailableEventArgs>(EditableEmployeesGrid_ControlAvailable);   
}

void EditableEmployeesGrid_ControlAvailable(object sender, ControlAvailableEventArgs e){
   if (e.Control is DataGrid)   {
         DataGrid grid = (DataGrid)e.Control;
         grid.SelectionMode = DataGridSelectionMode.Extended;
   }
}

Now we have done with all the steps now we can see the output by running the application.

Output

Picture showing the multiple selection of grid in lightswitch

Click to Enlarge

Posted By -	Karan Gupta

Posted On -	Wednesday, November 21, 2012

Query/Feedback

Your Email Id		**

Subject		*

Query/Feedback	Characters remaining 250	**