Beth Massi - Sharing the goodness

Use Your MSDN Benefit to Convert Your Office 365 Developer Preview

Beth Massi — Mon, 20 May 2013 20:58:00 GMT

The easiest way to get started developing SharePoint apps with LightSwitch is to sign up for a free trial of an Office 365 Developer account at dev.office.com. Because Office 365 has moved from preview to release, if you signed up for a preview account, you have until May 31st to convert it to a paid subscription. Doing so will save all your content.

You can use your MSDN subscription benefit to get a year free. Here’s a step-by-step slideshare by Randall Isenhour (@SharePointDev) from the Office content team.

Convert Office 365 Developer Preview to paid subscription using MSDN benefit from Randall Isenhour

I just converted mine and it took about 5 minutes.

For more details see the Apps For Office and SharePoint Blog:
Convert your Office 365 Developer Subscription Preview to a General Availability subscription to save your content

Enjoy!

Saving Data Across One-to-One Relationships

Beth Massi — Thu, 09 May 2013 20:59:14 GMT

I’ve had a couple questions recently on how you could add data to tables that have a one-to-zero-or-one relationship in Visual Studio LightSwitch. Depending on whether the related record is mandatory (required) or not you have a couple different options when inserting data. So in this post I’ll show you a couple different options for doing that in both the desktop and mobile clients.

Our Data Model

Let’s take a simple data model of Customer and a related table CustomerNote. A customer can have zero or one note as defined by the relationship.

When we create our Customer screens, LightSwitch will automatically bring the CustomerNote fields in as well. For edit screens this is exactly what we want because this allows the user to edit fields across both tables on one screen. However, on AddNew screens, LightSwitch will not automatically add a new record to the CustomerNote table – we need to write code for that depending on if the note is mandatory or not.

Adding Code to the Silverlight Client

