Go to Scriptcase store

# Search - Date Field

## General Settings

- Data Type : Define the type of field for the application. When set to Date, you can inform a date.
- Search Label : Defines the title of a field in the application. For example: if the field is defined in the database as cmp_name_client, it will be more clear for the comprehension of the user if the name would be “Client Name”.
- Use same label used on the Grid : When this option is enabled, it allows to field to use the same title defined in the grid, in this case the Search Label is not used.
- Watermark: Displays a watermark in the field input.
- Amount of characters : Define the amount of characters allowed for the field.
- Maximum Size : Defines the size of the field.
- SQL Type : Informs the datatype of field in the database.

## Values format

- Regional Settings : Allows to apply the Regional Settings to format the dates of the field. When not enabled, it will be displayed the date separator attribute.
- Date separator : Allows you to inform the separator symbol for the date.
- Display : Select the format of the day for display.
- Internal Format : Allows to define the format the field when the SQL type is different from Date. You need to use the characters A, M and D that correspond to Year, Month and Day.
- Use Combo-box : Allows you to select the date using a combo-box.
  - Year as Combo : Allows to use the year combo to select the date.
    - Initial Year : First year displayed in the combo.
    - Actual Year + : Display the current plus the amount of years informed.
- Month in full textual : Displays the Month format in Full.
- Display Calendar : Enables the a calendar icon beside the field, this allows to select the date from a calendar with the format already setup.
  - New Calendar : Defines if the JQuery calendar (New Calendar) is going to be displayed or the old format.
  - Years Limit : Amount of years displayed in the calendar.
  - View week number : Displays the number of the week in the application.
  - Additional months : Displays the additional months of the calendar.
  - Show Combo year and month : Displays the year and month of the calendar in the combo box.

## Field Behavior

- Position between values : This option sets the position that objects will be displayed.
- Text between values : Text that will appear between values.
- Show Condition : When enabled, it displays the condition of the search in the Grid, it will only work if there is at least one option selected.

## Special Conditions

- All Period : Searches for all periods of dates.
- Today : Searches in today’s date.
- Yesterday : Searches in yesterday’s date.
- Last 7 days : Searches the last 7 days. Ex: ((01/01/2017 01/07/2017).
- This month : Searches the dates from the first day of the current month.
- Last month : Searches the dates from the first day of lasts month.

## Display Settings

The Display Settings allows to define the CSS for the fields individually. For each Display Settings of Scriptcase, exists the same attributes available for this interface.

- CSS of the Title
  - Font : Allows to choose the font type, that will be applied to the application field title.
  - Font Size : Allows to choose the the font size, that will be applied to the application field title.
  - Font Color :Allows to choose a color for the font from the color pallet.
  - Background Color : Allows to define the color for the field, the color can be selected from the color pallet.
  - Bold : Applies the bold style to the font.
  - Underline : Applies the underline style to the font.
  - Border Size : Applies the border size to the title of the field.
  - Border Color : Allows to choose a color for the border, using a color pallet to apply to the title.
  - Horizontal Alignment : Allows to position the label of the field in the desired position (left,right,center and justify).
  - Vertical Alignment : Allows to position the label of the field in the desired position (baseline, sub, super, top, text-top, middle, bottom, text-bottom).
  - Width : To define a width for the title of the field.
  - Height : To define a height for the title of the field.
- CSS of the Field
  - Font : Allows to choose the font type, that will be applied to the application field.
  - Font Size : Allows to choose the the font size, that will be applied to the application field.
  - Font Color :Allows to choose a color for the font from the color pallet.
  - Background Color : Allows to define the color for the field, the color can be selected from the color pallet.
  - Bold : Applies the bold style to the font.
  - Underline : Applies the underline style to the font.
  - Border Size : Applies the border size to the field.
  - Border Color : Allows to choose a color for the border, using a color pallet to apply to the field.
  - Horizontal Alignment : Allows to position the field in the desired position (left,right,center and justify).
  - Vertical Alignment : Allows to position the field in the desired position (baseline, sub, super, top, text-top, middle, bottom, text-bottom).
  - Width : To define a width for the field.
  - Height : To define a height for the field.
- CSS of the Input Object
  - Font : Allows to choose the font type, that will be applied to the Input Object. For example: Radio, Select, Text, etc
  - Font Size : Allows to choose the the font size, that will be applied to the application field.
  - Font Color :Allows to choose a color for the font from the color pallet.
  - Background Color : Allows to define the color for the Input Object, the color can be selected from the color pallet.
  - Bold : Applies the bold style to the font.
  - Underline : Applies the underline style to the font.
  - Border Size : Applies the border size to the Input Object.
  - Border Color : Allows to choose a color for the border, using a color pallet to apply to the Input Object.
  - Horizontal Alignment : Allows to position the Input Object in the desired position (left,right,center and justify).
  - Vertical Alignment : Allows to position the Input Object in the desired position (baseline, sub, super, top, text-top, middle, bottom, text-bottom).
  - Width : To define a width for the Input Object.
  - Height : To define a height for the Input Object.

## Help Settings

Allow the developer to set up instructions and hints about the field’s use, allowing the developer to help the users about the system usage.

### Description of the settings attributes.

#### Help Description

In this area, you can set up a text that will be shown in the application according to the type of help selected below.

#### Help Type

#### Hint

Display a default icon ? beside the field. When the mouse is above the icon a help text will be displayed.

#### Text

Display a text inside of a `<span></span>` beside the field.

#### Pop-up

Display a default icon ? beside the field. To display the message just click in the icon that a Pop-up will be displayed with the help text.

> The icon displayed when selecting the types Hint or Pop-up vary according to the theme that is being used in the application. This icon can be modified in the CSS Buttons.

#### Tippy

Displays a standard ? icon next to the field. When you hover the mouse over the icon, the message will be displayed in a more user-friendly way.

##### Help type settings (Tippy)

- Help Description : Defines where the field’s help button will be displayed

- Help button position : Defines the display position of the Tippy hint in relation to the field’s help icon

- Time to open hin Tippy : Defines the time in milliseconds for the Tippy hint to be displayed after the mouse passes over the help icon.

- Time to close hin Tippy : Sets the time in milliseconds for the Tippy hint to be hidden after the mouse leaves the help icon.

- Tippy hint width : Sets the width of the Tippy hint in pixels.

#### Help button position (except Tippy)

Allow to set up where the help button will be displayed in the field, there are two options:

Beside: The help icon will be displayed beside the field.
Column: The help icon will be displayed beside the label of the field.