I’ve done several complicated modifications to out-of-box screens now, but I’ve encountered one I can’t solve.
I need to replace the ‘Phone1’ field of the ‘Contacts’ fieldset on the Contacts screen with another version with an additional button in the same row.
The complication of this task is that the ‘Contacts’ fieldset is a predefined template that is ‘included’.
CR302000.html - The ‘Details’ tab is ‘included’ from an extension (‘tabGeneral’):
<qp-tabbar id="ContactCurrent_tab" class="label-size-m" wg-container>
<qp-tab id="tabGeneral" caption="General" ref="tabGeneral_Content"></qp-tab>CR302000_General.html - ‘Contacts’ is ‘included’ from the template form:
<template id="tabGeneral_Content">
<qp-template id="Details-form" name="1-1">
<div slot="A">
<qp-include url="src/screens/common/form-contact-person/form-contact-person.html"
fs-id="tabDetails_Contact"
contact-view="ContactCurrent"
fs-wg-container="ContactCurrent_PXFormView1"
fs-caption="Contact">
</qp-include>I’ve tried sooo many ways of doing this, but most of them require a CSS selector and the build fails with
screen 'CR302000' child node 'QP-FIELDSET' has attribute with '#tabDetails_Contact', but screen HTML doesn't contain any elements that satisfies such querySelector
I assume this is because my extension must be running before the ‘include’ has occurred. I found this article which indicates how to modify an included fieldset, but I believe this is only for new inclusions, not modifying an existing inclusion. I tried to ‘remove’ and re-add the fieldset, but again, I’d need a valid CSS selector for that.
I also tried an extension of the form-contact-person but I can’t figure out how to use the fieldset ID because it’s a parameter.
Please help!