In order to support this in the Silverlight desktop client we need to write some VB (or C#) code.

Mandatory: Always add a related record

If you want to always add a related record, use the _Created event. Open the data designer to the parent record (in my case Customer), select the DesktopClient perspective and then write code in the _Created event to add the related record every time the parent is inserted.

Write the code in bold.

VB:

Public Class Customer
    Private Sub Customer_Created()
        Me.CustomerNote = New CustomerNote()
    End Sub
End Class

C#:

public partial class Customer
{
    partial void Customer_Created()
    {
        this.CustomerNote = new CustomerNote();
    }
}

Now when we run the desktop client and add a new customer, the note fields are enabled.

Optional: Allow the user to decide

If the related record is optional and you want to have the user decide, add a gesture (like a button) to your screen. Open the screen designer and add a button, select “Write my own method” and call it AddNote, then edit the CanExecute and Execute methods.

VB:

Private Sub AddNote_CanExecute(ByRef result As Boolean)
    'Only enable the button if there is no note
    result = (Me.CustomerProperty.CustomerNote Is Nothing)
End Sub

Private Sub AddNote_Execute()
    ' Add the note
    Me.CustomerProperty.CustomerNote = New CustomerNote()
End Sub

C#:

partial void AddNote_CanExecute(ref bool result)
{
    // Only enable the button if there is no note
    result = (this.CustomerProperty.CustomerNote == null);
}

partial void AddNote_Execute()
{
    // Add the note
    this.CustomerProperty.CustomerNote = new CustomerNote();
}

Adding Code to the HTML Client

In order to support this in the html client we need to write some JavaScript code.

Mandatory: Always add a related record

Open the data designer to the parent record, but this time select the HTMLClient perspective. Then write JavaScript code in the _Created event to add the related record every time the parent is inserted.

myapp.Customer.created = function (entity) {

    entity.CustomerNote = new myapp.CustomerNote();
};

Notice the use of the myapp object here. You can use the myapp object in a variety of ways in order to access data and screens in the HTML client. Check out some other uses here- How to: Modify an HTML Screen by Using Code

Now when we run the HTML client and add a new customer, the note fields are enabled.

Optional: Allow the user to decide

Open the screen designer and add a button, select “Write my own method” and call it AddNote, then edit the CanExecute and Execute methods. Then write this code:

myapp.AddEditCustomer.AddNote_canExecute = function (screen) {
    // enables the button (returns true) if the note doesn't exist
    return (screen.Customer.CustomerNote == null);

};
myapp.AddEditCustomer.AddNote_execute = function (screen) {
    //Add a new note
    screen.Customer.CustomerNote = new myapp.CustomerNote();
};

Wrap Up

So those are a couple different ways you can manage data participating in one-to-zero-or-one relationships. Keep in mind that these tables are in the same data source, but they don’t have to be, you can set up virtual relationships this way as well. If you do have separate data sources, however, you’ll also need to tell LightSwitch the order in which you want to update them. For more information on that see: Customize the Save command to save to multiple data sources

Enjoy!

LightSwitch Community & Content Rollup–April 2013

Beth Massi — Wed, 01 May 2013 21:07:46 GMT

Last year I started posting a rollup of interesting community happenings, content, samples and extensions popping up around Visual Studio LightSwitch. If you missed those rollups you can check them all out here: LightSwitch Community & Content Rollups.

This month was FULL OF AWESOMENESS as we finally released the 3rd version of LightSwitch!

WE DID IT! WHOOOHOOO! You can now build HTML5 and JavaScript-based clients that are optimized for touch-oriented, modern mobile devices. LightSwitch also supports publishing your apps to SharePoint 2013 & Office 365, so you can also build SharePoint 2013 apps with LightSwitch. There’s been a TON of activity in the community this month (this is probably my biggest rollup to date) so read on…

LightSwitch HTML Client Released in Visual Studio 2012 Update 2!

It’s been an exciting, challenging journey and I congratulate the team on this important milestone of one of the most exciting products I have been fortunate to be a part of. Thank you to the community, the team, and my family for supporting me and LightSwitch for the last couple years!

We’re seeing a lot of new faces in the forums, twitter, Facebook, our blog, email, etc. asking questions and congratulating us on this release. Our Developer Center has almost doubled in traffic! It’s very exciting (and sometimes overwhelming) to see the community growing – and I know we’re just getting started.

Check out the LightSwitch HTML and SharePoint resources and get started building HTML5 business apps today!

LightSwitch in Visual Studio 2012 Update 2

LightSwitch Developer Center Freshness

We made a bunch of updates to the LightSwitch Developer Center for this release so if you haven’t visited lately, I encourage you to do so. The Dev Center is your one-stop-shop for all the best LightSwitch resources, documentation and tutorials. Make sure to bookmark http://msdn.com/lightswitch and check back often.

Some of the goodies we’ve added are new “How Do I…?” videos that will help you get started with the new HTML client.

We also have a new architecture page that explains the application architecture and hosting options of a LightSwitch application, including the new HTML5 client and SharePoint 2013 support. See: Exploring LightSwitch Architecture

We also updated our tutorials so if you haven’t checked them out lately I encourage you to do so. You can access them and get the download from the new HTML client page.

JavaScript Samples for LightSwitch Developers

We also released the first set of JavaScript snippets that you will find useful in your LightSwitch apps. Then Michael Washington of the LightSwitchHelpWebsite.com wrote up a “full color” companion article to got with it so check it out!

Walk-thru Examples of Common Visual Studio LightSwitch JavaScript

Sneak Peak: ComponentOne HTML Controls for LightSwitch!

Michael Washington also posted a sneak peak at the coveted, soon to be released, ComponentOne controls for the LightSwitch HTML client! I can’t wait to get my hands on these! If they’re anything like their other world-class LightSwitch controls for Silverlight, then we’re really in for a treat with the HTML client controls.

Sneak Peek: Wijmo Creates Custom JavaScript In LightSwitch HTML Client

Xpert360 LightSwitch Screencasts on Dynamics CRM & Salesforce Data

Xpert360 released a couple great screencasts that show you how to build LightSwitch clients for your Dynamics CRM and Salesforce data without writing code. Check them out!

Check out their free Lightning Adapters here. Thanks guys!

New LightSwitch E-Book!

Alessandro Del Sole has released another awesome book – check it out!

Hidden Visual Studio LightSwitch: Secrets from the Real World for Creating Great Apps
This eBook offers practical tips and tricks as well as useful guidance on how to implement common features in LightSwitch, such as those for working with documents, business analysis, screen customization, optimal server configuration, usage with databases other than SQL Server, and so on.

LightSwitch Events

We got a couple new events to add to the list from last month and more details on TechEd! Try and make one of these great events and come say “HI”.

VSLive! Chicago May 13-16
Michael Washington of the famed LightSwitchHelpWebsite.com is speaking in Chicago in May. Check out the sessions here. Also, don’t miss Michael’s interview here: The Visual Studio Live! interview

DevTeach Toronto May 25 – 31
I have a couple LightSwitch sessions and an all-day training on May 25th at the 10-year anniversary of this awesome community run conference in Canada. I’ve been speaking here every year except the first, even before I joined Microsoft, so I’m honored to have been invited to this special event.

TechEd North America June 3 – 6 New Orleans, LA &
TechEd Europe June 25-28 Madrid, Spain
I’ll be speaking at TechEd in New Orleans and Heinrich will be speaking in Madrid this year. We’ve got a couple great LightSwitch sessions and Hands-on-Labs! Hope to see you there.

FalafelCon 2013 June 10th – 11th Microsoft Silicon Valley Campus, Mountain View, CA
I’ll also be speaking at the conference put on by Falafel Software, Telerik & Microsoft. It’s here in my neck of the woods and it should be a great event with a lot of very well known speakers.

//build/ June 25 – 28 San Francisco, CA
Details soon!

That Conference Wisconsin Dells, WI August 12th – 14th
I’ll be talking about LightSwitch HTML goodness at this “summer camp for geeks”. It’ll be my first time at this event so I’m really looking forward to it!

Team Blogs In Your Face!

The team has really been cranking out the content on the LightSwitch Team blog. Our goal is to teach you the tips and tricks needed to build fantastic business apps. Check out these latest articles on a variety of topics. If you’re new to the LightSwitch HTML Client, I recommend starting with the “Signed-In” series that Andy wrote up that shows you how to build a modern, touch-oriented sign in sheet application.

HTML How-Tos

SharePoint apps

Architecture & APIs

UI Customization

Reporting Dashboards

For more, head to the LightSwitch Developer Center.

LightSwitch Team Community Sites

Become a fan of Visual Studio LightSwitch on Facebook. Have fun and interact with us on our wall. Check out the cool stories and resources. Here are some other places you can find the LightSwitch team:

LightSwitch MSDN Forums
LightSwitch Developer Center
LightSwitch Team Blog
LightSwitch on Twitter (@VSLightSwitch, #VS2012 #LightSwitch)

Final Personal Note

Personally it’s been an amazing month – the most amazing in my life actually. Not just because of the LightSwitch release but also because I got engaged to the most wonderful man in the world. Nick, I love you! Here’s to many amazing years together.

Enjoy!

Adding a Signature Control to the LightSwitch HTML Client

Beth Massi — Wed, 24 Apr 2013 15:02:00 GMT

LightSwitch is all about building business solutions quickly -- defining your data models & business rules and visually creating screens with a set of built-in controls. It does all the boring plumbing so you can concentrate on the real value of your applications. But LightSwitch also allows for all sorts of customizations so you don’t hit that infamous “glass ceiling”. When the team set out to build the LightSwitch HTML client, they wanted to make sure that the extensibility model was super simple and in line with the way web developers build solutions today.

With the Silverlight client, extension authors have to know about the guts of the LightSwitch extensibility model in order to provide easy-to-use extensions consumable by LightSwitch developers. There are over 100 (and growing) LightSwitch extensions on the Visual Studio Gallery (even a signature control). But with the HTML client we wanted to take advantage of the huge web ecosystem already out there, so adding customizations can be as easy as finding the JavaScript library you want and wiring it up to your app.

The team has written a variety of articles on incorporating custom controls and data binding in LightSwitch. Here are a few:

In particular, the last one from Joe helped me immensely. Among other things, it describes the two hooks you get for UI customization in the HTML client -- the render and postRender events. If you need to modify DOM elements (i.e. controls) created by LightSwitch, use the postRender event. This allows you to augment the element like adding a CSS class or other DOM attributes. However, if you need to completely take over the rendering yourself then you do this in the render event of a LightSwitch custom control element.

LightSwitch produces single-page applications (SPAs) based on jQuery and jQueryMobile so there are a plethora of plugins available for you to use in LightSwitch. Which ones you use totally depends on what you want to provide to your users and the devices that you need to support. In this post I want to show you a quick way of incorporating a signature control based on the jSignature plugin.

You can download the full source code for my example here.

Add the Library to your LightSwitch Project

The first step is to grab the control you want. Search the web, look in a catalog, ask a friend, browse NuGet right from within Visual Studio, or (heaven forbid) write one yourself! With any custom code you bring into your application you’ll want to make sure it works for you. jSignature has a live demo, so you can test that it works on the devices you want to support before doing anything. This particular library says it works well on many devices, has a nice import/export feature, and good documentation, so that’s why I picked this one for this example.

Once you download jSignature, extract the ZIP. With your LightSwitch project open, flip to File View in Solution Explorer and drag the jSignature.min.js library into your Scripts folder under your HTML client project.

Next open the default.htm and add the script reference:

Now you’re ready to use the signature control in your LightSwitch app.

Add the Custom Control

For this example I’ve created a simple data model for tracking work orders. Once an employee completes a work order, they need to sign it. There are many ways to store the jSignature data in LightSwitch. jSignature has a variety of formats it supports so have a look at the documentation. For this example I’ll show how to store it as an Image using the Image Business Type as well as storing it in a much more compressed base30 string that can be reloaded back into the jSignature control.

So our data model looks like this. Note the two fields we’ll be using for our custom signature controls, SignatureImage and SignatureVector. I made SignatureVector of length 2000 to be on the safe side, but I’d imagine most signatures wouldn’t need that much space.

Next we’ll add a couple Add/Edit Details screens that work with these fields. Add a new screen and select Add/Edit Details and for the Screen Data select the WorkOrder. First one name “SignWorkOrderImage” and then add another one called “SignWorkOrderVector”

Now in the Screen Designer make the content tree how you like. For the SignWorkOrderImage screen I am going to place the SignatureImage on the screen twice, but one of them will be our custom control. There’s a few ways you can add custom controls to screens. If your control isn’t specific to a particular field, at the top of the Screen Designer click “Add Layout Item”, select “Custom Control”, and then you can specify the “screen” as the binding path.

However, since our binding path will be the SignatureImage field, just select the content item in the tree and change it to a “Custom Control”.

Next set the height and width of both the Signature controls to “Fit to Content”.

I’ll also set the display name of the custom control to something a little more prominent “SIGN HERE:”. So for the SignWorkOrderImage screen the content tree looks like this.

Similarly, for the SignWorkOrderVector screen, we’ll be working with the SignatureVector field. For testing, I’d like to actually see what the vector data is so I’ll also add a textbox to display that under the custom control. So the content tree for this screen looks like this.

Next we need to write some code in the custom control’s render events.

Working with Signatures as Images

Every control library will be different so you’ll need to learn the capabilities of the control itself before you can write code to render it. But once you’ve worked through the demo it’s pretty easy to figure out this particular control.

The only thing that you need to keep in mind regards to LightSwitch is that the DOM we see inside our _render method is not the “live” DOM—it’s the DOM that exists before jQueryMobile expands it. Because of this, we need to wait until the DOM is fully rendered so that we can initialize the control and hook up the change notifications. Joe taught us how to do this using the setTimeout() function.

What gets passed to us is the DOM element (element) and the data item we’re working with (contentItem). First create the control by specifying a <DIV> with an ID of “signature” and add that to the DOM. Then inside the setTimeout function we can initialize the control and then hook up the change listener. In order to get the data as an image from the jSignature control, we call getData and pass in the type we want back. The method returns an array with the type and the actual image data (ex. img[1] ).

myapp.SignWorkOrderImage.Signature_render = function (element, contentItem) {

    //Create the control & attach to the DOM
    var sig = $("<div id='signature'></div>");
    sig.appendTo($(element));

    setTimeout(function () {
        //Initialize and start capturing
        sig.jSignature();

        // Listen for changes made via the custom control and update the 
        // content item whenever it changes.  
        sig.bind("change", function (e) {
            var img = sig.jSignature("getData", "image");
            if (img != null) {
                if (contentItem.value != img[1]) {
                    contentItem.value = img[1];
                }
            }
        });
    }, 0);    
};

We can also add a button to the screen to clear the signature – just specify this code in the button’s execute method.

myapp.SignWorkOrderImage.ClearSignature_execute = function (screen) {
    // Write code here.
    $("#signature").jSignature("reset");
};

So when we run this screen we will see the signature control and as we perform each stroke, our image control is updated. If we save this, it will save as an image to the database.

Working with Signatures as Vectors

Saving the image directly to the database is quick and handy but the jSignature control documentation warns that it’s not supported on older versions of Android. Also the images won’t scale particularly well. So it’s probably better to store the data as vector data or something that can be re-rendered later. Like I mentioned before, there are a lot of formats you can choose from, even SVG and Base64 formats. Instead of storing the data as an Image business type in LightSwitch, change it to a standard Binary and you’re good to go.

But since the base30 format that jSignature provides is the most compact, we’ll use that for the next example. This format also allows us to load it into the jSignature control when we open the screen as well.

myapp.SignWorkOrderVector.Signature_render = function (element, contentItem) {

    //Create the control & attach to the DOM
    var sig = $("<div id='signature' ></div>");
    sig.appendTo($(element));

    setTimeout(function () {
        //Initialize control and set initial data       
        sig.jSignature();
        if (contentItem.value != null) {
            sig.jSignature("setData", "data:" + contentItem.value);
        }

        // Listen for changes made via the custom control and update the  
        // content item whenever it changes.  
        sig.bind("change", function (e) {
            var data = sig.jSignature("getData", "base30");
            if (data != null) {
                data = data.join(",");
                if (contentItem.value != data) {
                    contentItem.value = data;
                }
            }
        });
    }, 0);   
};

When we run this screen you can see the much smaller payload for the signature. We also see the control loaded with data when we reopen it.

Wrap Up

That’s it! As you can see, adding UI customizations takes just a little knowledge of JavaScript and understanding of how LightSwitch renders the DOM. In fact, I’m learning JavaScript & jQuery through LightSwitch and I think I have just enough knowledge to be ~~dangerous~~ productive now :-)

Keep in mind that not all devices support all the controls out there so your mileage may vary. But I hope I demonstrated how you can easily customize the LightSwitch HTML client.

Enjoy!

Using LightSwitch ServerApplicationContext and WebAPI to Get User Permissions

Beth Massi — Wed, 17 Apr 2013 19:36:21 GMT

Last post I showed a simple way of checking a single user permission from an HTML client screen in order to disable/enable UI elements. If you only have a couple permissions to check and you don’t want to write a lot of code then this simple tip works. However, if you need to check many permissions throughout your HTML client app or you need to return permissions to custom web clients you build against the LightSwitch server, a better idea is to retrieve all these permissions at once for the logged in user and store them on the client so all screens can access them without hitting the database again.

The LightSwitch philosophy is to provide RAD tools for building business apps fast, but still allow advanced customization where and when you need it. In this post I’ll show you a way to return user permissions by creating a custom web method using Web API and the LightSwitch ServerApplicationContext that was introduced in Visual Studio 2012 Update 2. If you missed Matt’s post about it, check it out here: Using the LightSwitch ServerApplicationContext API

You can download the sample code from this post here.

Create Permissions and Secure your Data

The first step in securing your data based on user permissions is to define your permissions and check them from the entity access control methods. For this example, we will define a couple permissions “CanAddCustomer” and “CanEditCustomer” that determines whether a user can perform Inserts and Edits on a Customer entity on the server.

Open the Project Properties and define your permissions. Make sure to enable authentication. Then check off the permissions you want to enable while you’re debugging.

Then in the data designer, select the Server perspective and then drop down the “Write Code” button and select the Customers_CanInsert and Customers_CanUpdate access control methods:

Then you write code like this to allow or disallow the insertion and editing of customers:

VB:

Private Sub Customers_CanInsert(ByRef result As Boolean)
    result = Me.Application.User.HasPermission(Permissions.CanAddCustomer)
End Sub

Private Sub Customers_CanUpdate(ByRef result As Boolean)
    result = Me.Application.User.HasPermission(Permissions.CanEditCustomer)
End Sub

C#:

partial void Customers_CanInsert(ref bool result)
{
    result = this.Application.User.HasPermission(Permissions.CanAddCustomer);
}

partial void Customers_CanUpdate(ref bool result)
{
    result = this.Application.User.HasPermission(Permissions.CanEditCustomer);
}

You always want to secure the server-side this way in order to protect the data in your system. However, sometimes we also want to use a permission check in the UI in order to hide/unhide (or enable/disable) elements on a multitude of screens.

As I mentioned in my previous post, the Silverlight desktop client exposes a User object available to you at all times from any screen, so checking permissions on the client is easy. Here’s how you can create a similar object for the HTML client that holds all the permissions for a logged in user.

Create a Custom Web API on the LightSwitch Server

First we’re going to use Web API to expose a RESTful service that will return JSON to the client. Flip to the file view in the Solution Explorer.

Add a folder called “Perms” (or whatever you want to call it) to the Server project , add an new item, and select Web API Controller Class and name it “UserPermissionsController”.

Now we can use the LightSwitch ServerApplicationContext to verify the user is authenticated and to create a dictionary of their own permissions. If the user is not authenticated then nothing is returned. Note that you will need to add references to the LightSwitch Server and Security namespaces first.

In order to query the LightSwitch SecurityData where the permission data resides we need to temporarily elevate the caller’s permissions. This elevation is only in effect during the extent of the execution of the method. For more information about permission elevation see: How to Elevate Permissions in Server Code

Be careful what you put in this dictionary. Here we are simply populating a list of permissions, we’re not putting any sensitive information in there like the user’s name or passwords. Remember with power comes responsibility.

VB:

Imports System.Net
Imports System.Web.Http
Imports LightSwitchApplication
Imports Microsoft.LightSwitch.Server
Imports Microsoft.LightSwitch.Security

Public Class UserPermissionsController
    Inherits ApiController

    ' GET api/<controller>
    Public Function GetValues() As Dictionary(Of String, Boolean)
        'This will generically retrieve all the permissions of the current logged in user. 

        Dim perms As New Dictionary(Of String, Boolean)

        Using ctx As ServerApplicationContext = ServerApplicationContext.CreateContext()
            Dim currentUser = ctx.Application.User

            'If the requestor is not logged in then nothing is returned. 
            ' Only properly logged in users can retrieve their own permissions
            If currentUser.IsAuthenticated Then

                perms.Add(Permissions.SecurityAdministration,
                          currentUser.HasPermission(Permissions.SecurityAdministration))

                'elevate permissions temporarily
                currentUser.AddPermissions(Permissions.SecurityAdministration)

                For Each perm As Permission In ctx.DataWorkspace.SecurityData.Permissions()
                    If perm.Id <> Permissions.SecurityAdministration Then

                        perms.Add(perm.Id, currentUser.HasPermission(perm.Id))
                    End If
                Next
            End If
        End Using

        Return perms
    End Function

End Class

C#:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Net;
using System.Net.Http;
using System.Web.Http;
using Microsoft.LightSwitch.Server;
using Microsoft.LightSwitch.Security;
using Microsoft.LightSwitch.Security.Server;
using LightSwitchApplication;

namespace LightSwitchApplication.Perms
{
    public class UserPermissionsController : ApiController
    {
        // GET api/<controller>
        public Dictionary<string, Boolean> Get()
        {
            Dictionary<string, Boolean> perms = new Dictionary<string, Boolean>();

            using (ServerApplicationContext ctx = ServerApplicationContext.CreateContext())
            {
                var currentUser = ctx.Application.User;
                if (currentUser.IsAuthenticated)
                {
                    perms.Add(Permissions.SecurityAdministration,
                        currentUser.HasPermission(Permissions.SecurityAdministration));

                    currentUser.AddPermissions(Permissions.SecurityAdministration);

                    foreach (Permission perm in ctx.DataWorkspace.SecurityData.Permissions)
                    {
                        if (perm.Id != Permissions.SecurityAdministration)
                        {
                            perms.Add(perm.Id, currentUser.HasPermission(perm.Id));
                        }
                    }
                }
            }
            return perms;
        }
    }
}

Finally we need to add a route to our controller. Right-click on the server project again and add a Global Application Class (Global.asax) and add the following references at the top:

VB:

Imports System.Web.Http
Imports System.Web.Routing

C#:

using System.Web.Routing;
using System.Web.Http;

Then in the Application_Start method add the route.

VB:

Sub Application_Start(ByVal sender As Object, ByVal e As EventArgs)
    ' Fires when the application is started
    RouteTable.Routes.MapHttpRoute("PermsApi", "Perms/{controller}")
End Sub

C#:

protected void Application_Start(object sender, EventArgs e)
{
    RouteTable.Routes.MapHttpRoute("PermsApi", "Perms/{controller}");
}

Retrieve the Permissions on the Client

Next we need to call this method from the client and save the data in a global object. On the LightSwitch HTML client there is a global object called myapp that we can use to store the permissions object. You can use the myapp object in a variety of ways in order to access data and screens in the HTML client. Check out some other uses here- How to: Modify an HTML Screen by Using Code

The handiest place to put the code to retrieve the permissions is in the created method on the first screen in our application. This is the first user method that will be called when the app starts and we can be sure that the LightSwitch client environment is ready.

Open the screen that is set as your Home screen (this is probably the first screen you created or you can right-click on a screen in the Solution Explorer and “Set as Home Screen”). Select the Screen node at the top of the content tree, drop down the “Write Code” button, and select the created method.

Here’s the code that will call the web API and return a JSON object with the permissions.

myapp.BrowseCustomers.created = function (screen) {
    // Write code here.
    $.getJSON("../Perms/UserPermissions/", function (data) {

        //attach the permissions to the global 'myapp' object 
        //so it is accessible to the client anywhere.
        myapp.permissions = data;
     });    
};

Put a breakpoint here and notice that the dictionary of permissions is returned when you run it.

Check the Permissions in JavaScript Code

Now that we have the set of permissions on the client we can check permissions anywhere in our HTML screens by writing some simple JavaScript. In my example I want to enable/disable buttons on a screen depending on whether the user can add or edit Customers.

First take note of the control names you want to manipulate. In my case I have a couple buttons one named AddCustomer and another named EditCustomer.

Just like before, select the Screen node at the top of the content tree, drop down the “Write Code” button, and select the created method for that screen. Then write code to check the permissions object:

if (myapp.permissions["LightSwitchApplication:CanAddCustomer"]) {
    screen.findContentItem("AddCustomer").isEnabled = true;
}
else {
    screen.findContentItem("AddCustomer").isEnabled = false;
}
if (myapp.permissions["LightSwitchApplication:CanEditCustomer"]) {
    screen.findContentItem("EditCustomer").isEnabled = true;
}
else {
    screen.findContentItem("EditCustomer").isEnabled = false;
}

Now we can see that buttons are correctly enabled & disabled based on the permissions.

Wrap Up

LightSwitch is all about productivity and we strive to provide the best developer experience for building business apps as fast as possible. However we also want to allow advanced customization and power where and when you need it. Whether that’s implementing custom controls, data sources, web services, etc. -- there is a lot of room for extensibility, especially in the latest version (V3) of LightSwitch in Visual Studio 2012 Update 2.

There are a lot of possibilities that are available to you now that we’ve opened up the LightSwitch API on the server using the ServerApplicationContext. Coupled with the ease of using Web API you can provide custom service interfaces to your LightSwitch server logic to provide smart, custom, RESTful HTTP services to a host of clients.

With this practical example, I hope I not only showed you how to retrieve user permissions but also gave you a glimpse of what is possible. Stay tuned to the LightSwitch Team blog for more examples like dashboards and reporting scenarios.

Enjoy!

LightSwitch Tip: A Simple Way to Check User Permissions from the HTML Client

Beth Massi — Fri, 12 Apr 2013 15:36:16 GMT

UPDATE 4/17: If you’re not afraid to write some code, here’s a more robust way to get all the user permissions with one database call into the HTML client and use via JavaScript on any screen: Using LightSwitch ServerApplicationContext and WebAPI to Get User Permissions

----------------

Those of you that have been working with LightSwitch know that we support a robust permissions system that allows developers to define certain permissions and then check them in code. LightSwitch provides numerous “CanExecute” hooks on entities and queries that can be used for checking permissions around data & query actions.

For instance, if you have defined a permission “CanAddCustomer” you can check if a user has this permission before allowing Inserts on the Customer entity on the server. First define the permissions on the Access Control tab of the project properties:

Then in the data designer, select the Server perspective and then drop down the “Write Code” button and select the Customers_CanInsert access control method:

Then you write code like this to allow or disallow the insertion of customers:

Private Sub Customers_CanInsert(ByRef result As Boolean)
    result = Me.Application.User.HasPermission(Permissions.CanAddCustomer)
End Sub

In the Silverlight desktop client this is a very easy thing to do because we make use of portable assemblies that allows LightSwitch to share code between the client and the server side. You have a User object available to you at all times from any screen. In the HTML client this isn’t the case but all is not lost!

Define a Query

If we want to check permissions on the HTML client screens, the easiest thing to do is add a query and secure the query on the server-side. For example, add a query based on Customer called CanAddCustomer:

Then add the code in the CanAddCustomer_CanExecute method to check the permission:

Private Sub CanAddCustomer_CanExecute(ByRef result As Boolean)
    result = Me.Application.User.HasPermission(Permissions.CanAddCustomer)
End Sub

Because this will hit the database if a user does have permission, we can make the query as efficient as possible by not returning any actual results. Select the CanAddCustomer_PreprocessQuery method and write a query that won’t return results.

Private Sub CanAddCustomer_PreprocessQuery(
            ByRef query As System.Linq.IQueryable(Of LightSwitchApplication.Customer))

    query = From c In query Where 0 = 1

End Sub

Set Up the Screen

Now that we have our query we can add it to the screen in which we want to enable/disable UI elements based on this permission. On the screen designer click the “Add Data Item” button at the top and add the query to your screen:

Then select the control you want to enable/disable and note its name in the properties window, we’ll need this in code.

Add Some JavaScript Code

Lastly, select the Screen node in the designer and then drop down the “Write Code” button and add code to the “created” method.

myapp.BrowseCustomers.created = function (screen) {
    // Write code here.
    screen.getCanAddCustomer().then(function success() {
        screen.findContentItem("AddCustomer").isEnabled = true;
    }, function error() {
        screen.findContentItem("AddCustomer").isEnabled = false;
    });

};

The code calls the query on our screen and it will fail if the user doesn’t have permission to execute it, which will invoke the failure handler. Note that this could also hide the UI if the query failed for another reason, but this ensures the UI is only shown if the client can actually verify the user’s permissions.

Remember that hiding the elements in the client doesn't provide real security, so make sure to use the server-side access control methods shown above to ensure no client can access data you want to protect.

Enjoy!

LightSwitch All Day Training at DevTeach, Toronto in May

Beth Massi — Tue, 09 Apr 2013 18:57:33 GMT

Just announced! I’ll be delivering an all-day training at DevTeach again – this time in Toronto on May 25th! This was a huge success when I did it in Montreal so I’m happy to do this again. This time though, I have a lot of new content related to the release of the HTML client and SharePoint 2013 support in Visual Studio 2012 Update 2.

Here are the details:

Mastering LightSwitch in Visual Studio 2012

LightSwitch in Visual Studio 2012 is the easiest way to create modern line of business applications for the enterprise. In this training you will learn how to build connected business applications that can be deployed to Windows Azure or Office 365 and run on the desktop as well as modern mobile devices. We’ll start with the basics of building the middle-tier services and data entry screens with simple validations and then we’ll move into more advanced scenarios like writing complex business rules and processes. You’ll gain a full understanding of the architecture of a LightSwitch application and how it embraces best practices in n-tier design while handling all of the plumbing code for you. Learn how to integrate multiple data sources like SharePoint and OData services, as well as data validation, authentication, and access control. See how to access the LightSwitch data services from other clients and platforms and how to extend the middle-tier with your own services using WebAPI. You’ll learn the ins-and-outs of the data and screen designers to maximize your productivity as well as how to build LightSwitch SharePoint 2013 apps. You’ll also see how to create HTML5\JavaScript clients that can run on any modern mobile device as well as advanced customization techniques to provide customized UI’s & dashboards for mobile users.

Learn more about LightSwitch on the Developer Center.

Full day workshop for only $25.00

Date: Saturday May 25th, 2013
Location: Delta Meadowvale (6750 Mississauga Road , Toronto, ON)

Click here for more details & to register!

Hope to see you there!

LightSwitch HTML Client & SharePoint Resources–Get Started Building HTML5 Business Apps Today!

Beth Massi — Thu, 04 Apr 2013 22:46:13 GMT

This morning we released the LightSwitch HTML client in Visual Studio 2012 Update 2! I can’t tell you how excited I am to see this released to the public. It’s been an exciting, challenging journey and I congratulate the team on this important milestone of one of the most exciting products I have been fortunate to be a part of. Thank you to the community, the team, and my family for supporting me and LightSwitch for the last couple years!

LightSwitch in Visual Studio 2012 Update 2

(Note: if you are upgrading from Update 2 CTP4 then you can go ahead and install the final Update 2 release. Users of the LightSwitch Preview 2 please read these important upgrade instructions.)

With the release of LightSwitch in Visual Studio 2012 Update 2, we’ve also released a bunch of updated and new resources for you to check out on the LightSwitch Developer Center.

New “How Do I” Videos!

Yes that’s right folks! We’ve got a new “How Do I…?” video series that will help you get started with the new HTML client! (Yes, that’s my voice so get used to it! ;-))

