2012-02-01 103 views
3

我想在提交表單之前獲得用戶的確認。這將防止意外發布表單,這可能是不完整或不正確的。提交表單確認

這裏是我的表單元素:

<form action="manager.php?method=update&id=<?php echo $user->id;?>" onsubmit="return confirm_update();" method="POST" id="user_update"> 

這需要我的功能confirm_update()

function confirm_update() 
{ 
    if(confirm("Do you wish to update details?")) 
    { 
    return 0; 
    } 
    else 
    { 
    return 1; 
    } 
} 

的腳本的問題是,它並不能阻止形式可以發佈,如果用戶在點擊Cancel JavaScript提示。

如何解決此問題,以免用戶意外提交表單?

這裏的功能,我想實現的完整描述:

使用案例 - 「更新詳細信息」

  • 用戶去更新頁面
  • 用戶輸入信息的形式字段
  • 用戶點擊提交按鈕
  • 確認消息出現
  • 如果選擇「確定」按鈕繼續提交表單
  • 否則取消行動,並保持
  • 當前頁面

回答

10

,而不是返回0和1對,返回truefalse。實際上,你可以縮短功能:

function confirm_update() { 
    return confirm("Are you sure you want to submit?"); 
} 
+0

剛纔檢查上面的代碼片段在我的機器上。適用於FF9,Chrome。 – 2012-02-01 11:10:38

1

嘗試:

 

function confirm_update() { 
    if(confirm("Do you wish to update details?")) { 
     return true; 
    } 
    else { 
     return false; 
    } 
} 
 
1

我會做一個onclick返回默認爲false,這對我的作品

<form action="manager.php?method=update&id=<?php echo $user->id;?>" method="POST" id="user_update"> 
<input type='submit' onclick="return confirm('Do you wish to update details?');return false;"/> 
</form> 
1

你應該首先重新考慮你的方法。與其詢問用戶是否要提交可能不完整或無效的表單,您應該使用javascript來防止發生這種情況,即使用js執行客戶端驗證。你正在做的事情本質上是通過點擊提交...

如果你想保持你的方法,你必須防止提交按鈕實際上提交數據到指定的動作,例如通過改變表單動作爲「#」通過JavaScript,然後觸發提交如果確定是與您的js代碼點擊,例如通過使用XmlHttpRequest。

+0

感謝mahok,但是這不會工作,因爲它們是從數據庫中檢索出來的,因爲這些字段已經具有其中的細節。因此驗證會一直回到例如因爲在電子郵件地址字段中有一個電子郵件地址。這種形式可以讓他們在數據庫上更改他們的詳細信息:) – kaleeway 2012-02-01 11:14:02

+0

想象一下,您註冊了一項服務,但您的用戶名已被佔用。您可能不知道,並且您可能輸入了有效的用戶名,但在每次提交時,您都會返回到表單中,並通知您已取得您的姓名。每次發生這種情況時,您不僅需要提交表單,更重要的是會詢問您是否要提交數據...如果數據仍然有效,您可以檢查blur或onChange,然後提供初步驗證數據。 – dbrumann 2012-02-01 11:29:32

+0

從用戶的角度來看這一點。您點擊提交,因爲您想要傳輸數據。只有(如果)數據明顯缺失或無效,您才應該進行干預。否則,你只需放慢一個已經不需要的進程(再次讀取表單並更改不正確的值),這與我之前的註冊示例一樣,會很快變得煩人。 – dbrumann 2012-02-01 11:36:35

2

你這樣做是相反的!

if(confirm("Do you wish to update details?")) 
{ 
    return 1; 
} 
else 
{ 
    return 0; 
} 

說了這麼多,你的代碼可以被縮短到只有一行:

return confirm("Hit OK to continue, Cancel to... cancel.");