[英]How to validate an HTML form?
I have an HTML form and a button which when the user clicks will check whether or not the form is filled. 我有一个HTML表单和一个按钮,当用户单击时将检查表单是否已填写。 The details for billing address is input from database using php
帐单地址的详细信息是使用php从数据库输入的
<button id="btnConfirm" type="submit" onclick="validate()"style="float: right" value="Confirm Payment" >Confirm Payment</button>
<form id="au" name="paymentform" method="post" action="" >
<fieldset class="billing">
<legend>Billing Details</legend>
<br />
<label class="reglabel" for="fname">First Name:</label>
<input id="fname" name="billingfname" required="" type="text" value="<?php echo $fname ?>" /><br />
<label class="reglabel" for="lname">Last Name:</label>
<input id="lname" name="billinglname" required="" type="text" value="<?php echo $lname ?>" /><br />
<label class="reglabel" for="address">Address:</label>
<input id="address" name="billingaddress" required="" type="text" value="<?php echo $address ?>" /><br />
<label class="reglabel" for="town">Town:</label>
<input id="town" name="billingtown" required="" type="text" value="<?php echo $town ?>" /><br />
<label class="reglabel" for="postcode">Post Code:</label>
<input id="postcode" name="billingpostcode" required="" type="text" value="<?php echo $postcode ?>" /><br />
<label class="reglabel" for="phone">Phone:</label>
<input id="phone" name="billingphone" required="" type="text" value="<?php echo $phone ?>" /><br />
<label id="EmailLabel" class="reglabel" for="email">E-mail:</label>
<input id="email" name="billingemail" required="" type="email" value="<?php echo $email ?>" /><br />
</fieldset>
<fieldset class="shipping">
<legend>Shipping Details</legend>
<br />
<input name="shippingsame" onclick="fillShipping(this.form)" type="checkbox">Check
this box if billing address and shipping address are the same <br />
<label class="reglabel" for="fname">First Name:</label>
<input id="fname" name="shippingfname" placeholder="Required" required="" type="text" /><br />
<label class="reglabel" for="lname">Last Name:</label>
<input id="lname" name="shippinglname" placeholder="Required" required="" type="text" /><br />
<label class="reglabel" for="address">Address:</label>
<input id="address" name="shippingaddress" placeholder="Required" required="" type="text" /><br />
<label class="reglabel" for="town">Town:</label>
<input id="town" name="shippingtown" placeholder="Required" required="" type="text" /><br />
<label class="reglabel" for="postcode">Post Code:</label>
<input id="postcode" name="shippingpostcode" placeholder="Required" required="" type="text" /><br />
<label class="reglabel" for="phone">Phone:</label>
<input id="phone" name="shippingphone" placeholder="Required" required="" type="text" /><br />
<label id="EmailLabel" class="reglabel" for="email">E-mail:</label>
<input id="email" name="shippingemail" placeholder="Required" required="" type="email" /><br />
</fieldset>
</form>
This is the code which Im trying to check whether or not he field is empty, but it doesnt seem to work. 这是我试图检查他的字段是否为空的代码,但它似乎不起作用。 It alerts undefined
它提醒未定义
function validate()
{
var firstname = document.getElementsByName("shippingfname").value;
if (firstname == "")
{
alert('empty');
}
else
{
alert(firstname);
}
}
the function document.getElementsByName
returns an array, so you should try this: 函数
document.getElementsByName
返回一个数组,所以你应该试试这个:
function validate()
{
var firstname = document.getElementsByName("shippingfname")[0].value;
if (firstname == "")
{
alert('empty');
}
else
{
alert(firstname);
}
}
Or you can use jquery validation plugin easily. 或者您可以轻松使用jquery验证插件。 ıt is great for client side validations http://docs.jquery.com/Plugins/validation
对于客户端验证http://docs.jquery.com/Plugins/validation非常有用
getElementsByName()
returns an array. getElementsByName()
返回一个数组。 Not an individual element. 不是一个单独的元素。 In your example you will want to use the ID attribute to access individual elements.
在您的示例中,您将需要使用ID属性来访问单个元素。
<input name="shippingsame" id="shippingsame" onclick="fillShipping(this.form)" type="checkbox">
function validate()
{
var firstname = document.getElementByID("shippingfname").value;
if (firstname == "")
{
alert('empty');
}
else
{
alert(firstname);
}
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.