I’ve got 5 live now and stay tuned for more in the coming weeks!

Updated Tutorials

We also overhauled our tutorials so if you haven’t checked them out lately I encourage you to do so. You can access them and get the download from the new HTML client page:

Explore LightSwitch Architecture & Hosting Options

We also updated our architecture page. Go deeper and learn about the architecture of a LightSwitch application, including the new HTML5 client and SharePoint 2013
support!

Exploring LightSwitch Architecture

JavaScript Samples for LightSwitch Developers

We also released the first set of JavaScript snippets that you will find useful in your LightSwitch apps. Check out the sample and stay tuned for more!

LightSwitch JavaScript Coding Examples

Use the Q & A link on the sample to provide suggestions for additional code samples that you would like to see.

Lot’s more on the LightSwitch Team Blog!

The team has been releasing a TON of great content on the LightSwitch Team Blog so check it out! If you’re new to the LightSwitch HTML Client, I recommend starting with this series that shows you how to build a modern, touch-oriented sign in sheet application:

I also recommend these awesome articles to learn more:

More LightSwitch Team Community Sites

Also check out our Facebook page for more fun stuff! And please ask your questions in the LightSwitch forum, the team is there to help!

Enjoy!

LightSwitch Community & Content Rollup–March 2013

Beth Massi — Tue, 02 Apr 2013 18:19:00 GMT

Last year I started posting a rollup of interesting community happenings, content, samples and extensions popping up around Visual Studio LightSwitch. If you missed those rollups you can check them all out here: LightSwitch Community & Content Rollups.

LightSwitch in Visual Studio 2012 Update 2

March was an exciting month for us as we released the last HTML Client preview in Visual Studio Update 2 CTP4! The new HTML5 and JavaScript-based client addresses the increasing need to build touch-oriented business applications that run well on modern mobile devices. The preview also supports publishing these apps to SharePoint 2013 & Office 365, so you can also build SharePoint 2013 apps with LightSwitch. To give it a try see:

Getting Started with LightSwitch in Visual Studio 2012 Update 2

Updated Tutorials

With the latest release we also overhauled our two tutorials that give you a good introduction to developing with the HTML client as well as working with SharePoint 2013. If you haven’t checked these out recently I encourage you to do so.

“Step-By-Step” with Andy Kung

Andy is one of our most popular team writers and he’s put together another GREAT series of articles walking you through building a mobile app with LightSwitch. The app is a clipboard-style app that let’s people sign-in for events and is a good introduction for anyone learning LightSwitch and the HTML client. Check out his “Signed-In” series:

Festive Themes from Xpert360

On the western calendar, March had a couple holidays this year – St. Patrick’s day and Easter – and with that, Xpert360 created a few FREE festive themes based on the Cosmopolitan shell. Awesome! Thanks guys!

