Trigger value commit programmatically for input text component using guidebridge

Hi @srinivas_opti,

To programmatically trigger a "value commit" event in AEM Forms when setting the value of an input text component using the guideBridge API, you need to ensure that the system recognizes the change as if it were made through the UI.

The "value commit" event is typically triggered when a user interacts with a field through the user interface, such as typing and then moving focus away from the field. Directly setting a field’s value using JavaScript (email.value = "abc@abc.com") does not trigger this event because it bypasses the typical UI interaction.

To mimic the behavior of user interaction, you can manually dispatch a change event after setting the value. This approach ensures that your JavaScript logic tied to the "value commit" event executes as expected.

// Set the value
email.value = "abc@abc.com";

// Create and dispatch a 'change' event
const event = new Event('change', {
  'bubbles': true,
  'cancelable': true
});
email.dispatchEvent(event);

• If you are using GuideBridge, you must ensure that your code subscribes to the necessary events. Here’s an example of how you can listen to and handle events using GuideBridge:

guideBridge.on("elementValueChanged", function(event, payload) {
  // Handle the value change event
  console.log(`Value changed for ${payload.target.name}, new value: ${payload.newText}`);
});

Thanks
Pranay