LightSwitch HTML Edition
Member Of Wijmo Collection Control
Base Control wijgrid
Description Creates a customizable multi-column data grid that supports selection, editing, sorting, filtering, scrolling, and grouping.
Usage Apply to a collection with at least one visible entity property. The order and visibility of the entity properties determine the display order and bindings of individual columns.
Generated Code
Copy Code
myapp.ScreenName.EntityName_render = function (element, contentItem) {

    var table = $("<table/>");

    contentItem.value.oncollectionchange = function () {
        var grid = c1ls.getGridContent(table, contentItem);

            // initialization
            columns: grid.Columns,
            data: grid.Rows(),

            // editing
            allowEditing: false,
            afterCellUpdate: grid.OnCellUpdate,
            currentCellChanged: grid.OnCellChanged,

            // sorting
            allowSorting: true,
            sorting: grid.Sorting,

            // filtering
            showFilter: false,
            filtering: grid.Filtering,

            // selection
            selectionMode: "singleRow",
            showRowHeader: grid.ShowRowHeader,
            showSelectionOnRender: false,
            cellClicked: grid.OnCellClicked,
            cellStyleFormatter: grid.OnCellFormat



This widget will not render until the screen collection to which it is bound is loaded (that is, when the oncollectionchange event fires). If the underlying query is re-executed with different sort or filter criteria, then the widget will re-render accordingly. The final line of code calls the c1ls.renderControl method to ensure proper rendering in tabs and popups, and to handle collections that have already been loaded.

The utility method c1ls.getGridContent parses the child properties defined in the screen designer and returns an object used to initialize the wijgrid control. This object has the following properties:

Note that you cannot substitute your own array for the Columns array returned by c1ls.getGridContent. However, you can modify this array prior to calling the wijgrid constructor, as in the following example:

Copy Code
var grid = c1ls.getGridContent(table, contentItem);

var qty = grid.FindColumn("Qty");
qty.dataFormatString = "n0";
qty.aggregate = "sum";
qty.footerText = "Total={0}";

    // initialization
    columns: grid.Columns,
    data: grid.Rows(),
    showFooter: true,

    // remaining options...

Note that the widget's showFooter option needs to be explicitly enabled for the column option footerText to have any effect.

See Also



Copyright (c) GrapeCity, inc. All rights reserved.

Documentation Feedback  |  Product Support Forum