Class: InvalidComponentTracker

Oracle® JavaScript Extension Toolkit (JET)
1.2.0

E65435-01

QuickNav

Fields

oj. InvalidComponentTracker

Version:
  • 1.2.0
Since:
  • 0.7

Constructor

new InvalidComponentTracker()

Tracks the validity of a group of components bound to this observable. It also provides properties and methods that the page author can use to enforce form validation best practice.

Validity of components that are disabled or readOnly will not be tracked by this object.

The invalidComponentTracker binding attribute should be bound to a ko observable. At runtime the framework creates an instance of this type oj.InvalidComponentTracker and sets it on the bound observable.
This object can then be used by page authors to do the following -

  • determine if there are invalid components tracked by this object that are currently showing errors.
  • determine if there are invalid components tracked by this object that are currently deferring showing errors.
  • set focus on the first invalid component in the tracked group
  • show all messages on all tracked components including deferred error messages, and set focus on the first invalid component.

Source:
Example

Bind an observable to the invalidComponentTracker and access oj.InvalidComponentTracker instance.

<input id="username" type="text" required 
  data-bind="ojComponent: {component: 'ojInputText', value: userName, 
   invalidComponentTracker: tracker}">
<input id="password" type="text" required 
  data-bind="ojComponent: {component: 'ojInputPassword', value: password, 
   invalidComponentTracker: tracker}">

<script>
function MyViewModel() { 
  var self = this;
  var tracker = ko.observable();
  
  log = function ()
  {
    var trackerObj = ko.utils.unwrapObservable(self.tracker);
    console.log(trackerObj instanceof oj.InvalidComponentTracker); // true 
  }
}
</script>

Fields

invalidHidden :boolean

Whether there is at least one component that is invalid with deferred messages, i.e., messages that are currently hidden.
Default Value:
  • false
Source:
Example

Enable button using invalidHidden property:

<input id="username" type="text" required 
  data-bind="ojComponent: {component: 'ojInputText', value: userName, 
   invalidComponentTracker: tracker}">
<input id="password" type="text" required 
  data-bind="ojComponent: {component: 'ojInputPassword', value: password, 
   invalidComponentTracker: tracker}">
<br/>
<button type="button" data-bind="ojComponent: {component: 'ojButton', label: 'Create',
  disabled: !tracker()['invalidHidden']}">

<script>
var userName = ko.observable();
var password = ko.observable();
var tracker = ko.observable();
</script>

invalidShown :boolean

Whether there is at least one component (tracked by this object) that is invalid and is currently showing messages.
Default Value:
  • false
Source:
Example

Disable button using invalidShown property:

<input id="username" type="text" required 
  data-bind="ojComponent: {component: 'ojInputText', value: userName, 
   invalidComponentTracker: tracker}">
<input id="password" type="text" required 
  data-bind="ojComponent: {component: 'ojInputPassword', value: password, 
   invalidComponentTracker: tracker}">
<button type="button" data-bind="ojComponent: {component: 'ojButton', label: 'Create',
  disabled: tracker()['invalidShown']}">
  
<script>
var userName = ko.observable();
var password = ko.observable();
var tracker = ko.observable();
</script>

Methods

#focusOnFirstInvalid() → {boolean}

Sets focus on first invalid component currently showing an error. This method does not set focus on components that are invalid and have deferred messages. For example, when a component is required, deferred validation is run. Any validation error raised is not shown to user right away, i.e., it is deferred.

To show hidden messages on all tracked components use showMessages() method.

Source:
See:
Returns:
true if there is at least one invalid component to set focus on; false if unable to locate a component to focus on or there are no invalid components.
Type
boolean

#showMessages()

Shows hidden messages on all tracked components by calling showMessages() method on each tracked editable component.
Source:
See:
Example

Show all hidden messages on tracked components:

 function ViewModel ()
 {
   self = this;
   var tracker = ko.observable();
  // ...
  
  showAllMessages : function ()
  {
     var trackerObj = ko.utils.unwrapObservable(self.tracker);
        return trackerObj.showMessages();
   }
 }

Non-public Methods

<protected> #Init()

Initializer
Source: