如何验证中使用JavaScript JSP表单之前提交

<form name="Details" method="post" action="insertData.jsp" onSubmit="return ValidateForm();"> 
<label> Name </label > <input type="text" name="name" id="test1" > </input> 
<label> ID </label > <input type="text" name="id" id="test2" > </input> 
<label> Time </label > <input type="text" name="time" id="test3" > </input> 
<label> Latitude </label > <input type="text" name="latitude" id="test4" > </input> 
<label> Longitude </label > <input type="text" name="longitude" id="test5" > </input> 
<input type= " submit" id="test6" value="submit" > </input>

输入验证码的JS如何验证中使用JavaScript JSP表单之前提交

function ValidateForm() 
{ 
var uname=document.Detail.name; 
if(alphanumeric(uname)){ 
} 
return false; 
} 
function alphanumeric(uname){ 
var letter=/*[0-9a-zA-Z]+$/; 
if(uname.value.match(letter)){ 
return true; 
} 
else{ 
aler("Enter both alpha and number"); 
uname.focus(); 
return false; 
} 
}

以上验证是允许文本框接受两个字母和数字，但不仅仅是数字。它在错误的输入上返回错误，但输入的数据仍然被提交给数据库。如何避免这种情况？我的代码有什么问题？

我也想在提交前验证表单。在输入每个字段后，如果在字段下方有任何错误，应该对其进行验证并显示。我该怎么做？

来源

2014-01-15 user123

你为什么不走的jQuery？ –

呀我没有得到任何适当的例如jQuery中使用它为我的代码。 – user123

检查[这里]（http://jqueryvalidation.org/documentation/）。 –

你可以使用一个命名模式对于IDS隐藏<span>标签表示表单字段错误消息：

<form onsubmit="return ValidateForm(this);"> 
    <p> 
     <input type="text" id="name" name="name"> 
     <span style="display: none;" id="name-validation-message"></span> 
    </p> 
</form> 

<script> 
    function ValidateForm(form) { 
     if (!alphanumeric(form.elements.name)) { 
      var message = document.getElementById(form.elements.name.id + "-validation-message"); 
      message.innerHTML = "Must be alphanumeric"; 
      message.style.display = ""; 
     } 
    } 
</script>

的elements财产上form对象是一个key-value存储密钥是值表单字段上的name属性，并且这些值是对单个表单字段DOM节点或集合的引用。

考虑下面的HTML：

<form id="test"> 
    <input type="text" name="foo"> 

    <input type="checkbox" name="bar" value="1"> 
    <input type="checkbox" name="bar" value="2"> 
    <input type="checkbox" name="bar" value="3"> 
    <input type="checkbox" name="bar" value="4"> 

    <input type="text" name="things[]"> 
    <input type="text" name="things[]"> 
    <input type="text" name="things[]"> 
    <input type="text" name="things[]"> 
    <input type="text" name="things[]"> 
    <input type="text" name="things[]"> 
    <input type="text" name="things[]"> 
</form>

我们有三个独特的表单字段名称属性值：

富
吧
事情[]

在JavaScript，我们将会有fo对象模型：

var form = document.getElementById("test"); 

form.elements; // A collection of references to all form fields 

form.elements.foo; // Reference to <input type="text" name="foo"> 

// A DOM node collection referencing all checkboxes whose name is "bar" 
form.elements.bar; 
form.elements.bar[0]; // First "bar" checkbox 
form.elements.bar[1]; // Second "bar" checkbox 

// A DOM node collection referencing all text boxes whose name is "things[]" 
form.elements["things[]"]; 
form.elements["things[]"][0]; // First "things[]" textbox 
form.elements["things[]"][1]; // Second "things[]" textbox

许多服务器端语言使用方括号将字段名称转换为数组。您可以使用数组符号（例如form.elements["bar"]而不是点标记（如form.elements.bar）存取JavaScript这些领域。

来源

2014-01-15 17:54:46

钍anks，但我需要验证每个字段，然后提交它。 – user123

我刚刚给你开始。您可以填写其余的代码来验证每个字段。只需在'ValidateForm'函数末尾返回true或false即可。剩下的我留给你。 :) –

@GregBurghardt，是指name =“name”或id =“name”的form.fields.name？ – Jeff

希望下面的代码帮助。

<HTML> 
    <HEAD> 
    <TITLE>Verifying User Data</TITLE> 
    <SCRIPT LANGUAGE="JavaScript"> 

     function checker() 
     { 
      var regExp1 = '/^(\d{1,2})\/(\d{1,2})\/(\d{2})$/' ; 
      var result1 = document.form1.text1.value.match(regExp1); 
      if (result1 == null || <*any other input doesnt satisfy the required format*>) { 
       alert("Sorry, that's not a valid date."); 
       document.form1.text1.focus(); // or document.<formname>.<element_name>.focus(); 
       return; 
      } else { 
       document.form1.action="<NextPage.jsp>" ; 
       document.form1.method="GET"; // or "POST" 
       document.form1.submit(); 

      } 
     } 

    </SCRIPT> 
</HEAD> 

<BODY> 
    <H1>Verifying User Data</H1> 
    <FORM NAME="form1" > 
     Please enter a date: 
     <INPUT TYPE="TEXT" NAME="value1"> 
     <INPUT TYPE="<sometype>" NAME="value2"> 
     <INPUT TYPE="<sometype>" NAME="value3"> 
     .. 
     .. 
     <INPUT TYPE="button" onclick="checker()"> 
    </FORM> 
</BODY>

来源

2015-02-24 11:29:54 Abhidemon

检查器功能在表单提交时被调用。我认为用户在提交验证之前正在寻找。 – Daenarys

编辑答案，输入类型现在是一个按钮。它的onclick调用函数检查器（），它只在输入的数据格式正确时才提交表单。 – Abhidemon

撰写提交按钮像

另一个JavaScript

  <input type= " submit" id="test6" value="submit" onclick="return save();"> 
    <script> 
    function save(){ 
    document.form[0].submit; 
     } 
</script>

来源

2016-01-15 08:55:20

如何验证中使用JavaScript JSP表单之前提交

回答

相关问题