8 Replies Latest reply: Jun 21, 2011 2:27 PM by 814457 RSS

    getElementById not working for h:commandButton

    814457
      Hey

      I have the flowing code in my jspx region:

      <script type="text/javascript">
      window.onbeforeunload=function(){
      if (window.event.clientY &lt; 0 &amp;&amp; (window.event.clientX &gt; (document.documentElement.clientWidth - 5) || window.event.clientX &lt; 15) ) {                       
      var hiddenButton = document.getElementById("hiddenButton");
      if (hiddenButton){
      alert("hiddenButton found!");
      }
      else{
      alert("hiddenButton not found :( ");
      }
           }
           }
      </script>

      and my h:commandButton

      <h:commandButton rendered="false" id="hiddenButton"
      onclick="if (confirm('#{res['sag.generales.cerrarSesion']}')) {window.document.all['logoutFrame'].src='../servlet/LogoutServlet';window.setTimeout('closeWindow()',100);}"
      />

      the thing is that when the javascript method executes, it's not able to find the button ( i get the hidden button not found message)

      On the other hand if I use a regular <<input type="button" id="hiddenButton" value="Button" onclick="alert('The button was clicked.');"/>

      I get both the hidden button found alert and the cbutton clicked alert

      Why getElementById is not working with h:commandButton in this case?

      Thanks! Thanks! Thanks!!!
        • 1. Re: getElementById not working for h:commandButton
          BranislavNemec
          hi,

          the reason is that you set rendered="false" - this means the jsf component is not rendered (or marked up) in html
          try to use af:commandButton with visible="false"

          regards,
          Brano
          • 2. Re: getElementById not working for h:commandButton
            814457
            Thanks for you reply Brano!

            But there is no visible attribute for af:commandButton :(
            I tried setting rendered="true" but getElementById keeps without finding it
            • 3. Re: getElementById not working for h:commandButton
              BranislavNemec
              what version of JDeveloper are you using?
              here is the link to af:commandButton http://jdevadf.oracle.com/adf-richclient-demo/docs/tagdoc/af_commandButton.html

              regards,
              Brano
              • 4. Re: getElementById not working for h:commandButton
                814457
                10.1.3 has no visible attribute on af:button :(

                But even setting rendered="true" javascript is not able to find the button.
                Is there anything that I'm doing wrong?
                • 5. Re: getElementById not working for h:commandButton
                  vinod_t_krishnan
                  can u get the elementid by the absolute id.. like..
                  p1::soc1::input1::hbutton
                  where p1,soc1 are the parent hierarchy of the buttons
                  • 6. Re: getElementById not working for h:commandButton
                    814457
                    That is a GOOD idea!

                    Here is my jspx
                    In my case, how would it be?

                    I use the javascript method in this region as it's present in all pages. So when the user closes the window the event will be trigged no matter the page he is at.

                    <?xml version='1.0' encoding='windows-1252'?>
                    <jsp:root xmlns:jsp="http://java.sun.com/JSP/Page" version="2.0"
                    xmlns:h="http://java.sun.com/jsf/html"
                    xmlns:f="http://java.sun.com/jsf/core"
                    xmlns:af="http://xmlns.oracle.com/adf/faces"
                    xmlns:afh="http://xmlns.oracle.com/adf/faces/html">
                    <jsp:output omit-xml-declaration="true" doctype-root-element="HTML"
                    doctype-system="http://www.w3.org/TR/html4/loose.dtd"
                    doctype-public="-//W3C//DTD HTML 4.01 Transitional//EN"/>
                    <jsp:directive.page contentType="text/html;charset=windows-1252"/>
                    <f:loadBundle basename="UIResources" var="res"/>


                    <script type="text/javascript">
                    window.onbeforeunload=function(){
                    if (window.event.clientY &lt; 0 &amp;&amp; (window.event.clientX &gt; (document.documentElement.clientWidth - 5) || window.event.clientX &lt; 15) ) {                       
                    var hiddenButton = document.getElementById("hiddenButton");
                    if (hiddenButton){
                    alert("hiddenButton found!");
                    }
                    else{
                    alert("hiddenButton not found :(");
                    }

                    document.getElementById('hiddenButton').onclick();
                         }
                         }
                    </script>

                    <h:commandButton rendered="true" id="hiddenButton"
                    onclick="if (confirm('#{res['sag.generales.cerrarSesion']}')) {window.document.all['logoutFrame'].src='../servlet/LogoutServlet';window.setTimeout('closeWindow()',100);}"
                    />


                    <af:regionDef var="attrs">
                    <af:objectSpacer width="5" height="10"/>
                    <af:panelHorizontal halign="center">
                    <afh:rowLayout>
                    <af:outputFormatted value="#{res['sag.generales.version']}"
                    rendered="#{MenuPrincipalRegionBacking.detalleAbm==false || !App.abmDetalleEnPopups}"/>
                    </afh:rowLayout>
                    <af:objectSpacer width="5px"/>
                    <afh:rowLayout>
                    <af:outputFormatted value="#{res['sag.generales.copyright']}"
                    rendered="#{MenuPrincipalRegionBacking.detalleAbm==false || !App.abmDetalleEnPopups}"/>
                    </afh:rowLayout>

                    </af:panelHorizontal>
                    </af:regionDef>


                    </jsp:root>
                    • 7. Re: getElementById not working for h:commandButton
                      BranislavNemec
                      this works for me (10.1.3):
                      <?xml version='1.0' encoding='UTF-8'?>
                      <jsp:root xmlns:jsp="http://java.sun.com/JSP/Page" version="2.0"
                                xmlns:f="http://java.sun.com/jsf/core"
                                xmlns:h="http://java.sun.com/jsf/html"
                                xmlns:af="http://xmlns.oracle.com/adf/faces"
                                xmlns:afh="http://xmlns.oracle.com/adf/faces/html">
                        <jsp:output omit-xml-declaration="true" doctype-root-element="HTML"
                                    doctype-system="http://www.w3.org/TR/html4/loose.dtd"
                                    doctype-public="-//W3C//DTD HTML 4.01 Transitional//EN"/>
                        <jsp:directive.page contentType="text/html;charset=UTF-8"/>
                        <f:view>
                          <afh:head>
                            <script type="text/javascript">
                      function doJavascript() { 
                          var hiddenButton = document.getElementById('hiddenButton'); 
                          if (hiddenButton){
                              alert("hiddenButton found!");
                          }
                          else {
                              alert("hiddenButton not found ");
                          }
                      }
                          </script>
                          </afh:head>
                          <af:document initialFocusId="input1">
                            <af:form defaultCommand="cb1" id="form1">
                              <af:commandButton text="commandButton 1" id="hiddenButton"
                                                onclick="doJavascript()"/>
                            </af:form>
                          </af:document>
                        </f:view>
                      </jsp:root>
                      regards,
                      Brano
                      • 8. Re: getElementById not working for h:commandButton
                        814457
                        yeahhyyy!!!

                        that worked just fine :) ... sadly i had to create a diferent jspx as I was not able to integrate a f:view along with a af:regionDef in the same page?

                        Thanks again Brano! u rock