How to add a section action: handling the selection of a single record
Glossary Item Box
Case description
Implement the action displaying the order creation date in the data window for the [Orders] section. The action must be available only for orders at the [In progress] stage.
 |
NOTE A selected record is addressed via the ActiveRow attribute of the section view model which returns the value in the primary column of the selected record. This value may be used to receive values in other fields of the selected object, for example, from the list data collection stored in the GridData property of the list view model. |
Case implementation algorithm
1. Create a replacing page for the [Orders] section in a custom package
A replacing client module must be created and [OrderSectionV2] must be specified as the parent object in it (Fig. 1).
The procedure for creating the replacing page is described in the article Creating a custom client module schema.
Fig. 1. — Properties of the replacing page for the [Orders] section
2. Add a string with the [Actions] menu item to the localizable string collection of the section replacing schema
For this purpose, select [Add] by right-clicking the [LocalizableStrings] structure node (Fig. 2).
Fig. 2 — Adding a localizable string to the schema
Fill in the properties for the created string as shown in Fig. 3.
Fig. 3. — Properties of a custom localized string
3. Add the method implementation to the methods collection of the view model
- isRunning checks whether the selected order is at the Execute stage;
- isCustomActionEnabled checks the availability of the added menu item;
- ShowOrderInfo action handler method displays the scheduled end date of the selected order in the data window.
For this purpose, add the program code of the section replacingmodule to the source code tab. Required methods are added to the methods collection of the view model.
define("OrderSectionV2", ["OrderConfigurationConstants"], function(OrderConfigurationConstants) { return { // Name of the section schema. entitySchemaName: "Order", // Methods collection of the section view model. methods: { // Method checking the stage, at which this order is. // A value of the primary column of the selected list record is passed as a parameter. isRunning: function(activeRowId) { // Receiving the collection of data on list view of the [Orders] section list. var gridData = this.get("GridData"); // Receiving a model of the order selected by the set value of the primary column. var selectedOrder = gridData.get(activeRowId); // Receving the model property – status of the selected order. var selectedOrderStatus = selectedOrder.get("Status"); // The value of the selected order status is compared to the value of the "In progress" type and // the method returns true or false depending on the comparison result. return selectedOrderStatus.value === OrderConfigurationConstants.Order.OrderStatus.Running; }, // The method determines whether the menu item will be available. isCustomActionEnabled: function() { // An attempt to receive the active record Id is made. var activeRowId = this.get("ActiveRow"); // If the Id is determined (i.e. a record is selected in the list) and the selected order has // the "In progress" status, true is returned; otherwise false is returned. return activeRowId ? this.isRunning(activeRowId) : false; }, // Action handler method displaying the order creation date in the data window. showOrderInfo: function() { var activeRowId = this.get("ActiveRow"); var gridData = this.get("GridData"); // Receiving the order creation date. var dueDate = gridData.get(activeRowId).get("Date"); // Calling the standard system method to display the data window. this.showInformationDialog(dueDate); } } }; });
4. Override the getSectionActions virtual method wherein the handler method must be bound to an action
For this purpose, add the code of the overridden method to the methods collection.
// Overriding of the base virtual method which returns the section actions collection. getSectionActions: function() { // The parent implementation of the method is called to receive // the collection of initiatited actions for the base section. var actionMenuItems = this.callParent(arguments); // Adding a separator line for visual separation of a custom action from the list // of actions of the base section. actionMenuItems.addItem(this.getButtonMenuItem({ Type: "Terrasoft.MenuSeparator", Caption: "" })); // Adding a menu item into the section actions list. actionMenuItems.addItem(this.getButtonMenuItem({ // Binding the menu item title to the localizable schema string. "Caption": {bindTo: "Resources.Strings.CreateDateActionCaption"}, // Binding the action handler method. "Click": {bindTo: "showOrderInfo"}, // Binding the property of the menu item availability to the value which returns the isCustomActionEnabled method. "Enabled": {bindTo: "isCustomActionEnabled"} })); return actionMenuItems; }
5. Save the created replacing schema
When the schema is saved and the system web-page is updated, a new action will appear in the [Orders] section. It will be active when selecting an order at the “In progress” stage (Fig. 4).
Fig. 4. – Demonstrating the case implementation result
