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 错误控制台。您将看到的错误消息之一如下（来自我的 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。当然，这是一个简化的解释，可能并非总是如此。欲了解更多信息，请参阅

我如何知道 JSF 组件的 id 以便可以在 Javascript 中使用

此外，确定组件的最简单方法id是简单地查看 HTML 代码（右键单击 > 查看页面源代码）。

<f:view>在您的情况下确实不需要，（除非我们当然没有看到更多）。像 erencan 建议的那样也参考这个链接

何时使用 f:view 和 f:subview

于 2013-07-24T16:40:25.667 回答