在調用jsp中的onclick方法之前進行表單驗證

我添加了html驗證，並且需要在按鈕單擊時使用所有js方法。這裏的onclick方法大火連字段沒有填寫。（它顯示爲必填的警報，但執行上點擊方法太）在調用jsp中的onclick方法之前進行表單驗證

<form > 
    <input class="form-control" type="text" id="to" placeholder = "directed to: Admin" required> 
    <input class="form-control" type="text" id="header" placeholder = "message heading" required> 
    <textarea class="form-control" id="content" rows="3" placeholder = "message body" required></textarea> 
    <button type="submit" class="btn btn-warning" onclick="saveMessage()" >Search</button></form>

js函數

function saveMessage(){ 
    var to = document.getElementById('to').value; 
      var header = document.getElementById('header').value; 
      var body = document.getElementById('content').value; 
      var xhttp = new XMLHttpRequest(); 
      xhttp.onreadystatechange= function(){ 
       if(xhttp.readyState===4 & xhttp.status===200){ 
        swal("Success!", "Submitted the message successfully!", "success"); 

       } 
      }; 
      xhttp.open("POST","addCusMessage?valto="+to+"&valheader="+header+"&valbody="+body,true); 
      xhttp.send(); 
     } 

    </script>

來源

2016-12-24 thili

可以共享saveMessage（）函數的代碼？ –

以上補充..其通過輸入字段到另一個servelet .. – thili

具有「必需」屬性的字段必須在提交表格之前填入值。

您沒有提交表單：您正在讀取字段的值並使用這些值來構建您的XMLHttpRequest。

應測試字段的值在saveMessage（）函數，如（例如只爲報頭字段）

if(header == "") { 
    alert("Header cannot be empty"); 
} else { 
    var xhttp = new XMLHttpRequest(); 
    xhttp.onreadystatechange= function(){ 
     if(xhttp.readyState===4 & xhttp.status===200){ 
       swal("Success!", "Submitted the message successfully!", "success"); 

      } 
     }; 
    xhttp.open("POST","addCusMessage?valto="+to+"&valheader="+header+"&valbody="+body,true); 
     xhttp.send(); 
}

來源

2016-12-24 10:15:18

哎呀..剛剛看到你的答案後提交我的... –

是的，我做了同樣的..謝謝 – thili

我只是添加了對js函數的驗證，並解決了問題。謝謝

來源

2016-12-24 10:13:11 thili

在調用jsp中的onclick方法之前進行表單驗證

回答

相關問題