Parent | Child | Previous | Next
 

Calendar Component Properties

IN THIS PAGE

Description

A list of calender component properties.

Calendar Views Displayed Properties

  • Show Day View

    The Day view shows events for a specific date.

  • Show Week View

    The Week view displays events for a certain week. Events are displayed within vertical timelines. If you have an "All Day" event, it will be displayed at the top of the "Week" view.

  • Show Month View

    Month view displays events for a particular month. Only a few events for a given date are displayed. Other events are hidden and are shown when a "View All" link is clicked.

  • Show Custom View

    Month view displays events for a particular month. Only a few events for a given date are displayed. Other events are hidden and are shown when a "View All" link is clicked.

  • Show Agenda View

    Agenda view displays events in a list view. They are grouped by a day. You can scroll backwards and forwards to view your list of events.

  • Show Work Week View

    The Work-Week View displays events for the working days in a particular week (monday thru friday)

  • Show Workshift View

    Workshift view displays events / task for a person. Persons can be grouped. For example: they can be grouped by departments like Managers, Sales, Trainers, etc.

  • Show Groups/Events View

    The Groups / Events view displays groups on x axis and events on vertical timelines. Groups could represent Persons or a Resource like Conference Rooms.

Calendar Options Properties

  • Start time

    Specify the start time for the calendar. Enter a value between 0 and 24. Must be less than the 'End time'.

  • End time

    Specify the end time for the calendar. Enter a value between 0 and 24. Must be greater than the 'Start time'.

  • Date to show on initial display

    Specify what date to show on the calendar when it is initially displayed. Enter 'Today' for today's date. To enter an explicit date use yyyy/mm/dd format.

  • Calendars to show

    Specify the calendars to show. The calendar component can show events from multiple 'logical' calendars. E.g. the calendar for 'Dr. Smith', 'Dr. Jones' etc. You can specify here which calendars to how. Specify 'All' to show all calendars. Otherwise, enter a comma delimited list of calendar ids.

  • Readonly calendars

    You can specify an explicit list of calendars that should be read only. Enter a comma delimited list of calendar ids. Contrast with the 'Set calendar to readonly' property which sets all calendars shown to be readonly.

  • Slot height

    Specify the height of each hour slot shown on the calendar. The slot will be sub-divided into a number of areas, depending on the setting for 'interval'. Specify a value in pixels.

  • Interval

    Specify how many intervals to divide the slot into. Enter a value between 1 and 4. For example, if you enter 4, the slot will show four 15 minute intervals.

  • Show left navigation bar

    Specify if the left navigation bar (contains a mini calendar for picking date range and checkboxes to select which calendars are shown) should be shown.

  • Show quick filter

    Specify if the QuickFilter links should be shown. Only relevant if the left navigation bar is not shown. If you don't display this then you will not be able to show/hide appointments for different calendars.

  • Show all day events

    Indicates if all-day events should be displayed in week/day view.

  • Set calendar to read only

    If the calendar is set to read only, the user cannot add new events or drag and drop to change events. The grids may still be used to modify events unless they are also set to read only. Contrast with the 'Readonly calendars' property which allows you to set an explicit list of calendar Ids to readonly.

  • Default view

    Default view displayed when the calendar is initialized and loaded. Choices include.

  • First day of week

    Defines the start day of the week, either Sunday or Monday. Choices include.

  • Time format

    Specify if you want to display times using a 12 hour or 24 hour format Choices include 12, 24.

  • Default language

    The calendar currently supports English, French, Italian and Spanish. Choices include.

  • Calendar height

    Specify the height of the calendar control in pixels.

  • Calendar width

    Specify the width of the calendar control. Value can be entered as pixels, or percentage. Include units in value. Examples: 500px, 99%. Typically, you will set this to 99% and adjust the 'Calendar IFrame container width' to control the width of the calendar.

  • Calendar IFrame container width

    Specify the width of the IFrame in which the calendar is rendered. Use CSS syntax. e.g. 6in, 1200px, etc.

  • Calendar IFrame container height

    Specify the height of the IFrame in which the calendar is rendered. Use CSS syntax. e.g. 6in; 1200px, etc.

  • Draw border around

    Draw a border around the calendar Iframe container.

  • Container style

    =Specify the inline style for the calendar IFrame container.

  • Container master template

    You can typically leave this blank. It is for special situations only. The calendar runs inside an <iframe>. You can define an HTML template that contains a placeholder for the calendar <iframe>. Use {IframePlaceholder} in your HTML template as the placeholder for the calendar <iframe>.

  • Calendar master template

    You can typically leave this blank. It is for special situations only. The calendar runs inside a <div>. You can define an HTML template that contains a placeholder for the calendar div. Use {calendar} as the placeholder in your HTML template.

