形式的JavaScript後未提交validaton

Question

我有我試圖JavaScript驗證後提交：

<form name="myForm" class="formcss" onsubmit="return validateForm();" method="POST" action="createProject3.php" id="reportform" enctype="multipart/form-data"> 
     <div id="project" class="small-9 large-9 columns"> 
     <label>Project <?php echo $code?></label> 
      <div class="rowone"> 
       <div class="projLeader"> 
       <div class="ui-widget-content"> 
       <label>Captain:</label> 
        <ol> 
         <li class="placeholder" name="projLeader"><div class="adding">Drop Here</div></li> 
         <input type="hidden" name="projLeader" class="hiddenListInput1" required/> 
        </ol> 
       </div> 
       </div> 

       <div class="projChecker"> 
       <div class="ui-widget-content"> 
       <label>Coordinator:</label> 
        <ol> 
         <li class="placeholder" name="projChecker"><div class="adding">Drop Here</div></li> 
         <?php 
           //echo '<li class="dropClass" name="projChecker"> <span class="closer">x</span>'.$_SESSION['projChecker'].'</li>'; 
         ?> 
         <input type="hidden" name="projChecker" class="hiddenListInput2" required/> 
        </ol> 
       </div> 
       </div> 

       <div class="info"> 
       <div class="ui-widget-content"> 
       <label>Information:</label> 
        <ol> 
         <li class="totalinfo">Total: </li> 
         <li class="leaderinfo">Leaders:</li> 
         <li class="checkerinfo">Checkers:</li> 
         <li>Interns:</li> 
         <li>Artists:</li> 
        </ol> 
       </div> 
       </div> 
      </div> 
      <div class="rowtwo"> 
      <?php 
         for($y=0;$y<$len;$y++) 
         { 
          echo "<div class='proc'> <pre>"; 
          echo "<h6>Process: ".$proc[$y]."  " ; 
          echo "People required: ".$num[$y]."  "; 
          echo "<span class='assigned' name='assigned[]' >People Assigned: </span><br /></h6></pre>"; 
        ?> 

        <div class="procLeader"> 
        <div class="ui-widget-content"> 
        <label>Leader:</label> 
         <ol> 
          <li class="placeholder"><div class="adding">Drop Here</div></li> 
         </ol> 
        </div> 
        </div> 

        <div class="procChecker"> 
        <div class="ui-widget-content"> 
        <label>Checker:</label> 
         <ol> 
          <li class="placeholder"><div class="adding" >Drop Here</div></li> 
         </ol> 
        </div> 
        </div> 

        <div class="procStaff"> 
        <div class="ui-widget-content"> 
        <label>Staff:</label> 
         <ol> 
          <li class="placeholder"><div class="adding">Drop Here</div></li> 
         </ol> 
        </div> 
        </div>      

        <?php  
         echo "</div>";      
         } 
        ?> 

      </div>  
      <div class="row"> 
       <div class="small-6 large-6 columns"> 
        <input type = "submit" style="margin-left:300px; width:150px;" id="savebutton" name ="submit" class="button" value = "Create Project" onclick="userSubmitted = true;"/> 

       </div> 
      </div>    
      <div class="output1"></div> 
      </br></br></br>    
      <div class="output2" onsubmit="return validateForm()"></div>  
      <div class="output3"></div>     
     </div> 

    </fieldset> 
</form> 

並進行驗證的JavaScript函數：

function validateProjLeader() 
{ 
    var projLeader = document.forms["myForm"]["projLeader"].value; 
    if (projLeader == null || projLeader == "" || projLeader == "Drop Here") { 

     return false; 
    }  
} 

function validateProjChecker() 
{ 
    var projChecker = document.forms["myForm"]["projChecker"].value; 
    if (projChecker == null || projChecker == "" || projChecker == "Drop Here") { 

     return false; 
    }  
} 

function validateProcLeader() 
{ 
    var procLeader = document.getElementsByName("procLeader[]"); 
    for (var x = 0; x < procLeader.length; x++) { 

     if(procLeader[x].value == '' || procLeader[x].value == '0' || procLeader[x].value == 'Drop Here'){ 

      return false; 
     } else {return true;} 
    } 
} 

function validateProcChecker() 
{ 
    var procChecker = document.getElementsByName("procChecker[]"); 
    for (var y = 0; y < procChecker.length; y++) { 

     if(procChecker[y].value == '' || procChecker[y].value == '0' || procChecker[y].value == 'Drop Here'){ 

      return false; 
     } else {return true;} 
    } 
} 

function validateForm() 
{ var validation = true; //<-- set to true 
    if ((validateProjLeader() && validateProjChecker() && validateProcLeader && validateProcChecker())== true) 

    return validation; //<--- returns true 
    else 
     alert('Please fill All Required Fields Checker Field'); 
//<-- if false you do not return anything 
} 

我嘗試內部形狀不同的方式：

onsubmit="return!!(validateProjLeader() & validateProjChecker() & validateProcLeader() & validateProcChecker());" 

還有

onsubmit="return validateForm()" 

對於第一個我得到所有驗證，但表單沒有提交，它只是停留在同一頁面上，而沒有進入下一頁。此外，我對每個不友好用戶的領域都發出警報，因此我試圖將所有功能合併到一起，並打印出所有錯誤的總體警報。但似乎這種方式也不起作用。如何在提交表單上組合多個功能，然後進入另一個頁面？

Answer 1

嘗試調用validateForm（）內的form.submit，而不是返回true。