Checking User Permission From HTML Client in LightSwitch 2012

This article describes how to check user permissions from the HTML Client using LightSwitch in Visual Studio 2012.

The following is the procedure for checking User Permission from the HTML Client.

Step 1

Open the Solution Explorer.

sol ex.jpg

Step 2

In the Solution Explorer, right-click on the server and choose "Add Table".

add table.jpg

Step 3

The table appears.

employee table.jpg

Step 4

In the Solution Explorer, right-click or double-click on the property node and choose "open".

prop open.jpg

Step 5

The Application Designer appears.

permission designer.jpg

Step 6

In the
 Application Designer, select "Access Control". In Access Control, under "Authentication Type", choose "Use Forms authentication", and define "New Permission".

access control.jpg

Step 7

From the Data Designer, in the drop down list of the "Write Code" button, select the "Employee_CanInsert" method and use the following code:

write code.jpg

partial void Employees_CanInsert(ref bool result)

        {

            result = this.Application.User.HasPermission(Permissions.CanAddCustomer);

        }

Step 8

Here we will add a query to check the permission for the HTML Client Screen. There are two ways to add a query.

Go to the Solution Explorer and right-click on the table and choose "Add Query".

add query from sol ex.jpg

From the Menu bar of the Table Designer screen choose "Query".

add query from menu bar.jpg

Step 9

The Query designer appears.

add query.jpg

In the Query Designer, under the Write Code drop down list, choose the Can_Execute method to check the permission.

writecode can.jpg

Under it perform the following coding:

partial void CanAddEmployee_CanExecute(ref bool result)

        {

            result = this.Application.User.HasPermission(Permissions.CanAddCustomer);

        }

Step 10

Once again go to the Solution Explorer and right-click on the HTML Client Screen and choose "Add Screen".

add src.jpg

Step 11

From the Add New Screen dialog box select "Browse Screen" from the Screen Template and provide screen information as shown and click the "OK" button.

browse src.jpg

Step 12

The "BrowseEmployees" screen designer appears.

src des 1.jpg

Step 13

Under Command Bar we will add two buttons. For that either right-click on Command Bar or click on "Add" to add a button.

add button.jpg

The "Add Button" dialog box appears. In that select "write my own method" and provide a method and click the "OK" button. We will do that two times.

add button dialog.jpg

view employee.jpg

Step 14

From the menu bar of the Screen Designer choose "Add Data Item".

Add data item.jpg

The Add Data Item Dialog Box appears on the screen. From the Dialog box, choose the Query option and under Name choose "CanAddCustomer" and click the "OK" button.

add data item dialog.jpg

Step 15

Choose the control from the screen designer that you want to enable or disable.

Add Employee.jpg

Step 16

In the Menu Bar of the Screen Designer choose the "Write Code" option and under the write code option add some code to the created method.

write code created.jpg

/// <reference path="../GeneratedArtifacts/viewModel.js" />

 

myapp.BrowseEmployees.created = function (screen) {

    // Write code here.

    screen.getCanAddEmployee().then(function success() {

        screen.findContentItem("Add Employee").isEnabled = true;

    }, function error() {

        screen.findContentItem("Add Employee").isEnabled = false;

    });

};

Up Next
    Ebook Download
    View all
    Learn
    View all