Le script onload ne fonctionne pas dans la page de sous-visualisation dans JSF

J'ai écrit deux pages JSP: outerPage.jsp et innerPage.jsp.
Le outerPage.jsp inclut innerPage.jsp.
Le innerPage.jsp a un champ de texte et un bouton.Le script onload ne fonctionne pas dans la page de sous-visualisation dans JSF

Je dois mettre l'accent sur textFiled dans innerPage.jsp pendant le chargement de la page.
J'ai écrit JavaScript qui est appelé pendant le chargement du corps de outerPage.jsp, mais cela ne fonctionne pas.

Voici le outerPage.jsp:

<%@page contentType="text/html" pageEncoding="UTF-8"%> 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 
    "http://www.w3.org/TR/html4/loose.dtd"> 

<%@ taglib uri="http://java.sun.com/jsf/core" prefix="f" %> 
<%@ taglib uri="http://java.sun.com/jsf/html" prefix="h" %> 
<%@ taglib uri="http://richfaces.org/a4j" prefix="a4j" %> 
<%@ taglib uri="http://richfaces.org/rich" prefix="rich"%>  

<html> 
    <f:view> 
     <head> 
      <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
      <title>Outer Viewer</title> 
      <meta name="description" content="Outer Viewer" />      
     </head> 
     <body id="outerMainBody"> 
      <rich:page id="richPage">        
       <rich:layout> 
        <rich:layoutPanel position="center" width="100*"> 
         <a4j:outputPanel> 
          <f:verbatim><table style="padding: 5px;"><tbody><tr> 
              <td> 
               <jsp:include page="innerPage.jsp" flush="true"/>  
              </td> 
             </tr></tbody></table></f:verbatim> 
           </a4j:outputPanel> 
          </rich:layoutPanel> 
         </rich:layout> 
        </rich:page> 
     </body> 
    </f:view> 
</html>

Voici le innerPage.jsp:

<%@page contentType="text/html" pageEncoding="UTF-8"%> 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 
    "http://www.w3.org/TR/html4/loose.dtd"> 

<%@ taglib uri="http://java.sun.com/jsf/core" prefix="f" %> 
<%@ taglib uri="http://java.sun.com/jsf/html" prefix="h" %> 
<%@ taglib uri="http://richfaces.org/a4j" prefix="a4j" %> 
<%@ taglib uri="http://richfaces.org/rich" prefix="rich"%> 

<f:verbatim><html></f:verbatim> 
    <f:subview id="innerViewerSubviewId"> 
     <f:verbatim><head> 
       <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 
       <title>Inner Viewer </title>    
       <script type="text/javascript"> 
//This script does not called during the page loading (onload)  
        function cursorFocus() 

        { 
         alert("Cursor Focuse Method called...");     
         document.getElementById("innerViewerForm:innerNameField").focus(); 
         alert("Cursor Focuse method end!!!"); 
        }    
       </script> 
      </head> 
      <body onload="cursorFocus();"></f:verbatim> 

      <h:form id="innerViewerForm"> 
       <rich:panel id="innerViewerRichPanel"> 

        <f:facet name="header"> 
         <h:outputText value="Inner Viewer" /> 
        </f:facet> 

        <a4j:outputPanel id="innerViewerOutputPanel" > 

         <h:panelGrid id="innerViewerSearchGrid" columns="2" cellpadding="3" cellspacing="3"> 

          //<%-- Row 1 For Text Field --%> 
        <h:outputText value="inner Name : " /> 
        <h:inputText id="innerNameField" value=""/>       

        //<%-- Row 2 For Test Button --%> 
        <h:outputText value="" /> 
        <h:commandButton value="TestButton" action="test" /> 

        </h:panelGrid>            

        </a4j:outputPanel> 
       </rich:panel> 
      </h:form>   
      <f:verbatim></body></f:verbatim> 
    </f:subview> 
    <f:verbatim></html></f:verbatim>

Le script cursorFocus() est pas appelée.

Merci d'avance.

Source

2010-05-18 jackrobert

Lorsque vous avez ce type de problème,

Il suffit d'appeler le script à la fin de la page avant tag

Votre balise body sera changé pour

