Page History
...
simply by specifying it's type:
Code Block language js "someTextProperty": "string"
with additional configuration options if you want/need to tell Servoy more about how this property should be treated (this is just a sample, all configuration options are optional and each one will be detailed later); "type" is mandatory.
Code Block language js "someTextProperty": { "type": "string", "tags": { "scope": "design" }, "values": [ { "Predefined Text 1": "sample text 1" }, { "Predefined Text 2": "sample text 2" } ], "default": "nothing interesting" }
...
| Code Block | ||
|---|---|---|
| ||
"someTextProperties": { "type": "string[]", "elementConfig" : {
"tags": { "scope": "design" },: { "scope": "design" },
"values": [ { "Predefined Text 1": "sample text 1" }, { "Predefined Text 2": "sample text 2" } ],
"default": "nothing interesting" }
} } |
...
| pushToServer value | description |
|---|---|
| reject | this is the default, no data synchronization from client to server for this property |
| allow | data changes from client to server are allowed |
| shallow | same as allow, but sablo will also add a watch on the model (in the client) and send changes to the server; the watch is based on object reference/primitive value (more performant, but in case of structured/nested objects it will only trigger data synchronization when the objects are different by reference, even if they are actually 'equal' by content) |
| deep | same as allow, but sablo will also add a watch on the model (in the client) and send changes to the server; the watch is based on object equality (compares old and new values of structured/nested objects, less performant because it keeps and compares two copies of structured/nested objects); "deep" is mostly meant to be used for properties of type 'object' - that can contain nested JSON - and that for any change (doesn't matter how little) will send over the complete value to the server. |
...
Information about how "pushToServer" works in particular with Array property type and with Custom object property types can be found on the wiki pages of these property types.
For example:
| Code Block | ||||
|---|---|---|---|---|
| ||||
"model": {
"searchfield": { "type": "string", "pushToServer": "shallow" }
} |
Note that in Servoy, data-provider property changes are sent to server using svy-apply (servoy api call) and svy-autoapply (directive); for these to work properly, these properties should set pushToServer to allow. Otherwise those data provider properties will be read-only.
...
Properties can be configured with special tags that may be interpreted by the deployment and/or development environment.
Supported tags are: scope, directEdit, addToElementsScope addToElementsScope, logWhenOverMax, allowaccess, directEdit, useAsCaptionInDeveloper + captionPriority and showInOutlineView, showInOutlineView and main.
scope: Restricts the model property to: 'design', 'runtime' or 'private'.
Design means property can only be assigned from designer (not from scripting). Runtime means the property cannot be assigned from designer (will be hidden in Properties View). Private is an internal property, that should only be used by component itself (so component.js or component_server.js). Will not show in Properties View and cannot be assigned from scripting.
addToElementsScope : boolean
For component type, specify whether component should be added to elements scope. Default is false, so component can be accessed only via component property. If true, will be accessible like any other element of the form.
logWhenOverMax: boolean
For the valuelist property type. If set to false, no logging will be done when only sending "max" number of items to the browser even though the valuelist does contain more than "max" items. Default is true.
allowaccess: string or array of strings
This tag can define if an edit (sent from browser to server) of this property is allowed even if properties such as "visible" or "enabled" (of the component or parent form) are false. By default, if the visibility of a component or its parent form is false, Servoy doesn't allow the modification (coming from browser) of any other property (it blocks it and logs it on server). With this tag you can say for a property that changing it should be allowed even in these situations; for example on "size" property you could say: I allow it for "visible"; or for both: ["visible", "enable"]
directEdit: boolean
One property of a component can be tagged as directEdit for designer, this way that property can be edited directly by double clicking the component (for example text property on label/button).
useAsCaptionInDeveloper : boolean and captionPriority : integer (> 0) (starting with Servoy 8.3)
...
| Code Block | ||||
|---|---|---|---|---|
| ||||
(...)
"model": {
"columns": { "type": "column[]", "droppable": true, (...) },
(...)
"types": {
"column": {
"dataprovider": { "type": "dataprovider",
"tags": { "useAsCaptionInDeveloper" : true,
"captionPriority" : 2 }, (...) },
"headerText": { "type": "tagstring",
"tags": { "useAsCaptionInDeveloper" : true,
"captionPriority" : 1 }},
(...) |
showInOutlineView: boolean (for Servoy < 8.3)
In the Outline View, Custom Type objects have the name of the type as lables. The showInOutlineView:true tag can be added to any property definition in order to append the design time value of that property to the label of the custom type object in the Outline View. If you are using Servoy >= 8.3 please use "useAsCaptionInDeveloper " and "captionPriority" instead. Starting with that version "showInOutlineView" : true is equivalent to "useAsCaptionInDeveloper" : true.
main: boolean (starting with Servoy 8.4)
...
| Code Block | ||
|---|---|---|
| ||
"horizontalAlignment": {
"type": "int",
"tags": { "scope": "design" },
"values": [
{ "LEFT": 2 },
{ "CENTER": 0 },
{ "RIGHT": 4 }
],
"default": -1
} |
...
But for a button or label in which you initially want some text, but reverting should really clear the text, the default value is not really usable (the label text should be able to be nothing, in case only an image is meant to be shown in that label). For this we have the attribute "initialValue":
...
| Code Block | ||||
|---|---|---|---|---|
| ||||
"model": {
"editable" : { "type": "protected", "blockingOn": false, "default": true }
} |
...
Protection can be done for specific properties or functions.
In this example, when protectCustomer is set to true, customerAddress can still be changed the the client, but customerName and removecustomer are protected.
...
controller.readOnly = true in the developer will set this boolean to a property called "readOnly" of a webcomponent, this property should be a runtime or even a hidden property. It should not be a design time property, because the system can set it at any time (to true or false).
If you want also a design time property to control the editable state then add a second property, see example below, and then having a tag in the template like: ng-readonly="model.readOnly || !model.editable"
| Code Block | ||||
|---|---|---|---|---|
| ||||
"model": {
"readOnly": { "type": "protected", "blockingOn": true, "default": false, "tags": {"scope": "runtime"} },
"editable": { "type": "protected", "blockingOn": false, "default": true }
} |
With this property a component can do its thing to set or unset the readonly mode for itself.
...
See as an example our bootstrap textbox: https://github.com/Servoy/bootstrapcomponents/tree/master/textbox
Findmode findmode is a special type: Findmode property type which can be used to set all kind of other properties which are normally protected from changing on the client side. Or you can just use it as a type for any property you want:
| Code Block | ||||
|---|---|---|---|---|
| ||||
"model": {
"myfindmodeproperty": "findmode"
} |
...
When the find mode changes the boolean value of your property will also change. This way you can react to a form/foundset going into find mode. Like resetting a specific format, allowing any kind of input.
...
Overview
Content Tools
Activity