简体   繁体   English

php 表单验证 javascript

[英]php form validation with javascript

hi guys i need help trying to figure out why the alert box doesnt show up when i run this.大家好,我需要帮助来弄清楚为什么当我运行它时警告框没有出现。 im also new at programming.我也是编程新手。 html i due just fine. html 我到期就好了。 im currently taking a php class, and the teacher thought it would be fun to have us create a form and validate it.我目前正在申请 php class,老师认为让我们创建表格并验证它会很有趣。 my problem is i am trying to call the function which then would validate it.我的问题是我正在尝试调用 function 然后验证它。 My problem is its not calling it, and i cant quite figure out why.我的问题是它没有调用它,我不太明白为什么。 please help?请帮忙?

jons viladating乔恩斯维拉达丁

<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">

<head>
   <link rel="stylesheet" href="decor.css" type="text/css">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>jons viladating</title>
<script type="text/javascript">
<!-- <![CDATA[
   function showjonsForm() {
var errors = "";
// check for any empty strings
  if (document.forms[0].fname.value == "")
      errors += "fname\n";
          if (document.forms[0].lname.value == "")
      errors += "lName\n";
  if (document.forms[0].addrs1.value == "")
  errors += "Address\n";
  if (document.forms[0].city.value == "")
  errors += "City\n";
  if (document.forms[0].state.value == "")
      errors += "State\n";
  if (document.forms[0].zip.value == "")
      errors += "Zip\n";
   if (document.forms[0].phone.value == "")
       errors += "Phone\n";
  if (document.forms[0].email.value == "")
      errors += "Email\n";
  if (document.forms[0].pw2.value == "")
      errors += "Confirm password\n";

   if (document.forms[0].dob.value == "")
      errors += "Date of birth\n";
  if (document.forms[0].sex.value == "")
     errors += "sex\n";
     // don't need to check checkboxes
   if (errors != "") {  //something was wrong}))
      alert ("Please fix these errors\n" + errors) ;
          return false;
 }
       var stringx;
    stringx = "fName:" + document.forms(0).fname.value;
    stringx = "lName:" + document.forms(0).lname.value;
    stringx += "\nAddress: " + document.forms(0).addrs1.value;
    stringx += "\nCity: " + document.forms(0).city.value;
    stringx += " \nState: " + document.forms(0).state.value;
    stringx += " Zip: "+ document.forms(0).zip.value;
    stringx += "\nPhone: " + document.forms(0).phone.value;
    stringx += "\nE-mail:" + document.forms(0).email.value;
    stringx += "\nConfirm password " + document.forms(0).pw2.value;
    stringx += "\nDate of birth: " + document.forms(0).dob.value;
    stringx += "\nSex: " + document.forms(0).sex.value;
    alert(stringx);
    return false //set to false to not submit
} 
 //  ]]> -->
</script>
   <h1>jons validations test</h1>
   </head>
 <body>
  <div id="rightcolumn">
 <img src="hula.gif"  align="right"/>   
 </div>
<text align="left">
   <form name="jon"  action="formoutput.php" onsubmit="return showjonsForm()"      Method="post"> 
  <fieldset style="width:250px">
   <label> first name</label> <input type="text" name="fname" size="15" maxlength="22"    onBlur="checkRequired( this,'fname')"/><br />
   <label>last name</label> <input type="text" name="lname" size="10" maxlength="22">      <br />
 </fieldset>
  <fieldset  style="width:250px">
  <label>address</label> <input type="text" name="adrs1" size="10" maxlength="30"><br />
   <span class="msg_container" id="adrs2"></span><br />
   <label>city</label> <input type="text" name="city" size="10" maxlength="15"><br />
   <span class="msg_container" id="city"></span><br />
   <label>state</label> <input type="text" name="state" size="10" maxlength="2"><br />
   <span class="msg_container" id="state"></span><br />
   <label>zip</label> <input type="text" name="zip" size="10" maxlength="5"><br />

  </fieldset>
  <fieldset style="width:250px">
   <label>phone</label> <input type="text" name="phone" size="10" maxlength="10"><br />
  <div>please input phone number in this format 1234567892 thank you </div>
   <label>email</label> <input type="text" name="email" size="10" maxlength="22"><br />
   <div> password must have 1 number  upper case and minimum of 6 charcters</div> 
   <label>password</label> <input type="text" name="pw2" size="10" maxlength="12"><br  />
   <label>select gender type</label> <select name="sex" size="1" <br />
   <option>male</option>
   <option>female</option>
   <option>timelord</option>
   </select>
   <label>date of birth</label> <input type="text  name="dob" size="8" maxlength="8"/>
   <div> would you like to know know more</div>
   <label> yes</label> <input type="checkbox"  checked="checked" name="check" />
   </fieldset>  
   <input type="submit"/></form>

   </form>
   <div id="footer">
   <img src="laps2.jpg"> <img src="orange.jpg"><img src="ok.jpg">
   </div>
   </body>
   </html>

<input type="text" name="adrs1" size="10" maxlength="30">

change into变成

<input type="text" name="addrs1" size="10" maxlength="30">

Because in your JavaScript, it is document.forms[0].因为在你的JavaScript里面,是document.forms[0]. addrs1 .value addrs1 .value


Not related不相关的

Your Javascipt looks very cumbersome.你的 Javascipt 看起来很笨重。 Maybe you can simplify it?也许你可以简化它?

You can simplify all those document.forms[0].blah.value == "" into: (using jQuery)您可以将所有这些document.forms[0].blah.value == ""简化为:(使用 jQuery)

$("form > fieldset > input").each(function(){
    (this.value == "") && (errors += $(this).before().html() + "\n")
})

i have just validate two filed of your code i am trying to give you full code but here i am facing probelm indent in stackoverflow for that reason i give you image我刚刚验证了你的代码的两个文件,我正在尝试给你完整的代码,但在这里我面临 stackoverflow 中的 problem 缩进,因此我给你图像在此处输入图像描述your html code part您的 html 代码部分在此处输入图像描述

<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head>
 <link rel="stylesheet" href="decor.css" type="text/css">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>jons viladating</title>
<script type="text/javascript">
function showjonsForm(form) 
  {
    if(form.fname.value=="")
    {
        alert("Please Enter your First Name..");
        form.fname.focus();
        return false;
    }

    if(form.lname.value=="")
    {  
        alert("Please Enter your Last Name..");
        form.lname.focus();
        return false;
    }


}

</script>

 <body>


<h1>jons validations test</h1>
<form name="jon"  action="#" onsubmit="return showjonsForm(this)"      Method="post">
 <fieldset style="width:250px">
<label> first name</label> <input type="text" name="fname" size="15" maxlength="22"    onBlur="checkRequired( this,'fname')"/><br />
<label>last name</label> <input type="text" name="lname" size="10" maxlength="22">  <br />
 </fieldset>
<input type="submit"/></form>
  </body>


</html>

finaly i can give you code:)最后我可以给你代码:)

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM