嘗試驗證表單客戶端和服務器端

Question

客戶端驗證看起來像這樣：

function validateFname() {
    var x = document.getElementById('fname').value; 
    if (x==null || x=="")
    {
    alert("First name must be filled out");
    return false;
    }
}

它下面的服務器端：

if(isset($_POST['SubmitForm'])){
if(empty($_POST['fname'])){
    echo "First name cannot be empty!<br/><br/>";
    return false;
}

以及下面的表格：

<form name = 'checkout' method='post' action="<?php echo $_SERVER['PHP_SELF']; ?>"
accept-charset='UTF-8'>
First Name:<input type="text" name="fname" id="fname" onsubmit="return validateFname()"
class="required" value="<?php echo $fname;?>" />
<input type="submit" name="SubmitForm" value="Send"/>

當然，它還有很多其他功能，但上面僅舉了一個例子。 我試圖弄清楚為什么（clientside）javascript函數無法正常工作，而出現（server）php錯誤。 我需要能夠讓客戶端在服務器之前運行驗證檢查以減少負載。

Answer 1

onsubmit是屬於<form>元素的事件。 您已將其放置在“提交”按鈕上，該按鈕將不起作用。

這是一個工作的小提琴：

演示

參考

Answer 2

<form name = 'checkout' method='post' action="<?php echo $_SERVER['PHP_SELF']; ?>" accept-charset='UTF-8'>
First Name:<input type="text" name="fname" id="fname"  value="<?php echo $fname;?>" />
<input type="submit" name="SubmitForm" onClick="return validateFname()"  value="Send"/>
</form>

試試上面的代碼。 不用在輸入文本字段中使用onSubmit，而是在提交按鈕中使用onClick。 祝好運