...content above body 
<body> 
...content inside body 
<script type="text/javascript">cursorFocus();</script> 
</body> 
...content after body

Source

2010-05-18 06:13:26

une chose que je veux comprendre que .. est javascript exécuté à partir de t op au fond? –

Oui. Cependant, vous pouvez définir des fonctions de script Java et vous pouvez les appeler après la définition n'importe où dans la page dans n'importe quelle séquence. Ils seront exécutés dans la séquence appelée. –

Votre code HTML est syntaxiquement invalide. La sortie HTML généré doit ressembler comme suit:

<!doctype declaration> 
<html> 
    <head>...</head> 
    <body>...</body> 
</html>

Mais la vôtre finit comme:

<!doctype declaration> 
<html> 
    <head>...</head> 
    <body> 
     <!doctype declaration> 
     <html> 
       <head>...</head> 
       <body>...</body> 
     </html> 
    </body> 
</html>

Page Rightclick dans le navigateur et Afficher la source. Est-ce que ça a l'air juste? Non. Le W3 markup validator aurait dû aussi faire allusion à cela si vous l'aviez testé. Étant donné que le code HTML généré est incroyablement malformé, le webbrowser ne sait pas comment et où trouver l'élément DOM HTML dont vous avez besoin dans la fonction Javascript. Le comportement est non spécifié.

Vous devez réécrire les pages comme suit:

outerPage.jsp

<!doctype declaration> 
<f:view> 
    <html> 
     <head> 
      <title>...</title> 
      <meta>...</meta> 
      <script>...</script> 
     </head> 
     <body> 
      <jsp:include /> 
     </body> 
    </html> 
</f:view>

innerPage.jsp

<f:subview> 
    <h:form> 
     <h:inputText /> 
    </h:form> 
</f:subview>

En effet, vous devriez pas mettre <!doctype>, <html>, <head> et <body> balises dans innerPage.jsp! Il suffit de le coder comme si c'était le réel inclure, mais avec seulement<f:subview> autour.

De cette façon, il finira par syntaxiquement valide:

<!doctype declaration> 
<html> 
    <head> 
     <title>...</title> 
     <meta>...</meta> 
     <script>...</script> 
    </head> 
    <body> 
     <form> 
      <input type="text" /> 
     </form> 
    </body> 
</html>

Une fois que vous avez aligné tout ce que HTML, vous pouvez vous concentrer sur le fonctionnement de la fonction JavaScript. Vérifiez l'ID client généré de l'élément <form> dans la source HTML générée (page de droite dans webbrowser, Afficher la source), puis utilisez-la dans le document.getElementById().

Source

2010-05-18 11:29:43 BalusC

En fait, cette balise me manque pendant la publication. Mais j'ai utilisé toute la syntaxe. j'utilise netbeans IDE. donc il n'y a aucune possibilité de manquer ça .. désolé pour mon poste incovenice. – jackrobert

Veuillez mettre à jour votre question en incluant le code * réel *. Pour le formater correctement, il suffit de le mettre en retrait avec ** 4 espaces ** ou de le sélectionner et d'appuyer sur le bouton '010101' dans la barre d'outils de l'éditeur ou sur la touche' Ctrl + K'. Sinon, les balises HTML disparaîtront. Consultez également les règles de formatage des messages dans la colonne de droite lors de la modification du message. – BalusC

Votre code n'est toujours pas valide. Avez-vous lu ma réponse? Ce ne sont pas seulement les doubles entrées «». C'est plus. J'ai mis à jour ma réponse pour refléter la mise à jour de votre question. – BalusC

Vous manquez l'id sous-vue pour votre script:

   function cursorFocus() 
       { 
        alert("Cursor Focuse Method called...");     
        document.getElementById("innerViewerForm:innerNameField").focus(); 
        alert("Cursor Focuse method end!!!"); 
       }    
      </script>

Vous utilisez le script suivant et vérifiez

fonction

cursorFocus()
{

document.getElementById("innerViewerSubviewId:innerViewerForm:innerNameField").focus();

}

Source

2010-05-19 02:39:56 Eswar

Merci Eswar pour votre gentil effort. Ya ça a marché. – jackrobert

Le script onload ne fonctionne pas dans la page de sous-visualisation dans JSF

Répondre

Questions connexes