1 
<?xml version="1.0" encoding="UTF-8"?>
<!--
To change this template, choose Tools | Templates
and open the template in the editor.
-->
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://xmlns.jcp.org/jsf/html"
      xmlns:p="http://primefaces.org/ui"
      xmlns:f="http://xmlns.jcp.org/jsf/core">
    <f:view>
    <h:head>
        <title>Admin Welcome</title>

        <!-- this is the javascript part! -->
        <script>
            function validateForm()
                {
                    if(document.form.firstname.value=="" || document.form.lastname.value=="" || document.form.mobileno.value=="")
                        {
                            alert("first/lastname/mobile number should not be left blank");
                            document.userreg.fname.focus();
                            return false; 
                        }
                    if(!isNaN(document.form.firstname.value) || !isNaN(document.form.lastname.value) )
                        {
                            alert("Please Enter Only Characters for first/last names");
                            return false;
                        }
                    if(isNaN(document.form.mobileno.value))
                        {
                            alert("please enter only Numbers for mobile number")
                            return false;
                        }


                }               
        </script>
    </h:head>

    <h:body>
        Welcome admin!
        <center><h1>User Registration Form</h1></center>
        <center><h:form id="form">  

            <p:panel id="panel">  

        <p:messages id="msgs"/>  

        <h:panelGrid columns="3" >  
            <h:panelGroup>
            <h:outputLabel for="firstname" value="firstname: *" />  
            <p:inputText id="firstname" value="#{userBean.firstname}" required="true" label="firstname">  

            </p:inputText>  

            <br></br> <br></br>
            <h:outputLabel for="lastname" value="lastname: *" />  
            <p:inputText id="lastname" value="#{userBean.lastname}" label="lastname" required="true">  


            </p:inputText>  
            <br></br><br></br>
            <h:outputLabel for="mobileno" value="mobileno: *" />  
            <p:inputText id="mobileno" value="#{userBean.mobileno}" label="mobileno" required="true">  


            </p:inputText>  

  </h:panelGroup>
        </h:panelGrid>  
        <br></br>
        <p:commandButton ajax="false" id="btn" value="submit" type='submit' onclick="return validateForm()" />  
        <p:commandButton value="reset" type="reset" />
    </p:panel>  

            </h:form></center>
    </h:body>

    </f:view>
</html>

JavaScript部分が実行されていません。なぜ？

4

1 に答える 1

1

質問に厳密に答えるには、javascript エラー コンソールを確認してください。表示されるエラー メッセージの 1 つを次に示します (私の側では FireFox から)。

TypeError: document.form.firstname is undefined

問題を解決する最も簡単な方法はprependId="false"、<h:form>.

prependId = "false"アプローチが気に入らない場合は、変更することもできます

document.form.firstname

に

document.form["form" + ":" + "firstname"].value

これは Javascript メソッド全体で行う必要があるため、覚えておいてください。

idたとえば、コンポーネントp:inputText id="firstname"...には次のパターンがあることに注意してくださいformId:componentId。となりますform:firstname。もちろん、これは単純化された説明であり、常にそうであるとは限りません。詳細については、次を参照してください。

Javascriptで使用できるようにJSFコンポーネントのIDを知るにはどうすればよいですか

また、コンポーネントを特定する最も簡単な方法idは、HTML コードを表示することです (右クリック > ページのソースを表示)。

<f:view>あなたの場合は本当に必要ありません（もちろん、私たちが見ていないものがもっとある場合を除きます）。エレンカンが提案したように、このリンクも参照してください

f:view と f:subview をいつ使用するか

于 2013-07-24T16:40:25.667 に答える