ajax submit after html validation

Question

im having a few problems with an ajax login form when i am clicking submit button its not validating the form before submitting the ajax its just submitting the form where am i going wrong

this is the ajax script

    function wa_login() {
        var wa_username = $('#wa_username').val();
        var wa_password = $('#wa_password').val();
        var datas = 'wa_username=' + wa_username + '&wa_password=' + wa_password;

        $.ajax({
            type: 'POST',
            url: '/limitless/functions.php',
            data: datas
        })
        .done(function (data) {
            $('#info').html(data);
        });
    }

here is the form itself




Login to your account Enter your credentials below
    



 
            
        
    

    
        
        
            
        
    

    
        
    

    
        Forgot password? | Sign Up

wilsotobianco · Accepted Answer

What you need to do is catch the form submit event with jQuery as follows:

$('#form').on('submit',function(event){
  
  event.preventDefault(); // prevent default behavior
  
  if(formIsValid()){  // Execute validations in formIsValid() function
                      // returning true if valid, false if not
    $.ajax({
            type: 'POST',
            url: '/limitless/functions.php',
            data: $(this).serialize() // automatically serializing form
        })
        .done(function (data) {
            $('#info').html(data);
    });
  } else{
    console.log('Sorry, wrong login credentials');
  }
  
  function formIsValid(){
    // Always returning false to show how submit is not called
    return false;
  }
  
});






Login to your account Enter your credentials below
    



 
            
        
    

    
        
        
            
        
    

    
        
    

    
        Forgot password? | Sign Up

Watch the console log, you must see a message alerting about wrong login credentials. Hope it helps!

ajax submit after html validation

Answers (2)

Related Questions