Syncfusion Raffle

In April, Syncfusion will be giving away five Enterprise Syncfusion Essential Studio licenses worth $1999 each! Check out the end of Jan van der Haegen’s blog post for details:

#LightSwitch and #Syncfusion: simply beautiful applications ($10.000 April raffle!)

Events

Earlier this month I spoke at TechDays in the Netherlands and got to meet a couple of my favorite LightSwitch rock stars, Jan van der Haegen and Paul van Bladel. If you missed my trip report check it out:

Trip Report: TechDays Netherlands 2013

We also have a bunch more events coming up. Check it out:

VSLive! Chicago May 13-16
Michael Washington of the famed LightSwitchHelpWebsite.com spoke at VSLive! in Las Vegas last week and is also speaking in Chicago in May. Check out the sessions here.

DevTeach Toronto May 27 – 31
I have a couple LightSwitch sessions and an all-day training at the 10-year anniversary of this awesome community run conference in Canada. I’ve been speaking here every year except the first, even before I joined Microsoft, so I’m honored to have been invited to this special event.

TechEd North America June 3 – 6 New Orleans, LA & TechEd Europe June 25-28 Madrid, Spain
Session details haven’t been announced yet but you can be sure that we’ll have a LightSwitch presence at TechEd again this year.

//build/ June 25 – 28 San Francisco, CA
Enough said. :)

