Question

73

Preventing form submission when input field is empty

rated 0 times [ 78] [ 5] / answers: 1 / hits: 107621 / 11 Years ago, thu, april 11, 2013, 12:00:00

When no value is provided to the roll input field an alert is produced by the empty() function but this empty value is still passed to retrive.php. So how can I stop this from happening and only pass the value to retrive.php when some input value is provided?

<html>

 <head>

   <title>STUDENT FORM</title>

    <script type="text/javascript">

        function empty()

        {

          var x;

          x = document.getElementById("roll-input").value;

          if (x == "") 

           { 

              alert("Enter a Valid Roll Number");

           };

        }

    </script>

</head>

 <body >

  <h1 align="center">student details</h1>       

    <div id="input">

      <form action='retrive.php' method='get'>

       <fieldset>

        <legend>Get Details</legend>

          <dl>

            <dt><label for="roll-input">Enter Roll Number</label></dt>

        <dd><input type="text" name="roll" id="roll-input"><dd>

            <input type="submit" value="submit" onClick="empty()" />

          </dl>

        </fieldset>

      </form>

    </div>  

  </body>

</html>

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

cassies

Add To Favorites

Follow

Total Points: 112

Total Questions: 99

Total Answers: 96

Location: Mexico

Member since Sun, Jul 25, 2021

3 Years ago

answered 11 Years ago kaceyr · Accepted Answer

You need to return false to cancel the submit.

function empty() {

    var x;

    x = document.getElementById(roll-input).value;

    if (x == ) {

        alert(Enter a Valid Roll Number);

        return false;

    };

}

and

<input type=submit value=submit onClick=return empty() />

jsFiddle example