阻止/允許表單提交

我試圖阻止/允許表單使用以下js中給出的某些條件進行提交。我能夠從我的PHP代碼中獲得所有的響應並顯示它們，但是防止/允許表單被提交的if條件似乎現在可以按照它應該的方式工作。儘管從PHP獲取響應時間有所延遲。如果條件滿足，只有當答案是「OK」，但if條件被處理之前我得到了來自PHP代碼的響應。阻止/允許表單提交

請幫忙

謝謝。

JS -

function checkall() { 
var name=document.getElementById("UserName").value; 
var email=document.getElementById("UserEmail").value; 
var group=document.getElementById("GroupName").value; 

if(name) 
{ 
$.ajax({ 
type: 'post', 
url: 'checkdata.php', 
data: { 
user_name:name, 
}, 
success: function (response) { 
$('#name_status').html(response); 
} 
}); 
} 
else 
{ 
$('#name_status').html(""); 
} 

if(email) 
{ 
$.ajax({ 
type: 'post', 
url: 'checkdata.php', 
data: { 
user_email:email, 
}, 
success: function (response) { 
    $('#email_status').html(response); 
    } 
}); 
} 
else 
{ 
    $('#email_status').html(""); 
    return false; 
} 


if(group) 
{ 
$.ajax({ 
    type: 'post', 
    url: 'checkdata.php', 
    data: { 
    groupname:group, 
    }, 
success: function (response) { 
    $('#group_status').html(response); 
    } 
}); 
} 
else 
{ 
$('#group_status').html(""); 
return false; 
} 

var namehtml=document.getElementById("name_status").innerHTML; 
var emailhtml=document.getElementById("email_status").innerHTML; 
var grouphtml=document.getElementById("group_status").innerHTML; 

if((namehtml && emailhtml && grouphtml)=="OK") 
    { 
    alert("processing"); 
    return true; 
    } else { 
    alert("Failed To Submit");    
    return false; 
    } 

//return false; 
}

的Html -

<form name="registration" action="" method="post" onsubmit="return checkall()" autocomplete="off"> 
    <input type="text" name="username" required="required" id="UserName" /> 
    <label for="#{label}">Username</label> <p id="name_status"></p> 


    <input type="email" name="email" required="required" id="UserEmail" /> 
    <label for="#{label}">Email</label> <p id="email_status"></p> 



    <input type="password" id="#{label}" name="password" required="required"/> 
    <label for="#{label}">Admin Password</label> 



    <input type="text" name="group_name" required="required" id="GroupName" /> 
    <label for="#{label}">Group Name</label> <p id="group_status"></p> 



    <input type="password" id="#{label}" name="group_password" required="required"/> 
    <label for="#{label}">Group Password</label> 



    <button type="submit" id="myBtn" name="submit"><span>Next</span></button> 

</form>

來源

2017-06-20 asfan ulla

可能有幾種方法來處理這個問題，但如果您只想根據特定條件提交表單，那麼您可以將提交按鈕更改爲常規按鈕（使用type =「button」），將其onclick事件連接到您選擇的任何JavaScript方法，然後通過該方法決定是否提交表單。 –

@RobZuber我做了你說的，但問題是決定提交或不提交的if語句是在php響應之前處理的。 PHP響應需要時間，因爲它必須通過sql查詢和驗證。 –

概括地說，你的PHP調用是異步的，但你的onsubmit（）是同步的。

因此，你必須找到一種方法使onSubmit()以更同步的方式行爲。

的基本辦法做到這一點是：

在提交時，打電話給你的PHP函數返回false。
- 理想情況下，也禁用您的提交按鈕，以便人們不會再次擊中它。
當您的通話完成後，如果有效，請手動提交表格。
- 您可以form.submit（）或類似的東西，這取決於您的確切框架。看起來你正在使用jQuery，所以$('form').submit()會做伎倆。
如果它無效，請進行任何驗證顯示您想要做的事情。
- 如果您先前禁用了它，則可以再次啓用您的提交按鈕用於後續調用。

通過返回false向右走，你告訴的形式不提交。然而，這樣就可以讓你每次都坐下來等待PHP返回。然後，您可以手動觸發提交，如果沒有提交，則不提交。因此，你已經使你的表單表現得像是異步的。

來源

2017-06-20 02:04:04 samanime

感謝您的答覆，但我應該定義一個新的PHP功能或執行註冊過程的功能。 –

想通了，謝謝 –

阻止/允許表單提交

回答

相關問題