防止在某些情況下提交表格

我的FineUploader除了1個場景以外都很好用。在某些情況下，我的某個表單元素（如文本框或下拉列表）具有無效數據。我想在這種情況下防止上傳發生。不管怎樣，FineUploader會繞過我的表單驗證並提交，只要選擇了有效的圖像。這裏是我的表單標籤：防止在某些情況下提交表格

<form action="./fine-uploader/server/endpoint.php" id="qq-form" onsubmit="return checkForm(this)">

我checkForm()函數正確返回真/假回到形式的onSubmit。當它返回false時，通常會阻止表單提交，但只要FineUploader具有有效的圖像（由用戶選擇），即使在checkForm（）返回false時，也會在所有情況下提交。

我已經嘗試過這樣的：

form: { interceptSubmit: false},

這樣的作品，但它有一個可怕的副作用：而不是提交表單異步，它重定向到我的PHP處理程序（我想這是做一個形式GET或POST）而不是做一個很好的異步提交。

我只需要一種方法來防止在我選擇的時候提交表單，並在需要時啓用表單提交。

這裏是我目前的設置：

<script> 
    var manualUploader = new qq.FineUploader({ 
     element: document.getElementById('fine-uploader-manual-trigger'), 
     template: 'qq-template-manual-trigger', 
     request: { 
      endpoint: './fine-uploader/server/endpoint.php' 
     }, 
     thumbnails: { 
      placeholders: { 
       waitingPath: './fine-uploader/placeholders/waiting-generic.png', 
       notAvailablePath: './fine-uploader/placeholders/not_available-generic.png' 
      } 
     }, 
     validation: { 
      allowedExtensions: ['png', 'jpg', 'jpeg', 'gif'], 
      itemLimit: 1, 
      sizeLimit: 307200 // 300 kB = (300kb * 1024 bytes) = 307200 
     }, 
     callbacks: { 
      onComplete: function(id, name, responseJSON) { 
       if (responseJSON.success === true) { 
        //location.href = "ManageAds.php"; 
        location.href = "index.php"; 
       } else { 
        console.log(responseJSON); 
        //history.go(0); 
       } 

       //console.log(responseJSON.success); 
      }, 
     }, 
     autoUpload: false, 
     debug: false, 
     multiple: false 
    }); 

    qq(document.getElementById("trigger-upload")).attach("click", function() { 
     manualUploader.uploadStoredFiles(); 
    }); 
</script>

如何防止表單提交，當我的驗證的一個失敗？如果你有一些優雅的內置於FineUploader中，那就太棒了。如果沒有，我會很高興與任何類型的黑客，我只需要得到這個工作。謝謝。

來源

2016-06-11 HerrimanCoder

-1

由於setCustomValidity拋出細uploader.js內運行時異常，我能找到防止細上傳從與自定義驗證問題之中上傳持續的最好辦法就是要做到這一點：

_uploadStoredFiles: function() { // find this line in fine-uploader.js 
    if(!zgpValidationOK){ // add a var of your choice, set to true upstream 
     return; // if var above becomes false in custom code, return now 
    }

適合我。

來源

2016-06-18 17:28:28 HerrimanCoder

這不是一個明智的選擇，而且我也不會建議在您對應用程序沒有很強的理解的情況下修改第三方代碼。您聲稱Web API方法在罰款上傳器中引發錯誤並沒有多大意義。這可能是由於代碼中的問題。由於您沒有演示過您的代碼，因此無法進一步提供幫助。此外，您的建議涉及修改優良的Uploader代碼，但不真正瞭解此操作的後果。我強烈勸阻這一點。相反，要證明你正在解決的問題。 –

雷，你在這篇文章中所說的沒有任何幫助。你的建議不起作用，你對關於永遠不會做的事情的兩個僞善論斷都是愚蠢的。 Onsubmit一直存在，許多網站/開發人員使用它。如果這是「永遠」不應該做的事情，那麼瀏覽器製造商將會刪除它 - 但它們都沒有。另外，如果調整第三方代碼是唯一有效的工作，我會去做。你現在可以回到你的象牙塔了。 – HerrimanCoder

而不是一個內聯onSubmit事件處理程序（你應該從來沒有使用），使用Constraints API。該標準允許您爲每個表單字段指定自定義限制。您還可以使用setCustomValidity方法務實地觀察元素的更改並更新有效性。所有這些都是由HTML5 Web規範提供的，並且是處理表單驗證的一種現代方式。 Fine Uploader將尊重任何此類限制。

來源

2016-06-11 21:14:33

你可以舉一個具體的例子來說明如何防止FineUploader提交？ – HerrimanCoder

Fine Uploader在這裏不是一個因素。看看我鏈接的約束API文檔。您可以設置每個字段的約束，如果違反，將阻止表單提交。 –

我確實讀過這個，它對我的場景沒有幫助。我已經在使用那些每個字段的約束，這對於非常簡單的事情來說很好。但我有約束，需要自定義JavaScript編程來確定是否發生違規行爲。我需要一種方法來指導瀏覽器不要根據自定義規則提交表單。另外，僅僅鏈接到另一個頁面而不提供具體的例子在堆棧溢出中被認爲是不好的做法，因爲它通常沒有幫助。例子是最好的。 – HerrimanCoder

防止在某些情況下提交表格

回答

相關問題