[SOLVED] primefaces: javax.faces.FacesException: Cannot find component with expression "X" referenced from "Y". how to show/open p:dialog outside of naming container/in external form

i had the following code below, which has a link inside a form, and when a user clicks on the link, a p:dialog (outside of the form that contains the link and inside a different form) should open:
<ui:composition template="/templates/tctemplate.xhtml">
    <ui:define name="body">
        <h:form id="deviationForm">
            <p:toolbar>
                <p:toolbarGroup>
                    <p:commandLink update=":search:searchPanelHolder" id="searchFilter" onclick="PF('CDD_filterPanelWV').show();"
                        value="search/filter" />
                </p:toolbarGroup>
            </p:toolbar>
            <ui:include
                src="/webcomponents/costDevTable.xhtml" />
        </h:form>
    </ui:define>

    <p:dialog id="CDD_filterPanel" widgetVar="CDD_filterPanelWV">
        <h:form id="search">
            <h:panelGrid columns="2" id="searchPanelHolder">
                ...
                <h:outputLabel for="fromDate" value="from date" />
                ...
            </h:panelGrid>
        </h:form>
    </p:dialog>
</ui:composition>

but when i clicked the p:commandLink link and tried to open/show the p:dialog, i would get the following error:

javax.faces.FacesException: Cannot find component with expression ":search:searchPanelHolder" referenced from "deviationForm:searchFilter"

eventually, i realized that the error was simple: the p:dialog was outside the ui:define tag.

so here's how the code should look:

<ui:composition template="/templates/tctemplate.xhtml">
    <ui:define name="body">
        <h:form id="deviationForm">
            <p:toolbar>
                <p:toolbarGroup>
                    <p:commandLink update=":search:searchPanelHolder" id="searchFilter" onclick="PF('CDD_filterPanelWV').show();"
                        value="search/filter" />
                </p:toolbarGroup>
            </p:toolbar>
            <ui:include
                src="/webcomponents/costDevTable.xhtml" />
        </h:form>
 
        <p:dialog id="CDD_filterPanel" widgetVar="CDD_filterPanelWV">
            <h:form id="search">
                <h:panelGrid columns="2" id="searchPanelHolder">
                    ...
                    <h:outputLabel for="fromDate" value="from date" />
                    ...
                </h:panelGrid>
            </h:form>
        </p:dialog>
    </ui:define>
</ui:composition>


thanks to this thread for leading me in the right direction:
Naming Container in JSF2/PrimeFaces