Widget SortableTable

From eyeOS Wiki

Contents 1 Introduction 2 Widget Use 2.1 Available Generic Keys 2.2 Specific keys 2.3 Methods 2.4 Can be serialized

Introduction

The widget Sortabletable is a table that can be filled (or emptied) with rows dynamically. Each column has the possibility of sorting the table according to the criteria of that column, even if its content is numerical, a date, or a string.

Widget Use

Available Generic Keys

• horiz: specifies whether its horizontal coordinate must be taken from the left (0) or the right (1) border of its container element. Default is 0 (left).

• vert: specifies whether its vertical coordinate must be taken from the top (0) or from the bottom (1) border of its container element. Default is 0 (top).

• x: specifies the horizontal displacement inside its "father" element, in pixels. Default is 10 pixels.

• y: specifies the vertical displacement inside its "father" element, in pixels. Default is 10 pixels.

• cent: specifies how the widget should be centered. Possible values are:
  • 0: no centering. This is the default value.
  • 1: center both horizontal and vertically.
  • 2: center horizontally.
  • 3: center vertically.
  • 4: place the widget at the horizontal and vertical center of its container element.
  • 5: place the widget at the horizontal center of its container element.
  • 6: place the widget at the vertical center of its container element.

Please note the difference between options 1-3 and options 4-6. Options 1-3 calculate the size of the widget to ensure that the center of the widget is placed at the central point of its container, while options 4-6 set the central point coordinates as the widget's position.

• visible: toggles the widget visibility. Possible values are 0 (hidden) or 1 (visible). Default value is 1.

• width: sets the width of the widget. Default value is 100.

• height: sets the height of the widget. Default value is 100.

Specific keys

• master:
• theader: specifies in the form of an indexed array for each table column, the caption the head of each column.
• sortypes: specifies in the form of an indexed array for each table column, the sorting method that will be used when clicking the head of a certain column. Valid sorting types are:
  • Number
  • Date
  • CaseInsensitiveString: orders alphabetically as case insensitive strings.
  • String: orders alphabetically, caring about casing.
  • Html: (orders?)
  • Hidden: makes this column invisible.

Note that in order to allow sorting all columns, both 'theader' and 'sortypes' attributes must have the same number of elements.

• sizeUnit: specifies in which measure unit width and height attributes are expressed. Default value is ‘px’ (pixels). Unit is only valid if expressed as a CSS size unit.
• signal:

Methods

 addEvent($eventName,$eventFunc,$args = )

• Description: makes the widget execute code every time certain event is triggered.

• Arguments:
  • eventName: the name of the JS event. Example: onchange.
  • eventFunc: the JS code to be executed.
  • args: if any, the args passed to the system.

 addRow($params)

• Arguments: $params is an indexed array containing a value for each column in the table.

• Description: adds a new row to the table. There must be a value passed to addRow for each column in the table.

 delRow($params)

• Arguments: $params is the value of the row to be deleted.

• Description: deletes the specified row from the table.

 hide()

• Description: makes the widget invisible.

• Arguments: none.

 remove()

• Description: removes this widget, along with its child widgets.

• Arguments: none.

 setCss($params)

• Description: sets CSS atributes to a widget.

• Arguments:
  • params: specifies, in the form of an associative array, the CSS attributes to be applied. Remember that both the key and value of each element must be valid CSS properties and values respectively.

 setHeader($params)

• Arguments: $params must be an indexed array with a column name in each element.

• Description: adds the colums specified by $params. The value of each element will be used as the caption of the columns.

 setHeight($height)

• Description: changes the height of the widget.

• Arguments:
  • height: natural number specifying the new height.

 setSortypes($params)

• Arguments: $params must be an indexed array with a valid sorting type in each element.

• Description: specifies which will be the sorting method used in each column. Valid sorting types are:
  • Number**
  • Date**
  • CaseInsensitiveString: orders alphabetically as case insensitive strings.
  • String: orders alphabetically, caring about casing.

 setWidth($width)

• Description: changes the width of the widget.

• Arguments:
  • width: natural number specifying the new width.

 setX($x)

• Description: changes the horizontal position of the widget.

• Arguments:
  • x: natural number specifying the new X coordinate.

 setY($y)

• Description: changes the vertical position of the widget.

• Arguments:
  • y: natural number specifying the new Y coordinate.

 unhide()

• Description: makes the widget visible.

• Arguments: none.

Can be serialized

Yes. By the default this widget is always serialized. You can avoid to serialize it by passing number 1 as the argument of its show() method.