Referenced Grids and Modal Dialog Size Properties

  • New event grid name

    Select a grid to display when adding a new event to the calendar. This grid will be displayed in a modal popup window when the user adds an event to the calendar by a click and drag event.

  • Update event grid name

    Select a grid to display when updating an event. This grid will be displayed in a modal popup window when the user clicks on an existing event.

  • Popup grid window width

    Specify the required width of the modal popup window that contains the new event and update event grids.

  • Popup grid window height

    Specify the required height of the modal popup window that contains the new event and update event grids.

License Information Properties

  • Calendar license code

    Enter a valid calendar license code, or a comma delimited list of licenses. The calendar is licensed per domain. If you want to read the license from the Web Project Settings, then set the license number here to: <GetFromProjectSettings>

Data Binding - 'Calendars' table Properties

  • Table type

    Specify the table type of the 'Calendars' table. This is the table that contains information about the various types of calendars you wish to display.

  • Connection string

    Specify the connection string to the Database

  • Table name

    Specify the table name

  • Sequence name

    Certain databases (e.g. Oracle, Postgres) use sequences for auto-increment values.

  • Field map

    Specify the field map - how fields in your table map to the required fields. Leave blank if your table uses field names that match the default fields names for this table.

Data Binding - 'Events' table Properties

  • Table type

    Specify the table type of the 'Events' table. This is the table that contains information about each appointment.

  • Connection string

    Specify the connection string to the Database

  • Table name

    Specify the table name

  • Sequence name

    Certain databases (e.g. Oracle, Postgres) use sequences for auto-increment values.

  • Field map

    Specify the field map - how fields in your table map to the required fields. Leave blank if your table uses field names that match the default fields names for this table.

Component to use for Editing Events Properties

  • Component name

    Specify the name of the UX component that you want to use to enter information about an event when you create a new event, or edit the details of an existing event.

  • Additional fields in Events table

    Specify the names of any additional fields you have added to the Events table.

    If you have already created the UX Component to edit events, then you can edit the UX Component to specify additional fields. Add the fields to the UX component, and then register them in the following Xbasic function that are defined in the UX Component:

    • addAdditionalFieldsToEventsTableDef
    • bindAdditionalFieldsToControls
    • setAdditionalFieldsFromControls

  • Automatically create new calendar if not found

    When the calendar is opened from a Javascript action, you can specify the Id of the calendar to show. If there are no calendars that match the specified Id, do you want to automatically create a new entry in the 'Calendars' table? When you define the action that opens the calendar, you will be able to set the value of the 'DescriptionForNewCalendar' argument, which will set the 'Description' field in the new calendar record that is created.

  • Use master style

    Should the component that is used for editing use the same style as the Calendar component, or the style it was defined to use? If you uncheck this box, you need to include the style name for the component in the 'Additional component styles' property.

Pop-up Window Definition Properties

  • Window title

    Specify the title for the pop-up window where events information is edited.

  • Working message

    Specify the working message that is displayed in the pop-up window while Alpha Anywhere is working.

  • Working icon

    Specify the icon that is shown in the pop-up window while Alpha Anywhere is working.

  • Window height

    Specify the size for the pop-up window where events information is edited. Use CSS syntax e.g. 300px, 3in, etc. If you leave this blank, the window will be automatically resized based on the size of the UX Component.

  • Window width

    Specify the size for the pop-up window where events information is edited. Use CSS syntax e.g. 300px, 3in, etc. If you leave this blank, the window will be automatically resized based on the size of the UX Component.

  • Window is resizable

    Specify if the pop-up window can be resized.

  • Window position

    Specify where the window will be shown.

Window Animation Properties

  • Animation

    Specify if the window should be animated when it is shown or hidden.

    If the window contains an IFrame, which in turn contains a PDF viewer, animation may not work well and should not be used.

  • Show animation style

    Select the animation method to use when the window is shown. Fade and Slide use methods in jQuery core. Other options require jQueryUI.

  • Show animation speed

    Specify the animation speed. You can select a pre-defined option (slow = 600 milliseconds, fast = 200 milliseconds), or you can enter an explicit value in milliseconds.

  • Hide animation style

    Select the animation method to use when the window is closed. Fade and Slide use methods in jQuery core. Other options require jQueryUI.

  • Hide animation speed

    Specify the animation speed. You can select a pre-defined option (slow = 600 milliseconds, fast = 200 milliseconds), or you can enter an explicit value in milliseconds.

