Join the social network of Tech Nerds, increase skill rank, get work, manage projects...
 
  • prevent form submitting in Jquery ?

    • 0
    • 0
    • 0
    • 1
    • 0
    • 0
    • 0
    • 681
    Answer it

    how can i prevent submit if i got next :-
    username is too short
    first character must a letter
    user_name is not available
    invalid E-mail format
    E-mail is not available
    password do not match

    i got other problem password confirmation is not working after i add and remove some line of codes


    and how can i redirect after sign up  to login page

    $(document).ready(function() {
         $("#user_name").keyup(function() {
    
    		var user_name = $("#user_name").val();
    
    		if (user_name == "") {
    			$("#username_error").html(" ");
    
    			
    		} 
    		 else if (user_name.length < 3) {
    			$("#username_error").html("to short");
    			
    
    		}else if(validate_user_name(user_name)){
    			$("#username_error").html("first character must be a letter");
    		}
    		
    		 else {
    
    			
    		    $.ajax({
    				type : "POST",
    				url : "processes.php",
    				data : "user_name=" + user_name,
    				success : function(data) {
    					$("#username_error").html(data);
    					$("#loaderIcon").hide();
    				},
    				
    			});
    		}
    		
    	        function validate_user_name(user_name) {
    	          var filter = /^[a-z](?:_?[a-z0-9]+)*$/i;
    	            if (!filter.test(user_name)) {
    					
    		         return true;
    				 
    	            } else {
    					
    		         return false;
    				
    	            }
                }
    
    
    		
    	});
    
    	$("#myemail").keyup(function() {
    
    		var myemail = $(this).val();
    
    		if (myemail == "") {
    			$("#email_error").html("fill out your email");
    		}
    		
    		else if(validate_myemail(myemail)){
    			$("#email_error").html("Invalid Email Address");
    		}
    		else {
    
    			$.ajax({
    
    				type : "POST",
    				url : "processes.php",
    				data : "myemail=" + myemail,
    				success : function(msg) {
    					
    						$("#email_error").html(msg);
    				}
    			});
    
    		}
    		
    	function validate_myemail(myemail) {
    	var filter = /^[\w\-\.\+]+\@[a-zA-Z0-9\.\-]+\.[a-zA-z0-9]{2,4}$/;
    	if (!filter.test(myemail)) {
    		return true;
    	} else {
    		return false;
    	}
    }
    
    		
    
    	});
    
    	$("#mypassword").keyup(function() {
    
    		var mypassword = $("#mypassword").val();
    		$('#password_error').html(checkStrength($('#mypassword').val()))
    
    		if (mypassword == "") {
    			$("#password_error").html(" ");
    	
    		} 
    		
    	function checkStrength(mypassword)
    	{
    		
    		var strength = 0
    		
    		
    		if (mypassword.length < 3) { 
    			$('#password_error').removeClass()
    			$('#password_error').addClass('short')
    			return 'Too short' 
    		}
    		
    	
    		if (mypassword.length > 7) strength += 1
    		
    		
    		if (mypassword.match(/([a-z].*[A-Z])|([A-Z].*[a-z])/))  strength += 1
    		
    		
    		if (mypassword.match(/([a-zA-Z])/) && mypassword.match(/([0-9])/))  strength += 1 
    		
    	
    		if (mypassword.match(/([!,%,&,@,#,$,^,*,?,_,~])/))  strength += 1
    		
    		
    		if (mypassword.match(/(.*[!,%,&,@,#,$,^,*,?,_,~].*[!,%,&,@,#,$,^,*,?,_,~])/)) strength += 1
    		
    		if (strength < 2 )
    		{
    			$('#password_error').removeClass()
    			$('#password_error').addClass('weak')
    			return 'Weak'			
    		}
    		else if (strength == 2 )
    		{
    			$('#password_error').removeClass()
    			$('#password_error').addClass('good')
    			return 'Good'		
    		}
    		else
    		{
    			$('#password_error').removeClass()
    			$('#password_error').addClass('strong')
    			return 'Strong'
    		}
    	}
    		
    	});
    
    	$("#mypasswordconfirm").keyup(function() {
    
    		var mypasswordconfirm = $("#mypasswordconfirm").val();
    		if (mypasswordconfirm == "") {
    			$("#passwordconfirm_error").html(" ");
    		
    		} else if (mypassword !== mypasswordconfirm) {
    			
    			$("#passwordconfirm_error").html("no match");
    			
    		} else {
    			$("#passwordconfirm_error").html("great");
    			
    		}
    
    	});
    
    	$("#mysubmit").click(function(prevent) {
    
    		if ($.trim($("#user_name").val()) === "" || $.trim($("#myemail").val()) === "" || $.trim($("#mypassword").val()) === "" || $.trim($("#mypasswordconfirm").val()) === "") {
    
    			prevent.preventDefault();
    			$("#mysubmit_error").html("please fill out all the form data");
    			return false;
    		} else {
    			$.ajax({
    
    				type : "POST",
    				url : "processes.php",
    				data : "username" + user_name + "&myemail" + myemail + "&mypassword" + mypassword,
    				success : function(message) {
    
    					if (message == "done") {
    						$("#mysubmit_error").html("you are signed up!");
    					} else {
    						$("#mysubmit_error").html("you are not signed up!!");
    					}
    
    				}
    			});
    		}
    
    	});
    	
    
    	 
    
    
    });

     

 1 Answer(s)

  • Hello Nasiya,

    I have checked your question and I found that you are not using submit event of query. You can put the different if conditions for different field like username and email. If these are not properly filled out then use the reutrn false or preventDefault to stop the form. or you can use the jquery.validation.js lib https://jqueryvalidation.org/ Thank you

    Deepak Verma

Sign In
                           OR                           
                           OR                           
Register

Sign up using

                           OR                           
Forgot Password
Fill out the form below and instructions to reset your password will be emailed to you:
Reset Password
Fill out the form below and reset your password: