How to validate an input?

5

I have a form that sends the values entered in input to another page. I want to make a validation between the inputs, if one number is greater than another, and if not, do not go to the second page and warn with alert .

Here is my HTML code:

<form action="_graphes.php" method="post"> 
  <input type="time" id="time_debut" name="time_debut" step="1" value=''>
  <input type="time" id="time_fin" name="time_fin" step="1" value='' >
  <input id=btn type=submit name=go value=ok>
</form>

And the javascript:

if(document.getElementById("time_debut").value > document.getElementById("time_fin").value){
    alert("Maior");
}
    
asked by anonymous 12.01.2015 / 12:16

3 answers

3

You can validate the form by following the example below, completing the validation to verify that one or both fields are empty :

html

<form action="_graphes.php" method="post" id="formulario"> 
    <input type="time" id="time_debut" name="time_debut" step="1" value="">
    <input type="time" id="time_fin" name="time_fin" step="1" value="" >
    <input id="btn" type="button" onclick="return envia()" name="go" value="ok">
</form>

The% btn 'when it is clicked it calls the input function below, where validation and submission of envia() occurs.

js

function envia() {
        var time_debut = document.getElementById("time_debut").value;
        var time_fin = document.getElementById("time_fin").value;
        if(time_debut == '' || time_fin == '') {
            alert("Preencha todos os campos!");
        }
        else if (time_debut > time_fin){
            alert("Maior");
        }
        else {
            document.getElementById("formulario").submit();
        }   
    }

js (No validate if fields are empty)

function envia() {
            var time_debut = document.getElementById("time_debut").value;
            var time_fin = document.getElementById("time_fin").value;
            if (time_debut > time_fin){
                alert("Maior");
            }
            else {
                document.getElementById("formulario").submit();
            }   
        }
    
12.01.2015 / 12:43
3

Try doing just putting the submit in the javascript.

This is your HTML:

<form id="frm" action="_graphes.php" method="post"> 
  <input type="time" id="time_debut" name="time_debut" step="1" value=''>
  <input type="time" id="time_fin" name="time_fin" step="1" value='' >
  <input id="btn" type="button" onclick="javascript: btn_click()" name="go" value="ok">
</form>

And the javascript:

function btn_click() {
    if (document.getElementById("time_debut").value > document.getElementById("time_fin").value) {
        alert("Maior");
        return;
    }
    document.getElementById("frm").submit();
}
    
12.01.2015 / 12:40
3

In the form tag, add a call to the form's validation function.

<form action="_graphes.php" method="post" onsubmit="validar()"> 

The validation function will contain the code snippet you have already built:

function validar() {
    if(document.getElementById("time_debut").value > document.getElementById("time_fin").value) {
        alert("Maior");
        return (false);
    }
    else {
        return (true);
    }
}

The return(false) will cause the submission of the form to be interrupted, and the next page will not be called.

    
12.01.2015 / 12:41