Did I miss any events? Drop me a comment below!

LightSwitch Team Community Sites

LightSwitch MSDN Forums
LightSwitch Developer Center
LightSwitch Team Blog
LightSwitch on Twitter (@VSLightSwitch, #VS2012 #LightSwitch)

Enjoy!

Master-Detail Screens with the LightSwitch HTML Client

Beth Massi — Thu, 21 Mar 2013 16:01:00 GMT

Since we released the latest version of the LightSwitch HTML Client a couple weeks ago, the team has been cranking out some awesome content on the LightSwitch Team blog around the new capabilities as well as some good How-To’s. And there’s a lot more coming!

If you’re just getting started with the HTML client, see: Getting Started with LightSwitch in Visual Studio 2012 Update 2

In this post I want to show you how you can use the LightSwitch Screen Designer to create master-detail screens the way you want them. The Screen Designer is very flexible in allowing you to customize the screen layouts, it just takes some practice. In fact, there are so many goodies in the Screen Designer I won’t be going over all you can do (look for some videos on that soon). Instead I want to focus on a couple different ways you can present master-detail screens. What inspired me to write this post was Heinrich’s brilliant article on Designing for Multiple Form Factors which explains how LightSwitch does all the heavy-lifting for you to determine the best way to lay out content on a screen depending on the screen size.

I’ll present a couple different ways you can design master-detail screens to get your creative juices flowing, but keep in mind these are just suggestions. In the end you have total flexibility to create screens the way you need with your data and users in mind.

Setup our Data Model

I’m going to use an application that we built in the Beginning LightSwitch Series and extend it with a mobile client. It’s a very simple application that manages contacts or business partners. This would typically be part of a larger business system but for this example it works well because there are multiple one-to-many relationships. Download the Sample App and feel free to follow along at home!

Here’s our data model. A Contact has a one-to-many relationship between its PhoneNumbers, EmailAddresses and Addresses.

Add an HTML Client “Home” Screen

First we need to upgrade this application to take advantage of the new HTML client, then we’ll be able to add a screen that users will see when they launch the app.

In the Solution Explorer, right-click on the project and select “Add Client…”.

Name the client “HTMLClient” and click OK. This will upgrade your project from LightSwitch version 2 to version 3. You’ll now see a node called “HTMLClient (startup)” in the Solution Explorer. Right-click on that and select “Add Screen…” and choose the Browse Data Screen template. Select the “SortedContacts” query as the Screen Data and name the screen “Home” then click OK.

Next, let’s modify what we’re showing in the list. In the Screen Designer, change the Summary control to a Columns Layout. A Summary control displays the first string field defined on the entity in the Data Designer. However we want to see both the FirstName & LastName so a Columns Layout will do this for us.

Run the application (F5). Since there’s already some data in this sample, you’ll see a few contacts displayed in the list.

Now let’s see a couple ways in which we can present the contact details as well as their related data, PhoneNumbers, EmailAddresses & Addresses.

Master-Details with Tab Controls

Close the app and return to the Screen Designer for the Home screen. Select the List control and in the Properties Window set the Item Tap action by clicking on the link.

Then select the SortedContacts.viewSelected method and click OK to create a new screen.

This will open the familiar Add New Screen dialog with the View Details Screen already selected. Make sure to check off the additional data to include the EmailAddresses, PhoneNumbers and Addresses. Then click OK.

By default, LightSwitch will set up the contact details and all the related children into separate Tab controls. When we run the app again, the tabs appear across the top in a scrollable/swipe-able container.

As we open each tab, you will see a simple list of items displayed.

Let’s see how we can customize these lists a little better so that a user can see all the data at one glance as well as formatting the data better.

Back in the Screen Designer for the ViewContact screen, first select the Email Addresses List and change it to a Tile List. This will automatically change the Summary control to a Rows Layout and will set the Email field to display as a formatted, clickable email address. Let’s also de-emphasize the Email Type field by setting its Font Style to “Small”.

Repeat the same process for Phone Numbers and Addresses. For Addresses, in order to show the City State & ZIP on one line of the tile, select the Rows Layout and under the field list click + Add, and select New Group. Then change the control to a Columns Layout and add the City State & ZIP fields to that group. In the end, your screen’s content tree should looks like this.

Now when we run it, you’ll see our data displayed and formatted much better.

Using Tab controls for master-details screens is a good idea when you will potentially have a lot of child data to display or you are targeting smaller mobile devices like phones. This limits the amount of (potentially overwhelming) information that a user has to view at once.

Editing Data in Tabs

Now let’s see how we can edit our data using the Tab design. Go back to the ViewContact screen and under the Details Tab expand the Command Bar and click +Add to add a button. Select an existing method Contact.edit and click OK to create a new screen.

The Add New Screen dialog will open with an Add/Edit Details Screen template automatically selected with the data we want. This time I’m not going to select all the related children because we’ll be editing each tab of data separately in this design.

Click OK and this will open the Add Edit Contact screen in the designer. Go back to the ViewContact screen by clicking the back arrow at the upper left hand side of the designer.

Select the Edit Contact button we just added and change the icon to “Edit”.

Now when we run the application you will see the Edit Contact button in the command bar and clicking it will bring up the Edit screen for our contact.

Now let’s provide editing of data for the rest of our tabs. Go back to the ViewContact screen and select Tile List control for Email Addresses and set it’s Tap action to an existing method: EmailAddresses.editSelected and click OK to create a new screen.

Accept the defaults on the Add New Screen dialog by clicking OK. This will navigate the Screen Designer to the new AddEditEmailAddresses screen. Drag the Email & Email Type fields under the Command Bar and delete the Columns Layout control. We don’t need to display the Contact to the user, this is automatically set for us from the previous screen.

Now go back to the ViewContact screen by clicking the back arrow at the upper left hand side of the designer again. Next select the Command Bar directly above the Tile List and add a new button. Choose the existing method EmailAddresses.addAndEditNew. Notice LightSwitch will correctly suggest that we use the same screen we just created. Click OK.

Select the button and this time set the Icon to “Add” in the properties window. Repeat these steps for PhoneNumbers and Addresses to add editing and adding capabilities to the rest of the tabs. Now when we run it and edit a Contact, you will see a button in the command bar of each of the tabs that allow you to add new child records. If you click an item in the Tile List, you will see the edit screen instead.

As I mentioned this technique of allowing targeted edits of data in separate tabs is useful when displaying large amount of data to users with small form factor mobile devices. Typically users will not be entering large amounts of data but instead be “tweaking” (making small edits to) what data is already there.

However the screen designer is not limited to this screen flow. If you want to display more data on a screen you can totally do that. For instance, in our example it’s unlikely we will have more than three phone numbers, email addresses or addresses for a contact. It might make better sense to show everything on one screen, even if it is a phone, and just have the user scroll the screen vertically. Or maybe we’re targeting tablet users primarily and we don’t want to have to force them to enter the data on small screens with lots of clicks to the Save button. If we’re entering contact information, then most likely we want to capture all the data at once. Let’s see how we can do that.

Master-Details Full Screen Alternative

First let’s change our View Contact screen. First drag all the Add buttons from the child Tabs Command Bars to the top Command Bar. Then drag each of the Tile Lists into the Details Tab and then delete the now empty child tabs. Finally, select the Tile Lists and in the properties window check the “Show Header” checkbox.

This allows the user to see all the information at once. LightSwitch will automatically adjust the screen layout as necessary as we resize our browser. This particular example works well for smaller sets of data because we’ll never have more than a handful of child data.

Here’s what it looks like on my phone when I scroll to the children. Notice the command bar is always shown on the bottom no matter where you scroll. Also if I tap the email link it will start an email automatically and when I tap the phone number link the phone will ask to dial the number. But if I tap on the tile, it will open the associated Edit screen.

You can also add specific buttons to edit the lists instead of requiring the user to tap on the tiles. In fact, you don’t even need to put buttons in the Command Bar. In the Screen Designer, you can add a button anywhere to a screen simply by right-clicking on a any item in the content tree or by selecting “Add Layout Item” at the top of the Screen Designer and choosing “Button…”.

What about adding a new contact? Let’s go back to our Home screen and add that ability. Since the user is almost always going to add additional data when entering a new contact, let’s create a screen we can use for new contacts that allows us to enter them in one dialog.

Specific to this sample, is a permissions check to allow inserts into the contact table. We’ll need to grant that permission for our debug session if we want to test this so open up the project properties and on the Access Control tab, check off “Granted for Debug” on the app-specific permissions.

Now open the Home Screen and add a button to the Command Bar. Select the existing method SortedContacts.addAndEditNew then select (New Screen…) to Navigate to.

This time go ahead and include all the related data on the screen and name the screen AddContact. Click OK.

We’ll set this screen up very similar to the ViewContact screen but this time we’ll allow editing of all the data fields. First add “Add” buttons to the top Command Bar so the user can add Email Addresses, Phone Numbers and Addresses to their new contact all on one screen. Select the existing methods .addAndEditNew and go with the suggested Navigate To screens we already added previously.

Now just like before, change the Lists to Tile Lists in order to display all the fields in the Tile. This time however, change the field controls to editable controls.

Next drag each of the Tile Lists into the Details Tab and then delete the now empty child tabs. Finally, select the Tile Lists and in the properties window check the “Show Header” checkbox.

You should end up with the screen content tree looking like this.

And now when we run this and add a Contact, you are able to enter all the data at once on one screen.

By default all edit screens are shown as dialogs. As the screen size decreases, LightSwitch will show the dialog as full screen, however, in this case we probably want to force it so that as much of the screen is shown to the user as possible all the time. Particularly for tablet form factors with larger screens, it would be better to show this screen in full view.

We can force the screen to display as full screen by opening the Screen Designer and selecting the screen node at the top. Then in the properties window uncheck “Show as Dialog”.

Now when we run the app again and add a new contact, the screen takes up the full width & height of the browser.

Wrap Up

I hope I showed you a couple different ways you can create master-detail screens with the LightSwitch HTML client (and we did it without writing any code!). Of course you can pick and choose which techniques apply to your situation or come up with a completely different approach. The point is the screen designer is very flexible in what it can do, it just takes a little practice.

In closing, here are some tips to keep in mind:

LightSwitch will automatically adjust the screen layout as necessary for different form factors.
Using Tab controls for master-details screens is a good idea when you will potentially have a lot of child data to display or you are targeting smaller mobile devices like phones. This limits the amount of information that a user has to view/edit at once.
Showing all the data on a screen works well for smaller sets of data where you’ll never have more than a handful of child data to view/edit at once (like in our example) or when your users are using larger devices like tablets.

I should also point out that there are a lot of hooks for creating custom controls and styling of the app that you can utilize for your unique situations, maybe I’ll dig into that in a future post.

Enjoy!

User Name	Answers	Posts
Huy Nguyen MSFT	35	132
Yann Duran	15	118
Dave Kidder	13	24
Babloo1436	12	32
Heinrich M. Wendel	8	29

Beth Massi - Sharing the goodness

Use Your MSDN Benefit to Convert Your Office 365 Developer Preview

Saving Data Across One-to-One Relationships

Our Data Model

Adding Code to the Silverlight Client

Adding Code to the HTML Client

Wrap Up

LightSwitch Community & Content Rollup–April 2013

LightSwitch HTML Client Released in Visual Studio 2012 Update 2!

LightSwitch in Visual Studio 2012 Update 2

LightSwitch Developer Center Freshness

JavaScript Samples for LightSwitch Developers

Sneak Peak: ComponentOne HTML Controls for LightSwitch!

Xpert360 LightSwitch Screencasts on Dynamics CRM & Salesforce Data

New LightSwitch E-Book!

LightSwitch Events

Team Blogs In Your Face!

More Notable Content this Month

LightSwitch Team Community Sites

Final Personal Note

Adding a Signature Control to the LightSwitch HTML Client

Add the Library to your LightSwitch Project

Add the Custom Control

Working with Signatures as Images

Working with Signatures as Vectors

Wrap Up

Using LightSwitch ServerApplicationContext and WebAPI to Get User Permissions

Create Permissions and Secure your Data

Create a Custom Web API on the LightSwitch Server

Retrieve the Permissions on the Client

Check the Permissions in JavaScript Code

Wrap Up

LightSwitch Tip: A Simple Way to Check User Permissions from the HTML Client

Define a Query

Set Up the Screen

Add Some JavaScript Code

LightSwitch All Day Training at DevTeach, Toronto in May

Mastering LightSwitch in Visual Studio 2012

Click here for more details & to register!

LightSwitch HTML Client & SharePoint Resources–Get Started Building HTML5 Business Apps Today!

LightSwitch in Visual Studio 2012 Update 2

New “How Do I” Videos!

Updated Tutorials

Explore LightSwitch Architecture & Hosting Options

JavaScript Samples for LightSwitch Developers

Lot’s more on the LightSwitch Team Blog!

More LightSwitch Team Community Sites

LightSwitch Community & Content Rollup–March 2013

LightSwitch in Visual Studio 2012 Update 2

Getting Started with LightSwitch in Visual Studio 2012 Update 2

Updated Tutorials

“Step-By-Step” with Andy Kung

Festive Themes from Xpert360

Syncfusion Raffle

Events

More Notable Content this Month

Top Forum Answerers

LightSwitch Team Community Sites

Master-Detail Screens with the LightSwitch HTML Client

Setup our Data Model

Add an HTML Client “Home” Screen

Master-Details with Tab Controls

Editing Data in Tabs

Master-Details Full Screen Alternative

Wrap Up