User Interface

If an action group with the scope of “Action Column” has a few actions with long header text then you may end up with the following presentation of actions.  Action buttons will not wrap and will take a significant amount of real estate on the page.

You can correct this situation by creating a custom CSS stylesheet.

Select the project name on the start page of the web application generator and choose Develop project action. Your development environment will start up.

Select ~/App_Themes folder in your project and add a new CSS stylesheet to the folder that has the same name as the namespace of your web application. The default web application namespace is MyCompany.

Right-click the folder name, select Add New Item… option in the context menu and proceed to add a new Style Sheet item to your project. Change the name of the item to anything your want or leave the default value in the Name input box. Click Add button and the new CSS stylesheet file will become a part of your project.

Enter the following CSS rules to the file.

table.DataView tr .Cell.ActionColumn
{
    white-space:normal!important;
}

table.DataView tr .Cell.ActionColumn a span
{
    display:inline-block;
    white-space:normal;
}

table.DataView tr .Cell.ActionColumn a
{
    margin-top:2px;
    display:inline-block;
}

Save the file and bring up the browser window, hit Refresh button of your browser and the presentation of the Actions column will change. Individual actions will be displayed as multi-line boxes and will wrap to the next line when needed.

Code On Time web applications now support configuration of search options rendered on search bars and displayed in context menus of columns headers in “grid” views.

The following picture shows the Search Configuration section of the UnitPrice data field.

End users are required to enter “between” values on the search bar and have an option to search for products with unit price “greater than” a specified value.

If the search bar is activated then the Unit Price options are “between” and “greater than”.

The screen shot below shows the initial state of the search bar and available filter options in the context menu of the Unit Price column.

The default search option for text fields is “equal”.

It is now possible to override the search option for the entire application.

The following snippet of C# code shows a class that redefines search options for all text fields with the exception of Product Name.

The “contains” search option becomes the first option on the search bar. The context menus will not be rearranged and will show only the options specified by application developer.

using System;

namespace MyCompany.Data
{
    public partial class Controller
    {
        protected override void ConfigureDataField(ViewPage page, DataField field)
        {
            if (field.Type == "String" && field.Name != "ProductName")
                field.SearchOptions = "$contains, *";
        }
    }

}

Notice that the “*” option automatically completes all standard search options.

This is the result of the global field configuration.

The ability to configure search mode and options is available in Premium and Unlimited editions of Code On Time.