Lightswitch HTML Client: How to re-render an item (re-execute postRender callback)

Question

I am developing an lightswitch HTML client with Visual Studio 2013. I have a screen with a tile list of customers, where the ones that are marked as "premium" (which is a boolean field of the customer entity) are highlighted with an orange background, whereas all other customers stay in the default gray background.

In addition, a label "premium" appears at the bottom of the tile for that customer.

Highlighting the "premium" customers in orange is done in the "CustomerRow_postRender" handler function in the code behind file of the screen, where I check for the premium field and then assign a css class to the tile.

My problem:

When I edit a customer and make it "premium" via the DetailsScreen popup, I save it and come back to my tile list.

After editing, the label "premium" appears in the customers tile, that is fine. But the background does NOT change to orange. I found out that the "postRender" functions will not be re-executed after coming back from editing via a popup screen.

This functionality feels well-designed for me. But which is the way to go? My current workaround is to reload the browser page (F5) - then the tile is rendered in orange.

Thanks for any hint.

Answer 1

In order for this to work correctly, you'll need to configure a dataBind change handler in your table row's postRender routine. The dataBind change handler will monitor for any updates to the value of the field which determines the highlighting, and can be implemented in the following fashion: -

myapp.BrowseCustomers.CustomerRow_postRender = function (element, contentItem) {
    contentItem.dataBind("value.IsPremium", function (value) {
        if (value) {
            $(element).css("background", "orange");
        } else {
            $(element).css("background", "transparent");
        }
    });
};

The 'LightSwitch Mobile Business Apps Succinctly' book by Jan Van der Haegen available for free from Syncfusion has a great section which covers this area (p63+ 'Custom controls: PostRendering').

If you haven't read Jan's excellent book, I'd strongly recommend 'picking up' a copy as it's a great resource.