6 Replies Latest reply: Dec 8, 2012 7:38 PM by lkakarla RSS

    Html Form inside ADF Form

    lkakarla
      We are trying to display the HTML page content from Fatwire in our ADF page. The html page from third party system is having a HTML form element, which is conflicting with ADF af:form component in our ADF page and causing bad user experience. we tried to use af:subform inside af:form to display HTML. But it didn't work. Please advise on how to handle this scenario.

      JSF page source:

      <af:form id="f1">
      <af:panelGroupLayout id="pt_pgl2" layout="vertical">
      <af:panelGroupLayout id="pt_pgl3" layout="vertical"
      inlineStyle="width:960px;margin:0px auto;">
      <af:panelBorderLayout id="pt_pbl1"
      inlineStyle="height:48px; background-color:white; width:960.0px;">
      <f:facet name="start">
      <af:group id="pt_g3">
      <af:goImageLink id="pt_gil1"
      icon="/images/LogoP1.png"
      destination="http://www.google.com/"/>
      </af:group>
      </f:facet>
      <f:facet name="end">
      <af:panelGroupLayout id="pt_pgl11" layout="vertical">
      <af:panelGroupLayout id="pt_pgl12" layout="horizontal"
      halign="end">
      <af:commandLink id="pt_cl3" partialSubmit="true"
      immediate="true"
      rendered="true">
      <af:image source="/images/shopping.png" id="pt_i4"
      shortDesc="shopping"/>
      <af:showPopupBehavior alignId="pt_cl3" align="afterStart"
      popupId=""
      triggerType="mouseOver"/>
      </af:commandLink>
      </af:panelGroupLayout>
      </af:panelGroupLayout>
      </f:facet>
      <!-- display html menu -->
      <af:subform id="pt_s7">
      <af:outputText value="#{pageFlowScope.testFatBean.menuHtml}"
      id="pt_ot14" escape="false" rendered="true"
      inlineStyle="width:840.0px;"/>
      </af:subform>
      </af:panelBorderLayout>
      </af:panelGroupLayout>
      </af:panelGroupLayout>

      <af:commandButton text="Click Here" id="cb1"
      action="#{pageFlowScope.testFatBean.cb1_action}"/>
      </af:form>


      Jdeveloper 11.1.1.6.0
        • 1. Re: Html Form inside ADF Form
          Timo Hahn
          Have you tired an iframe to show the html form?

          Timo
          • 2. Re: Html Form inside ADF Form
            lkakarla
            I tried following code snippet to display html. But I didn't get any output on the UI. Please advise.

            <!-- display html menu -->
            <af:subform id="pt_s7">
            <iframe src="${pageFlowScope.testFatBean.menuHtml}" width="840px" height="10px" frameborder="0"/>
            </af:subform>
            • 3. Re: Html Form inside ADF Form
              Timo Hahn
              Try an af:inlineFrame http://docs.oracle.com/cd/E12839_01/apirefs.1111/e12419/tagdoc/af_inlineFrame.html without the subform.

              Timo
              • 4. Re: Html Form inside ADF Form
                lkakarla
                I tried af:inlineFrame and it displayed html from 3rd party system in my page. But the CSS required to display html is not getting applied on the html in the layout. Eariler with af:outputText, the CSS applied properly. please advise. Thanks.

                <f:view>
                <af:document id="d1">
                <af:resource type="css" source="/css/menu.css"/>
                <af:form id="f1">
                <af:panelGroupLayout id="pt_pgl2" layout="vertical">
                <af:panelGroupLayout id="pt_pgl3" layout="vertical"
                inlineStyle="width:960px;margin:0px auto;">
                <af:panelBorderLayout id="pt_pbl1"
                inlineStyle="height:48px; background-color:white; width:960.0px;">
                <f:facet name="start">
                <af:group id="pt_g3">
                <af:goImageLink id="pt_gil1"
                icon="/images/LogoP1.png"
                destination="http://www.google.com/"/>
                </af:group>
                </f:facet>
                <f:facet name="end">
                <af:panelGroupLayout id="pt_pgl11" layout="vertical">
                <af:panelGroupLayout id="pt_pgl12" layout="horizontal"
                halign="end">
                <af:commandLink id="pt_cl3" partialSubmit="true"
                immediate="true"
                rendered="true">
                <af:image source="/images/cart.png" id="pt_i4"
                shortDesc="cart"/>
                <af:showPopupBehavior alignId="pt_cl3" align="afterStart"
                popupId=""
                triggerType="mouseOver"/>
                </af:commandLink>
                </af:panelGroupLayout>
                </af:panelGroupLayout>
                </f:facet>
                <af:inlineFrame source="#{pageFlowScope.testFatBean.MenuURL}" rendered="true" id="pt_ot14" inlineStyle="width:840.0px;"></af:inlineFrame>
                </af:panelBorderLayout>
                </af:panelGroupLayout>
                </af:panelGroupLayout>
                <af:commandButton text="Click Here" id="cb1"
                action="#{pageFlowScope.testFatBean.cb1_action}"/>
                </af:form>
                </af:document>
                </f:view>
                • 5. Re: Html Form inside ADF Form
                  Timo Hahn
                  Sorry, can't check it out at the moment as I'm not in front of my PC.

                  Timo
                  • 6. Re: Html Form inside ADF Form
                    lkakarla
                    hi Timo,

                    Do you have any inputs on this..

                    Thanks.