user3264926
user3264926

Reputation: 41

no action when submit form

I am using form with HTML and JavaScript to check the input. I am doing it okay and if I enter a number I get message "Letters Only". But when I press the submit button, it doesn't give me the action page (w.php).

I want it so that when I press the login button take me to w.php page.

This is my code:

<html>

<head>
<link rel="stylesheet" href="projectsite/include/validationEngine.jquery.css" />
<title>Projects Site</title>
</head>
<body background="se16.jpg">

<script>(function(d, s, id) {
    var js, fjs = d.getElementsByTagName(s)[0];
    if (d.getElementById(id)) return;
    js = d.createElement(s); js.id = id;
    js.src = "//connect.facebook.net/en_US/all.js#xfbml=1";
    fjs.parentNode.insertBefore(js, fjs);
    }(document, 'script', 'facebook-jssdk'));</script>

<form id="my_form" method="post" action="w.php">
<center>
<br>
<h1> <p style="color:brown;">  Login Page </p> </h1> 

<hr color="brown"> <br> 
<caption><h1><p style="color:black;">please Enter Username & Password</p></h1><caption>
<table border="3">

<tr><td><h2><p style="color:black;">Username: </p></td><td><input type="text"     name="username" class="validate[required,custom[onlyLetterSp]]" /></td><h2></tr>

<tr><td><h2><p style="color:black;">Password:</p> </td><td><input type="password" name="password" class="validate[required,custom[onlyLetterPa]]" /></td></h2></tr>


<tr><td></td><td><input type="submit" value="Log in" /></td></tr>

</table>
</center>
</form>

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
    <script src="projectsite/include/jquery.validationEngine.js"></script>
    <script src="projectsite/include/jquery.validationEngine-en.js"></script>
    <script>
        function ajaxValidationCallback(status, form, json, options) {

        if(status == true) {

                $(':input', '#my_form').not(':button, :submit, :reset, :hidden').val('').removeAttr('checked').removeAttr('selected');
                $("#message_sent").slideDown(400).delay(3000).slideUp(400);

          }
         }      
        $("#my_form").validationEngine({
            ajaxFormValidation : true,
            onAjaxFormComplete : ajaxValidationCallback,
            scroll : false
        }); 
    </script>
</body>
</html>

Upvotes: 0

Views: 677

Answers (1)

rodix
rodix

Reputation: 425

based on the little I could research about the that Validation Engine, if you go for an AJAX validation the responsibility for submitting the form is on the callback.

link: https://github.com/posabsolute/jQuery-Validation-Engine/blob/master/demos/demoAjaxJAVA.html

// Called once the server replies to the ajax form validation request
function ajaxValidationCallback(status, form, json, options){
  if (console)
    console.log(status);

  if (status === true) {
    alert("the form is valid!");
    // uncomment these lines to submit the form to form.action
    // form.validationEngine('detach');
    // form.submit();
    // or you may use AJAX again to submit the data
  }
}

Upvotes: 1

Related Questions