Отключить кнопку при нажатии

Question

У меня есть кнопка управления. Как только пользователь нажимает на него, событие click должно срабатывать, а затем кнопка должна отключаться Как я могу это сделать? У меня есть возможность использовать JQuery или JavaScript или оба.

Вот мое объявление кнопки:

<asp:Button 
  ID="Button1" 
  runat="server" 
  Text="Click Me" 
  onclick="Button1_Click"
/> 

В коде нажатия кнопки я добавил Response.Write (). Это должно быть выполнено, а затем кнопка должна быть отключена

Answer 1

По какой-либо причине спецификация HTML предписывает, что отключенные элементы не должны включаться в запросы POST . Таким образом, если вы используете JavaScript для отключения элемента HTML в событии onclick на стороне клиента, элемент ввода будет отключен, когда браузер соберет POST-запрос, сервер не будет надлежащим образом уведомлен о том, какой элемент вызвал обратную передачу, и он выиграл. не запускать обработчики событий щелчков на стороне сервера.

Когда для свойства UseSubmitBehavior установлено значение false, ASP.NET отображает элемент ввода типа button вместо обычного ввода типа submit , который ASP.NET Button Control обычно генерирует. Это важно, потому что нажатие на элемент кнопки не вызывает событие отправки формы в браузере.

Вместо того чтобы полагаться на отправку формы в браузере, ASP.NET будет обрабатывать вызов на стороне клиента для __doPostBack () в обработчике onclick этого элемента кнопки. __doPostBack вызовет обратную передачу в явном виде независимо от того, какие данные POST поступают в запросе.

Поскольку обратный вызов поднимается независимо от события отправки в браузере, вы освобождаетесь от ранее упомянутой особенности HTML. Затем вы можете установить OnClientClick «this.disabled = true;», которое будет отображаться как «this.disabled = true; __doPostBack ('Button1', '');", и все будет работать так, как задумано.

Answer 2

добавить OnClientClick = "this.disabled = true;" на вашу кнопку.

Если вы используете Asp.net Ajax, вы можете захотеть использовать PostBack Ritalin .

Answer 3

Вы пробовали это?

Добавить OnClientClick = "MyFunction ();" на кнопку .NET.

Затем в теги сценария страницы .aspx добавьте следующую функцию JS:

<script type="text/javascript">
  function MyFunction()
  {
    window.setTimeout(function ()
    {
      // get the button/control to disable using your favourite clientside ...
      // ... control grabbing code snippet ...
      // ... eg. JQUERY $('Button1'), getElementById, etc.)

      document.getElementsByName('Button1').Button1.disabled = true;

      // I've used "getElementsByName" because .NET will render a button with
      // ... a "name" attribute, and not an "id" attribute, by default

    }, 1);
  }
</script>

Это дает браузеру возможность отправлять сообщения, после чего следует быстрая кнопка отключения.

Answer 4

   <script type="text/javascript">
     Sys.WebForms.PageRequestManager.getInstance().add_beginRequest(BeginRequestHandler);
      function BeginRequestHandler(sender, args) {
        document.getElementById('<%= lblMessage.ClientID %>').innerText = "Processing...";
          document.getElementById('<%= btnSubmit.ClientID %>').innerText = "Processing";
         args.get_postBackElement().disabled = true;
           }
           </script>

Добавить тег сценария на исходной странице. изменить идентификатор кнопки в коде. Вы можете отключить кнопку, пока процесс не завершит выполнение.

Answer 5

При использовании метода «this.disabled = true» убедитесь, что вы проверяете, является ли страница действительной, прежде чем отключать элемент управления, если на странице есть валидаторы. Если проверка не пройдена, вы не сможете повторно включить элемент управления без перезагрузки страницы.

if (Page_IsValid) this.disabled = true;

Answer 6

Есть действительно классное событие для тега body "<" body onBeforeunload = "buttonId.disabled = true;" ">"

Это событие происходит непосредственно перед отправкой формы, другими словами, ваши данные будут отправлены правильно.

Answer 7

// to disable
this.setAttribute('disabled', true); 
// to enable
this.removeAttribute('disabled');

это кросс-браузерное решение

Answer 8

вы можете отключить его на стороне сервера

Button1.Enabled = false;

Answer 9

Вы должны быть осторожны, чтобы произошла обратная передача, прежде чем отключить кнопку через клиентский скрипт. Это обычная ошибка с ajax и полями ввода. Отключение поля ввода предотвращает отправку данных из браузера, даже если вы видите текст внутри него, пока он отключен. Ответ заключается в том, что вам нужно использовать jquery для этого, чтобы гарантировать, что код на стороне сервера выполняется в первую очередь, прежде чем он отключен.

-Oisin