Metadata Script

The Script field allows you to execute custom JavaScript code to implement dynamic behaviors in metadata forms.

This field can interact with form elements such as:

• Input
• CheckBox
• Select
• TextArea

Basic Example

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE property-groups PUBLIC "-//OpenKM//DTD Property Groups 3.15//EN"
                                 "http://www.openkm.com/dtd/property-groups-3.15.dtd">
<property-groups>
  <property-group label="Consulting" name="okg:consulting">
    <input label="Input label" name="okp:consulting.input1" />
    <separator label="Separator label" name="okp:consulting.separator" /> 
    <input label="Input label" name="okp:consulting.input2" />
    <input label="Script label" name="okp:consulting.script" source="metadata_script.js" />
  </property-group>
</property-groups>

JavaScript Example

Example of a script file (metadata_script.js) that demonstrates interaction with form fields:

(function() {
  alert('loading');
  const input = document.getElementById('okp:consulting.input1');
  const row = document.getElementById('row-okp:consulting.input1');
  if (input) {
    input.value = 'modified';
    // Trigger the input event so Vue detects the change
    input.dispatchEvent(new Event('input', { bubbles: true }));

    // Add event listener to detect changes
    input.addEventListener('input', function(event) {
      if (event.target.value.length === 10) {
        alert('Text lenght greather than 10 characters');
      } else if (event.target.value.length === 11) {
        row.style.display = 'none'; // hide the field
      }
    });
  }
  alert('loaded');
})();

Common Use Cases

Best Practices