It's maybe a stupid question, but it's my first year working with something like javascript.
I got some alert boxes, and I was wondering if there any possiblility to show only one alert box (in javascript) with all the stuff I want them to do.
And when they fill in one of the inputs or buttons, that the allert will only show the other missing things.
(I'm getting an alert of the first code. When I fill it in I get an alert of the next code, and so on. I want to have all in one.)
/*validate name*/
var n=document.forms["check"]["name"].value;
if(n==null||n=="")
{
alert("Please, fill in your name.");
return false;
}
/*validate the sex*/
if(document.getElementById('male').checked)
{
}
else if(document.getElementById('female').checked)
{
}
else
{
alert("Please, enter your gender.");
return false;
}
/*validate the E-mail*/
var e=document.forms["check"]["email"].value;
var atpos=e.indexOf("#");
var dotpos=e.lastIndexOf(".");
if(e==null||e=="")
{
alert("Please, fill in your e-mail.");
return false;
}
if(atpos<1 || dotpos<atpos+2 || dotpos+2>=e.length)
{
alert("This isn't a valid e-mail address.");
return false;
}
/*validate agreement*/
if(document.getElementById("I don't want my information to be part of this website.").checked)
{
}
else if(document.getElementById("I wish to be registered.").checked)
{
}
else if(document.getElementById("I wish to get the new content of this website.").checked)
{
}
else
{
alert("Please, tell us what we can do with your information.");
return false;
}
/*validate the terms*/
if(document.getElementById("yes").checked)
{
}
else if(document.getElementById("no").checked)
{
alert("You have to agree with the terms.");
return false;
}
else
{
alert("Please, enter the terms.");
return false;
}
// initialise an array to populate along the way
var alerts = [];
/*validate name*/
var n = document.forms[ "check" ][ "name" ].value;
if ( n == null || n == "" ) {
// push message onto the array
alerts.push( "Please, fill in your name." );
return false;
}
/*validate the sex*/
if ( document.getElementById( 'male' ).checked ) {} else if ( document.getElementById( 'female' ).checked ) {} else {
// push message onto the array
alerts.push( "Please, enter your gender." );
return false;
}
/*validate the E-mail*/
var e = document.forms[ "check" ][ "email" ].value;
var atpos = e.indexOf( "#" );
var dotpos = e.lastIndexOf( "." );
if ( e == null || e == "" ) {
// push message onto the array
alerts.push( "Please, fill in your e-mail." );
return false;
}
if ( atpos < 1 || dotpos < atpos + 2 || dotpos + 2 >= e.length ) {
// push message onto the array
alerts.push( "This isn't a valid e-mail address." );
return false;
}
// join up the array of messages, and alert the user...
alert(alerts.join(", "));
In summary...
// initialise an array to populate along the way
var alerts = [];
...
// push messages onto the array
// (repeat this step for all messages)
alerts.push( "Any validation message" );
...
// join up the array of messages, and alert the user...
alert(alerts.join(", "));
Related
I need your assistant and help in modifying the below code to show the validation messages if not satisfied together not one by one. My code is:
function validateForm()
{
var x = "";
var y = "";
if ( (RFC.C1.checked) && (!RFC.Language_e.checked || !RFC.Language_e.checked ))
{
y += "Please Select the Language";
document.getElementById('error').innerHTML = y;
return false;
}
else if (document.RFC.Reason.value=="")
{
x += "Please enter a Reason";
document.getElementById('error').innerHTML = x;
return false;
}
else
{
return true;
}
}
In addition, the validation message is shown one time and if the user didn't correct it and submit the page, the error will not be shown again. Can you please help in the two issues?
I would do something like this:
function validateForm() {
var error = "";
var valid = true;
if ( (RFC.C1.checked) && (!RFC.Language_e.checked || !RFC.Language_e.checked )) {
error += "<li>Please Select the Language</li>";
valid = false;
}
else if (document.RFC.Reason.value=="") {
error += "<li>Please enter a Reason</li>";
valid = false;
}
if(valid === false) {
document.getElementById('error').innerHTML = "<ul>" + error + "</ul>";
}
return valid;
}
Get all your errors and store them.
Change the valid boolean to false if any single or multiple error occurs
Only display errors if they happen.
Link to the error locations in your page for easy navigation.
function validateForm()
{
var x = "";
var y = "";
var z = "";
if ( (RFC.C1.checked) && (!RFC.Language_e.checked || !RFC.Language_e.checked) )
{
y += "Please Select the Language";
document.getElementById('error').innerHTML = y;
return false;
}
else if ( document.RFC.Reason.value=="" )
{
x += "Please enter a Reason";
document.getElementById('error').innerHTML = x;
return false;
}
else if ( ((RFC.C1.checked) && (!RFC.Language_e.checked || !RFC.Language_e.checked )) && (document.RFC.Reason.value=="") )
{
z += "Please enter a Reason and Language";
document.getElementById('error').innerHTML = z;
return false;
}
else
{
return true;
}
}
By the way your code is working but not nice. You should read something about programming style. To get nice validation quicly you can use jQuery Validate plug-in.
This is my script, I want to create alert when field is empty then display the alert on screen when enter key is pressed. I want the script which including when I write in the textbox and press enter then verify that keyword and go to next textbox.
<script type="text/javascript">
function validate()
{
var letters = /^[A-Za-z]+$/;
if( document.myForm.vname.value == "" )
{
alert( "Please provide your Vehicle Name!" );
document.myForm.vname.focus();
return false;
}
else if (document.myForm.vname.value.length > 15)
{
alert("Vehicle name cannot be more than 15 characters");
document.myForm.vname.focus() ;
return false;
}
else if(!document.myForm.vname.value.match(letters))
{
alert("Enter Only Characters ");
document.myForm.vname.focus() ;
return false;
}
if( document.myForm.usage.value == "" )
{
alert( "Please provide your Vehicle Usage!" );
document.myForm.usage.focus() ;
return false;
}
if( document.myForm.vtype.value == 0 )
{
alert( "Please provide your Vehicle Type!" );
document.myForm.vtype.focus() ;
return false;
}
if( document.myForm.vmodelno.value == "" )
{
alert( "Please provide your Model No!" );
document.myForm.vmodelno.focus() ;
return false;
}
if( document.myForm.ftype.value == 0 )
{
alert( "Please provide your Fuel Type!" );
document.myForm.ftype.focus() ;
return false;
}
if( document.myForm.cmp.value == "" )
{
alert( "Please provide your Company Name!" );
document.myForm.cmp.focus() ;
return false;
}
return( true );
}
</script>
on pressing enter form will get submitted.
instead you can call when focus is out for every input field. like:
$("#myfield").blur(function(){
----
});
This code work with Jquery
I want to validate my form, if any of the input field is blank, the error warning will show beside the blank input field. The error message must be comes out all at one time for the blank input, not show one by one. How to do this?
Below is my javascript code :
function doValidate()
{
var x=document.forms["form"]["fullname"].value;
if (x==null || x=="")
{
document.getElementById('error1').innerHTML="Full name is required!";
return false;
}
var y=document.forms["form"]["uid"].value;
if (y==null || y=="")
{
document.getElementById('error2').innerHTML="Username is required!";
return false;
}
var z=document.forms["form"]["pwd"].value;
if (z==null || z=="")
{
document.getElementById('error3').innerHTML="Password is required!";
return false;
}
var a=document.forms["form"]["pwd2"].value;
if (a==null || a=="")
{
document.getElementById('error4').innerHTML="Please re-enter your password!";
return false;
}
var pwd = document.getElementById("pwd").value;
var pwd2 = document.getElementById("pwd2").value;
if(pwd != pwd2){
alert('Wrong confirm password!');
return false;
}
var b=document.forms["form"]["role"].value;
if (b==null || b=="Please select...")
{
document.getElementById('error5').innerHTML="Please select user role!";
return false;
}
}
You should start your function with var ok = true, and in each if-block, instead of having return false, you should set ok = false. At the end, return ok.
Here's what that might look like:
function doValidate() {
var ok = true;
var form = document.forms.form;
var fullname = form.fullname.value;
if (fullname == null || fullname == "") {
document.getElementById('error1').innerHTML = "Full name is required!";
ok = false;
}
var uid = form.uid.value;
if (uid == null || uid == "") {
document.getElementById('error2').innerHTML = "Username is required!";
ok = false;
}
var pwd = form.pwd.value;
if (pwd == null || pwd == "") {
document.getElementById('error3').innerHTML = "Password is required!";
ok = false;
}
var pwd2 = form.pwd2.value;
if (pwd2 == null || pwd2 == "") {
document.getElementById('error4').innerHTML = "Please re-enter your password!";
ok = false;
} else if (pwd != pwd2) {
document.getElementById('error4').innerHTML = "Wrong confirm password!";
ok = false;
}
var role = form.role.value;
if (role == null || role == "Please select...") {
document.getElementById('error5').innerHTML = "Please select user role!";
ok = false;
}
return ok;
}
(I've taken the liberty of changing to a more consistent formatting style, improving some variable-names, simplifying some access patterns, and replacing an alert with an inline error message like the others.)
My goal is this:
Check if email and name are empty. If so, give 'Enter email or name' alert.
If they do, check for an # in email If none is found, give 'Bad email' alert.
Check if email and name contain any letters, if they do, give 'Success' alert
function test(email, name){
if(email=="" || name == "") {
alert("Enter mail or name");}
return false;
if(email.indexOf("#") == -1){
alert("Bad email");}
return false;
var a = email.length;
var b = name.length;
if(a==>0, b==>0){
alert("Message sent");}
return true;
}
This is what I've come up with so far, but it isn't working. I'm quite new at javascript so maybe you guys could tell me what I've done wrong?
The problem you're having is the close bracket is in the wrong place. You have it at the end of your alert statement and you probably want the return to be included with your if statement. if this is the case then change it to be:
function test(email, name){
if(email=="" || name == "") {
alert("Enter mail or name");
return false;
}
if(email.indexOf("#") == -1){
alert("Bad email");
return false;
}
var a = email.length;
var b = name.length;
if(a > 0 && b > 0){
alert("Message sent");
return true;
}
}
A better way to do the same thing would be because that way you're not checking the variables for length and size twice:
function test(email, name) {
var a = email.length;
var b = name.length;
if ( a > 0 && b > 0 ) {
// ignore 0 because email addresses shouldn't start with #
if ( email.indexOf("#") > 0 ) {
alert("Message sent");
return true;
}
else {
alert("Bad email");
return false;
}
}
else {
alert("Enter mail or name");
return false;
}
}
Try this JSFiddle that seems to fit your needs http://jsfiddle.net/9nF5W/
function test(email, name) {
if (email == "" || name == "") {
alert("Enter mail or name");
return false;
}
if (email.indexOf("#") == -1) {
alert("Bad email");
return false;
}
var a = email.length;
var b = name.length;
if (a > 0 && b > 0) {
alert("Message sent");
}
return true;
}
test('tes#t', 'test');
I think there is an other mistake than the returns statements in "if(a==>0, b==>0){" by the way.
In one of my textbox i need to enter only multiple url or multiple text at a time,not both.
So while i use the regular expression given below the domain name "google.com" will satisfy the condition of text.But i need to return false for this type of entry.Can anyone please suggest an idea?
jQuery.validator.addMethod("newway", function(value, element) {
var testarray = ['.....'];
var url_count = 0;
var text_count = 0;
for(var k in testarray){
if(/^(http:\/\/|https:\/\/)?((([\w-]+\.)+[\w-]+)|localhost)(\/[\w- .\/?%&=]*)?/i.test(testarray[k]))
{
console.log("url");
url_count++;
}
else{
if(/^[a-zA-Z+,:;%()]+$/.test(testarray[k])){
console.log("text");
text_count++;
}
}
}
if((url_count==0 && text_count > 0) || (url_count >0 && text_count == 0)){
if((url_count==testarray.length) || (text_count==testarray.length)){
return true
}
else{
return false
}
}else{
return false
}
}, "Please enter url or text");