如何使用JavaScript进行表单验证?

时间:2019-12-29 16:23:57

标签: javascript html

我正在尝试创建一个表单,以检查JavaScript验证,如果用户没有输入任何内容,那么它会在进入我的数据库之前进行检查,但是会出现警报,但是当我在浏览器中查看时,如果没有将任何文本放在任何文本框中,然后单击“提交”,不会出现警告,如果您能帮助我,我什么也不会感谢

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 );
     }

2 个答案:

答案 0 :(得分:1)

我在您的代码中发现的唯一错误是定义eventTitle的行中的问号前缺少次要符号 修复打字错误,尝试清除浏览器缓存,然后尝试按F12键访问调试信息,以更好地了解问题所在。

答案 1 :(得分:0)

您已为每个输入指定了值,例如value="?=$contact['eventTitle']?>"

如果删除,您将收到警报。