 |
Main data model discussion page
Combobox Data Model
(1) Introduction
This wiki page is dedicated to discussing the jMaki Combox
(1.1) Examples
Below is an example using the Combobox data model. Data passed to the Combobox widgets will be in JSON format as shown here.
[
{ id : 'al', label : 'Alabama', value : 'AL'},
{ id : 'ca', label : 'California', value : 'CA'},
{ id : 'ny', label : 'New York', value : 'NY', selected : true},
{ id, 'tx', label : 'Texas', value : 'TX'}
]
An optional selected property allows you to define the selected item.
(2) Data Model
The value of a given combobox passed as the value property or via a service property must adhere to the following format.
combobox ::= "[" {<item>} "]"
item ::= "{" "label:" <string>, [<value>] [<selected> ] [<action>] [<id>] "},"
selected ::= "selected: false"
action ::= "action:" "{" [<topic>] <message> "},"
topic ::= "topic:" <string>
message ::= "message:" <obj>
id ::== "id" : <string>
obj ::= <string> | <JavaScript object literal>
JSON schema format is:
{
"description" : "jMaki ComboBox",
"type" : "array",
"items" : {
"type" : "object",
"properties" : {
"id" : {"type": "string", "optional":true,},
"label" : {"type": "string"},
"value" : {"type": "string", "optional":true,},
"selected" : {"type": "boolean","optional":true, "default":false},
"action" : {"type" : "object","optional":true,
"properties": {
"topic": {"type" : "string", "optional" : true},
"message": {"type" : ["string","object"], "optional" : true} }
}
}
}
}
(2.2) Property Descriptions
The combobox array of items. Each time has a label property node.
The label property defines the text that will be displayed for this particular node. This element is required.
The id property defines an id associated with the item. This can later be used to select the item. It can be the same as the value but does not have to be.
The value is published as the value property of the payload when an item is selected.
The selected property if the item is selected. As we can not prevent multiple items with selected = true the last one with selected = true wins
(3) Event Handling
Events are published to the topic assigned to the given widget instance. Events include:
Subscribe Events
| event type | argument (object literal) |
| select | { value: <itemId>} |
| setValues | { value: <[item]>} |
Subscribe events allow you to manipulate a given instance of a widget. The event names are appended to the the subscribe topic name following a "/". For example "setValues" for a dojo.combobox would be "/dojo/combobox/setValues"
- select - Selects a given item with the provided value.
jmaki.publish("/dojo/combobox/select", {
targetId : 'ca'}
});
- setValues - The payload value passed to the widget is added to the the table and the filters will be applied.
jmaki.publish("/dojo/combobox/setValues", {
value :
[
{ label : 'Alabama', value : 'AL'},
{ label : 'California', value : 'CA'},
{ label : 'New York', value : 'NY', selected : true},
{ label : 'Texas', value : 'TX'}
]
});
Publish Events
These are the events published to the "publish" topic associated with a widget.
| Event type | Payload | Event |
| onSelect | {widgetId : uuid , topic : , type : 'onSelect' , targetId : selected_id, value : selected_value} | Publshed when a user selects a item. |
-- Main.gmurray71 - 29 Sept 2007
-
|