CODEWITHSUNDEEP
javascripthtml
user12619938
user12619938

Reputation:

How can I have form validation using JavaScript?

I am trying to create a form that checks for JavaScript validation before it goes into my database basically if a user does not type in anything then a alert will come up, however when viewing it in the browser, when I don't place any text inside any of the text boxes and hit submit, no alert comes up, no nothing i'd appreciate it if you could help me out please

HTML

<body>
<form action="update.php?eventID=<?=$contact['eventID']?>" name="myForm"  onsubmit="return validate()" method="post">

    <label for="eventTitle">Event Title</label>
    <input type="text" name="eventTitle" value="?=$contact['eventTitle']?>" id="eventTitle">

    <label for="eventDescription">Event Description</label>
    <input type="text" name="eventDescription" value="<?=$contact['eventDescription']?>" id="eventDescription">

    <label for="eventStartDate">Event Start Date</label>
    <input type="text" name="eventStartDate" value="<?=$contact['eventStartDate']?>" id="eventStartDate">

    <label for="eventEndDate">Event End Date</label>
    <input type="text" name="eventEndDate" value="<?=$contact['eventEndDate']?>" id="eventEndDate">

    <label for="eventPrice">Event Price</label>
    <input type="text" name="eventPrice" value="<?=$contact['eventPrice']?>" id="eventPrice">

    <input type="submit" value="Update">

</form> 

<script src="update.js"></script>
</body>

JavaScript

function validate() {
     if( document.myForm.eventTitle.value == "" ) {
           alert( "Please enter a Event Title" );
            document.myForm.eventTitle.focus() ;
            return false; 
         }

         if( document.myForm.eventDescription.value == "" ) {
            alert( "Please enter a event Description!" );
            document.myForm.eventDescription.focus() ;
            return false;
         }
          if( document.myForm.eventStartDate.value == "" ) {
            alert( "Please enter a event Start Date!" );
            document.myForm.eventStartDate.focus() ;
             return false;
        }
          if( document.myForm.eventEndDate.value == "" ) {
            alert( "Please enter a event End Date!" );
            document.myForm.eventEndDate.focus() ;
            return false;
        }

         if( document.myForm.eventPrice.value == "" ) {
            alert( "Please enter a event End Date!" );
            document.myForm.eventPrice.focus() ;
           return false;

         }
          return( true );
     }

Upvotes: 1

Views: 50

Answers (2)

playmangostin giu
playmangostin giu

Reputation: 11

The only error I found in your code is a missing minor sign before question mark in the line where you define eventTitle Fix the typo, try clearing browser cache, and try pressing F12 to access debug information to better understand what's going wrong.

Upvotes: 1

Arun Kumar
Arun Kumar

Reputation: 16

You have given value for each input e.g. value="?=$contact['eventTitle']?>"

If you remove that you will get an alert.

Upvotes: 0

Related Questions