一键验证后禁用提交按钮? [英] Disable Submit Button after one click with validation?

问题描述

我有一个将数据传递到cc处理终端以及写PDF合同和收据的表格.表单中内置了验证功能，我尝试添加一个功能，以在通过验证后一键单击后禁用提交"按钮.

I have a form that is passing data to a cc processing terminal, as well as writing PDF contracts and receipts. There is validation built into the form, and I am trying to add a function to disable the submit button after one click provided validation is passed.

我对发布数据了解不多，但是我想确定一下:

I don't know a lot about post data, but I want to make sure it:

1. Still posts the data. 2. Still validates. 3. Does not allow the user to submit multiple times.

1. Still posts the data. 2. Still validates. 3. Does not allow the user to submit multiple times.

这是我的POST代码段:

Here is my POST chunk of code:

<form method="POST" action="partner_register_ihg.php" onSubmit="javascript:return WebForm_OnSubmit();"  id="docContainer" autoeventwireup="true" enctype="multipart/form-data" novalidate class="fb-toplabel fb-100-item-column fb-large selected-object" style="width: 800px;" data-form="preview">

这是我的提交部分

<input type="submit" name="subbutton" onClick='javascript:WebForm_DoPostBackWithOptions(new WebForm_PostBackOptions("subbutton", "", true, "", "", false, false))' id="subbutton" class="fb-button-special" value="Submit" />

这是我的验证代码中的一小部分

Here is a small section of my validation code

var RequiredFieldValidator30 = document.all ? document.all["RequiredFieldValidator30"] : document.getElementById("RequiredFieldValidator30");
RequiredFieldValidator30.controltovalidate = "item56_text_1";
RequiredFieldValidator30.errormessage = "Please enter the shipping zip code.";
RequiredFieldValidator30.display = "None";
RequiredFieldValidator30.evaluationfunction = "RequiredFieldValidatorEvaluateIsValid";
RequiredFieldValidator30.initialvalue = "";
var RequiredFieldValidator31 = document.all ? document.all["RequiredFieldValidator31"] : document.getElementById("RequiredFieldValidator31");
RequiredFieldValidator31.controltovalidate = "item62_0_checkbox";
RequiredFieldValidator31.errormessage = "Please agree to Terms and Conditions.";
RequiredFieldValidator31.display = "None";
RequiredFieldValidator31.evaluationfunction = "RequiredFieldValidatorEvaluateIsValid";
RequiredFieldValidator31.initialvalue = "";

var ValidationSummary1 = document.all ? document.all["ValidationSummary1"] : document.getElementById("ValidationSummary1");
ValidationSummary1.showmessagebox = "True";
ValidationSummary1.showsummary = "False";

推荐答案

在您的提交"按钮代码中，只需添加javascript代码: <input type="submit" [...] id="btn1" onclick="setTimeout(disableFunction, 1);"> 并在Javascript中添加功能:

In your submit button code just add javascript code: <input type="submit" [...] id="btn1" onclick="setTimeout(disableFunction, 1);"> and in Javascript add function:

function disableFunction() {
    document.getElementById("btn1").disabled = 'true';
}

这篇关于一键验证后禁用提交按钮?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！