Directing user to a URL 1

[Blueie]

Hello

I have some JS that checks form field validation on a Web page, and it does so effectively, and here is the part that deals with the Submit button:

$("#contact_submit button").click(function(event){
var form_data=$("#contact").serializeArray();
var error_free=true;
for (var input in form_data){
var element=$("#contact_"+form_data[input]['name']);
var valid=element.hasClass("valid");
var error_element=$("span", element.parent());
if (!valid){error_element.removeClass("error").addClass("error_show"); error_free=false;}
else{error_element.removeClass("error_show").addClass("error");}
}

if (!error_free){
event.preventDefault(); 
}
else{
alert('No errors: Form will be submitted');
}

At the end, instead of displaying that Alert box, is it possible to automatically direct the user to a 'Thank you' page?

The code that actually processes the email is in Classic ASP.

Thanks!

 

[Diancecht]

You can use window.location for that but I don't get the idea: you want to load a differente page if the data is not valid? What if the user just made a mistake? No second opportunities?

Cheers,
Dian

 

[Blueie]

No, the whole script looks like this:

<script>
		$(document).ready(function() {
			<!-- Real-time Validation -->
				<!--Name can't be blank-->
				$('#contact_name').on('input', function() {
					var input=$(this);
					var is_name=input.val();
					if(is_name){input.removeClass("invalid").addClass("valid");}
					else{input.removeClass("valid").addClass("invalid");}
				});
				
				<!--Email must be an email -->
				$('#contact_email').on('input', function() {
					var input=$(this);
					var re = /^[a-zA-Z0-9.!#$%&'*+/=?^_`{|}~-]+@[a-zA-Z0-9-]+(?:\.[a-zA-Z0-9-]+)*$/;
					var is_email=re.test(input.val());
					if(is_email){input.removeClass("invalid").addClass("valid");}
					else{input.removeClass("valid").addClass("invalid");}
				});
				
				<!--Website must be a website -->
				$('#contact_website').on('input', function() {
					var input=$(this);
					if (input.val().substring(0,4)=='www.'){input.val('[URL unfurl="true"]http://www.'+input.val().substring(4));}[/URL]
					var re = /(http|ftp|https):\/\/[\w-]+(\.[\w-]+)+([\w.,@?^=%&amp;:\/~+#-]*[\w@?^=%&amp;\/~+#-])?/;
					var is_url=re.test(input.val());
					if(is_url){input.removeClass("invalid").addClass("valid");}
					else{input.removeClass("valid").addClass("invalid");}
				});
				
				<!--Message can't be blank -->
				$('#contact_message').keyup(function(event) {
					var input=$(this);
					var message=$(this).val();
					console.log(message);
					if(message){input.removeClass("invalid").addClass("valid");}
					else{input.removeClass("valid").addClass("invalid");}	
				});
		
			<!-- After Form Submitted Validation-->
			$("#contact_submit button").click(function(event){
				var form_data=$("#contact").serializeArray();
				var error_free=true;
				for (var input in form_data){
					var element=$("#contact_"+form_data[input]['name']);
					var valid=element.hasClass("valid");
					var error_element=$("span", element.parent());
					if (!valid){error_element.removeClass("error").addClass("error_show"); error_free=false;}
					else{error_element.removeClass("error_show").addClass("error");}
				}
				if (!error_free){
					event.preventDefault(); 
				}
				else{
					alert('No errors: Form will be submitted');
				}
			});
			
			
			
		});
	</script>

It validates the fields and shows in red any errors that need to be corrected before the form can be submitted.

I just meant that if there are no errors instead of the alert box, how would the user then be redirected to a 'thankyou.asp' page.

Thanks for your reply!

 

[ChrisHirst]

add

<%
response.redirect "[thank_you_url]"
%>

To the code that actually sends the message.

Chris.

Indifference will be the downfall of mankind, but who cares?
Time flies like an arrow, however, fruit flies like a banana.
Webmaster Forum

 

[Diancecht]

I still don't get it: if it has no errors, then the form will be submitted and the handler can just return the message you want in the generated HTML.

Cheers,
Dian

 

[Blueie]

Hello Diancecht

if it has no errors, then the form will be submitted

But I don't want it submitted while that Alert Box is there. I want it submitted without the Alert Box AND for the redirected page to be the 'thankyou.asp' redirected page.

Thanks.

 

[ChrisHirst]

Remove the code for the "Alert" and submit the form there instead and let the server then handle the redirect.

Servers are MUCH better at redirecting than javascript is.

Chris.

Indifference will be the downfall of mankind, but who cares?
Time flies like an arrow, however, fruit flies like a banana.
Webmaster Forum

 

[vacunita]

When the form is submitted it is technically redirected to a new page which contains your ASP code. Your ASP code can then produce the thank you page directly and serve it to the browser after its done processing the form data. There's nothing more you need to to do in JS.





----------------------------------
Phil AKA Vacunita
----------------------------------
Ignorance is not necessarily Bliss, case in point:
Unknown has caused an Unknown Error on Unknown and must be shutdown to prevent damage to Unknown.

Web & Tech

 

[Blueie]

Great. Thank you to you both for your explanation. I wasn't sure to what extent JS could undertake the server-side code role. Basically, then, JS does all the donkey-work validation and passes it over to asp.

Thanks!

 

[1DMF]

JS does all the donkey-work validation and passes it over to asp.

It's considered good practice to validate both client and server side. Never assume your incoming request has passed validation just because the request is received, it might not be your page or a person with a browser running JS sending the ASP the request!

"In complete darkness we are all the same, it is only our knowledge and wisdom that separates us, don't let your eyes deceive you."

"If a shortcut was meant to be easy, it wouldn't be a shortcut, it would be the way!"
Free Electronic Dance Music

 

[Blueie]

Oh, I see what you mean!

Yes, best to do both.

Thanks!