說明暫時禁用提交按鈕幾秒鐘，然後重新啓用它？

這與另一個問題類似，但是表單不會提交。說明暫時禁用提交按鈕幾秒鐘，然後重新啓用它？

基本上我在這裏實現的是，一旦用戶點擊「提交」btn，btn被禁用，直到頁面被重定向，以避免用戶點擊提交btn幾次。

用戶被重定向到的頁面不會顯示錶單中的信息。在引入禁用和啓用功能之前，它的功能正確無誤。

提供的代碼確實會禁用btn，甚至會將文本更改爲「提交」，但不會重定向到摘要頁面，即使通過選項卡導航到摘要頁面，信息也不存在。任何幫助最讚賞...

表單代碼........

<div class="portlet-body form"> 
     <!-- BEGIN FORM--> 
     @using (Html.BeginForm("RequestAppointment", "Appointment", new { ReturnUrl = ViewBag.ReturnUrl }, FormMethod.Post, new { @class = "form-horizontal", id= "apptReqForm" })) 
     { 


      @Html.AntiForgeryToken() 
      @Html.ValidationSummary(false, string.Empty, new { @class = "alert alert-error" }) 

      <div class="control-group"> 
       <label class="control-label">Healthcare Professional</label> 
       <div class="controls">   
        @Html.DropDownListFor(m => m.RequestedUserID, Model.Hcps, string.Empty) 

       </div> 

      </div> 
      <div class="control-group"> 
       <label class="control-label">@Html.LabelFor(m => m.RequestedDateTime)</label> 
       <div class="controls"> 
        <div class="input-append" id="ui_date_picker_trigger"> 
         @Html.EditorFor(m => m.RequestedDateTime) 
         <span class="add-on"><i class="icon-calendar"></i></span> 
        </div> 
       </div> 
      </div> 

      <div class="control-group"> 
       <label class="control-label">@Html.LabelFor(m => m.SelectedTime, "Time")</label> 
       <div class="controls"> 
        <div id="timeSlotID" data-request-url="@Url.Action("LoadTimeslots")"> 
         <select id="SelectedTime" name="SelectedTime"></select> 
        </div> 
       </div> 
      </div> 

      <div class="control-group"> 
       <label class="control-label">@Html.LabelFor(m => m.AdditionalNotes)</label> 
       <div class="controls"> 
        @Html.TextAreaFor(m => m.AdditionalNotes, new { @class = "span6 m-wrap", rows = 3 }) 
        <span class="help-block m-wrap">In the event the selected time you have chosen is not available, please state above if your booking time is flexible.</span> 
       </div> 
      </div> 

      <div class="form-actions"> 
       <button type="submit" class= "btn blue" id="submit" onclick="disable();"><i class="icon-ok"></i>Submit</button> 
       <button type="button" class="btn" onclick="location.href='RequestedAppointments'">Cancel</button> 

      </div> 
     } 
    </div> 

    <div class="form-actions"> 
       <button type="submit" class= "btn blue" id="submit" onclick="disable();"><i class="icon-ok"></i>Submit</button> 

    <script> 

function disable() { 
    x = document.getElementById("submit"); 
    x.disabled = true; 
    x.textContent = "Submitting..."; 
    document.getElementById("apptReqForm").submit(); 
    setTimeout(enable, 5000); 
} 

function enable() { 
    x = document.getElementById("submit"); 
    x.disabled = false; 
    x.textContent = " Submit"; 
} 
     </script>

來源

2013-06-05 mkell

你需要改變你的腳本執行以下操作：

function disable() { 
    x = document.getElementById("submit"); 
    x.form.submit(); 
    x.disabled = true; 
    x.textContent = "Submitting..."; 
    setTimeout(enable, 5000); 
} 

function enable() { 
    x = document.getElementById("submit"); 
    x.disabled = false; 
    x.textContent = " Submit"; 
}

的但是，禁用按鈕的事實可能會導致回發失敗。

嘗試尋找這個解決方案（它使用jQuery的） Disable button after clicking once

來源

2013-06-05 10:21:20 KaraokeStu

您的意思是........ document.getElementById（「）。onsubmit（）; – mkell

否... onsubmit是事件處理程序，submit是方法。看到這裏：http：//www.w3schools.com/jsref/met_form_submit.asp – KaraokeStu

恐怕所有我得到這些變化後得到的是btn禁用btn的textContent更改爲「提交」和頁面沒有製作任何嘗試重新指導......無論如何謝謝 – mkell

你會相信簡單的3線的...

更改按鈕從「提交」標識，其他任何事情，因爲這混淆的Visual Studio中

id="submitreq"

，然後添加以下到submitHandler功能..

var submitButton = document.getElementById("submitreq"); 
       submitButton.disabled = true; 
       submitButton.textContent = "Submitting..."; 

       form.submit();

來源

2013-06-06 14:54:06 mkell

說明暫時禁用提交按鈕幾秒鐘，然後重新啓用它？

回答

相關問題