Working with VDL Function Options
<script>
VDL('tag name', {object});
</script>
tag
attributes
modifiesDescendants
requiredParent
transform
template
errorTargetSelector
createViewModel
All of these options are documented via the VdlExtension
class in the Making REST Requests with the JavaScript API, but these are particularly useful.
tag
If you are creating a custom tag extension, define the tag text that will be used by providing a string. Alternatively, if your extension is an attribute extension, omit this property and define an attribute instead.
<script >
VDL('extension-name', {});
</script>
attributes
Use this option to inform your custom extension about any optional or required attributes, whether they accept a dynamic expression and various other properties that may be useful to your extension.
transform
// within a vdl-extension script block
VDL('my-extension', {
transform: function (element, attributes, api) {
// Your custom JS code in here
}
});
The
transform
function is called by the VDL system with three optional arguments:
element
—the tag and all of its contents.attributes
—a JavaScript object containing all the attributes used with the extension.api
—the extensions API which provides many helper functions.
transform
function comes into use when a straightforward replacement of the tag with the contents of the template is not enough. Within the
transform
function, you might rearrange the child tags of your tag, or you might generate content based on the attributes that have been set or you might call on the extensions API to enable better interaction with the view as a whole.
<script>
VDL('my-tag', {
transform: function(element, attributes, api) {
$(element).addClass('my-class'); // jQuery is globally available
}
});
createViewModel
transform
callback which enables you to modify the construction of the view markup when the view is starting up, the
createViewModel
callback enables you to supply a custom view model to modify and enhance its runtime behavior. In particular, the values of dynamic expressions are only available at runtime, so
createViewModel
allows you to interact with and consume these values once they have been calculated by the VDL runtime.
<script>
VDL('my-tag', {
createViewModel: function(params) {
return {
// uses a VDL helper method
// to create an observable value
value: VDL.createVariable(56)
};
}
});
</script>
The above example creates a variable which can be observed within an expression
Example
vdl-text="=value"
© 2001-2022 Fair Isaac Corporation. All rights reserved. This documentation is the property of Fair Isaac Corporation (“FICO”). Receipt or possession of this documentation does not convey rights to disclose, reproduce, make derivative works, use, or allow others to use it except solely for internal evaluation purposes to determine whether to purchase a license to the software described in this documentation, or as otherwise set forth in a written software license agreement between you and FICO (or a FICO affiliate). Use of this documentation and the software described in it must conform strictly to the foregoing permitted uses, and no other use is permitted.