Pop-up Window Javascript Events Properties

  • onInitialize

    Specify the Javascript code to execute the first time the window is shown.

  • onBeforeShow

    Specify the Javascript code to execute before the window is shown.

  • onShow

    Specify the Javascript code to execute when the window is shown.

  • onBeforeHide

    Specify the Javascript code to execute before the window is hidden.

  • onHide

    Specify the Javascript code to execute when the window is hidden.

  • onFocus

    Specify the Javascript code to execute when the window gets focus.

  • onMove

    Specify the Javascript code to execute when the window is moved.

  • onResize

    Specify the Javascript code to execute when the window is resized.

More Component Properties Properties

  • Style name

    Click the button to select a new style, or edit the existing style. You can also use <ProjectStyle> or <Session:varname>

  • Class map

    Specify how the abstract CSS class names used in this component map to physical CSS class names in your style sheets.

  • Resolve abstract CSS class names

    Replace abstract CSS class names with physical CSS class names. This should only be un-checked if you are in development mode and you want to determine what the abstract CSS class name is for a particular element in the component.

  • Style overrides

    By default, the Tabs, Accordions, pop-up Windows, Lists (edit-combo, auto-suggest, etc.) are style using the selected component style. You can override the style for these elements. This might be necessary for certain styles where the default appearance for these elements do not work well.

  • Font size

    Specify if the fonts in the Component should be scaled to make the component larger or smaller. Select 'Medium' for no scaling (i.e. the fonts shown will match those defined in the style sheet). Choices include.

  • Font scaling option

    Specify which CSS classes should be scaled. If you choose All, the fonts in these classes will be scaled, in addition to the fonts in the CSS classes specific to the Style that you selected: BODY, TABLE, TH, TR, TD, UL, OL, LI, P, A, BLOCKQUOTE. Choices include All, GridStyleClassesOnly.

  • Master template

    Specify an optional Master Template. This allows you to place arbitrary HTML surrounding the component.

CSS Properties

  • Local CSS definitions

    Define any local CSS classes. You can include SASS syntax in your CSS definition. For more information on SASS syntax see http://sass-lang.com/

  • Additional component styles

    Specify if any other styles (in addition to the primary style for the component) must be included. Enter a comma delimited list of style names. e.g., GlassOlive,Airport

  • CSS Linked files

    Specify any CSS files that should be linked (in addition to the primary style for the Component). Enter a comma delimited list of filenames.

Arguments Properties

  • Arguments

    Define arguments. Arguments can be bound to page, session and cookie variables. Argument values are passed into all server-side Xbasic event handlers in the component.

    The Calendar component requires the following arguments are defined:

    Argument
    Description
    CalendarsToShow

    Defines what calendars should be shown. Can be 'All' or a comma delimited list of calendar IDs

    ReadOnlyCalendars

    Defines what calendards are read-only.

    InitialDate

    Defines the initial date to display in the Calendar. Can be 'Today' or a date in format 'yyyy/mm/dd'.

    DescriptionForNewCalendar

    Defines the default description when a new calendar is created. See Automatically create new calendar if not found.

    IF REQUIRED ARGUMENTS ARE MISSING, THEY WILL BE AUTOMATICALLY ADDED WHEN THE COMPONENT IS SAVED.

Javascript Properties

  • Javascript Linked files

    Specify any Javascript files that should be linked. Enter a comma delimited list of filenames.

Other Properties

  • Language definitions

    Define strings for different languages.

  • Active language

    Specify the active language to use for translating strings tagged with <a5:r>..</a5:r> tags. Setting the property here is useful for testing purposes. In a real application you can set the 'session.__protected__activeLanguage' variable to specify the active language. To select the default language, enter <Default> or leave this property blank.

  • Head section tags

    Specify any tags you want to appear in the HEAD section of the page that hosts this component.

  • Component must run in IFrame

    Specify if this component must run in its own IFrame.

  • IFrame inline style

    Specify the in-line style for the IFrame. You should set a height and width for the IFrame. e.g. width: 6in; height 4in;

Advanced Properties

  • Capture debugging information

    If you check this property, all SQL or DBF commands used to read and write data to the Calendars and Events tables, and the Javascript commands (generated by Server-side event handlers) sent to the Calendar object or logged to the Trace files. (See the Application Server control panel for the folder where the Trace files are written).

  • Other properties

    Specify other properties of the component

  • Save component format

    Specify if the component should be saved as a binary file or as formatted JSON.

    Formatted JSON saves the properties in clear text. This is useful if you are using some type of source or version control system and the system has a method to show differences between versions. Choices include Binary, Formatted JSON.