简体   繁体   中英

validate form before submition

I want to submit a form with php variables to input into javascript, the problem is that the variables are only set after posting, which is too late for them to be echoed into the javascript. Of course, if I then submit again, the variables have been implemented into the javascript and it works as it should. However, I would prefer just to submit once. Is there any way to validate the form before submission ? Here is an example of my dilemma:

<?php
      if(isset($_POST['submit'])){$name=$_POST['name'];}
?>

<html>
 <div id="message"></div>
    <form action="home.html" method="POST">
       <input type="text" name="name">
       <input type="submit" name="submit" value="conditions-met" 
              onclick=<?php if($name=="bob"){echo"start();";}?>>
    </form>
</html>

 <script type="text/javascript">

  function start(){
       document.getElementById('message').innerHTML = 'hello bob';
  return true;
}
 </script>

Man people are mean to you!!

Basically you should validate the fields using JavaScript.

When the submit button is clicked do the checks. Continue on success, show an error message on failure.

example

<form id="myForm" onsubmit="return ValidateFields(this)" name="myForm" accept-charset="UTF-8" enctype="multipart/form-data"" action="myPhpScript.php" method="POST">

// html fields


</form>


<script>

function ValidateFields(formObject)
{

   var FieldsValid = true;

   //Validate the fields and if one of them is not valid set FieldsValid to false

if(!FieldsValid )
{
   //show an error message

return false; // Returing false will prevent the form from submitting

}

return true;// the form will be submitted
}

</script>

In order to become a ninja please read the following:

http://www.script-tutorials.com/form-validation-with-javascript-and-php/

http://www.webcredible.co.uk/user-friendly-resources/dom-scripting/validate-forms-javascript.shtml

http://www.w3schools.com/js/js_form_validation.asp

The function bound to the onclick-event must return true if validation is correct, or false otherwise.

The same function must be in javascript. You cannot call a php function in it. If you want php, try ajax.

<input type="submit" onsubmit="return validate();" />

<script>
    function validate() {
        // do validation in javascript
        // or make an ajax request e.g. to 
        //  /validate.php?name=somename&surname=someothername 
        // and let this request answer with true or false

        // return true if valid, otherwise false
    }
</script>

You can do it with Ajax and beforeSubmit function with Jquery You have:

$.ajax({
            url: "your async page in php",
            cache: true,
            data: $("#formID").serialize(),
            type: 'POST',
            beforeSend: function(){ 
                         /* You can validate your input here*/
            },
            success: function(response){
                /* Based on the response from php you can handle the message to the user*/
            },
            error: function(response){/*Error Handler*/},
            complete: function(){/*If it's complete than you can reset the form*/}
        });

I think it's easy and more clear if you use cross Ajax/PHP request

<html>
<div id="message"></div>
<form action="home.html" method="POST" onsubmit="return validate()">
<input type="text" name="name" id="name">
<input type="submit" name="submit" value="conditions-met" >
</form>
</html>

<script type="text/javascript">

function validate(){

name=document.getElementById('name').value;
if(name == "")
{
document.getElementById('message').innerHTML = 'Please Fill Name';
return false;
}
return true;
}
</script>

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM