Tips and Tricks

Blog
Tips and Tricks
Tuesday, June 11, 2019PrintSubscribe
Changing Styling of Values and Labels in Forms
Use simple CSS rules to change the presentation of data in the forms. For example, you can  make the label of a particular field to appear bold and color the value of another like this:



Place the following CSS rules in the file ~/app/css/mystyles.css.

[data-field="CompanyName"][data-control="label"] {
    font-weight: bold;
}

[data-field="ContactName"][data-control="field"] {
    font-weight: bold;
    color: blue;
}

Make to press Ctrl+F5 to refresh the resources loaded in the browser. This will integrate the new stylesheet in the app. Do so every time you make changes.

This is how the customization will look in the Dark theme with Citrus accent.


If you do choose to use colors then make to test presentation with a few theme and accent combinations.

CSS is a powerful mechanism to alter presentation of HTML documents without making physical changes to the markup itself.
Monday, March 4, 2019PrintSubscribe
Batch Editing of Many-to-Many Fields
Batch editing and many-to-many fields are the built-in feature of apps created with Code On Time. Many-to-many fields are provided with an additional option in batch edit mode.

The screen shot shows the user changing Territories and Title or multiple employees. The former is the many-to-many field. It shows the territories that will be assigned to each employee in the batch. The highlighted option "keep original selection" will instruct the framework to expand the already assigned territories with the new values.


The alternative value "delete original selection" will wipe out all existing territories assigned to the user before assigning exactly the same assortment that is visible in the Batch Edit screen.


It is easy to enable batch editing and to present data as many-to-many field with Code On Time!

Select project settings, proceed to the features, and  under Grid Properties enable batch editing in all data controllers. Refresh your project to embed BatchEdit action everywhere.

End users will have access to this command when multiple selection is enabled and at least two items are selected.


The screenshot above shows many-to-many field Territories. Application framework automatically retrieves matching data rows from the junction table and presents child rows as a comma-separated list. Watch the video tutorial explaining configuration of many-to-many fields here.


Tuesday, February 12, 2019PrintSubscribe
Sort Order of Item in Data Lookups
This is the view createForm1 of Products controller. Lookup field CategoryID is configured as a radio button list. Each list item represents a row from Categories lookup table. Items are sorted in an alphabetical order.


The data model of Products controller is based on the table with the same name. A foreign key consisting of CategoryID column is referencing Categories table. Field CategoryName is borrowed from Categories table to be displayed as an alias of Products.CategoryID.


If a dedicated model for Categories table is created, then the app builder will produce a corresponding controller and configure Products.CategoryID field as a lookup.

App builder will set Items Data Controller property of CategoryID field to "Categories", Data Value Field to "CategoryID", and Data Text Field to "CategoryName". Both fields are referencing the fields of the controller specified as a source of items.

Field Items Data View property is left blank by default.


Categories will be ordered by CategoryName when selected from Categories table if Items Data View is not specified.
Set Products / Fields / CategoryID / Items Data View to "grid1". This will force your app to take into account the sort expression of Categories/views/grid1 view. If the sort expression is specified, then the items will be ordered accordingly.

You can set up sort order and sort type directly in the Categories model. For example, you can configure the model to sort categories in descending order.


Alternatively, select Categories/views/grid1 view and enter "CategoryName desc" without quotes in Sort Expression property.

Generate the app and observe the new sort order of categories in the lookup.


Note that the custom sort order will also apply to any other style of lookup.

Consider adding a numeric column to Categories table to have a a data-driven custom sort order.