OnclientClick и OnClick не работают одновременно?

Question

У меня есть кнопка, подобная следующей,

<asp:Button ID="pagerLeftButton" runat="server" OnClientClick="disable(this)" onclick="pager_Left_Click" Text="<" />

Когда я так использую свою кнопку, onclick не срабатывает. Когда я удаляю OnClientClick, то запускается onclick.

Что мне нужно сделать, так это отключить кнопку во время обратной передачи и включить ее после окончания обратной передачи.

Редактировать: Дополнительная информация:

Я добавил точку останова в мои функции запуска, это часть c #, и я отлаживаю, они точно не запускаются. Эти функции похожи на

protected void pager_Left_Click(object sender, EventArgs e)
{
//Do smthing.
}
protected void pager_Right_Click(object sender, EventArgs e)
{
//Do smthing.
}

и когда я нажимаю кнопку, она отключается на 1-2 секунды и включается автоматически, но я не уверен, почему она включена. Я не добавил ни одной части, чтобы он снова был включен.

Answer 1

Из этой статьи на web.archive.org :

Хитрость в том, чтобы использовать свойства OnClientClick и UseSubmitBehavior элемента управления кнопки. Существуют и другие методы, использующие код на стороне сервера для добавления атрибутов, но я думаю, что простота такого подхода гораздо привлекательнее:

* +1007 *

OnClientClick позволяет добавить клиентский скрипт OnClick. В этом случае JavaScript отключит элемент кнопки и изменит его текстовое значение на сообщение о ходе выполнения. После завершения обратной передачи вновь отрендеренная страница вернет кнопку в исходное состояние без каких-либо дополнительных действий.

Единственная ошибка, которая возникает при отключении кнопки отправки на стороне клиента, заключается в том, что она отменяет отправку в браузере и, следовательно, обратную передачу. Если для свойства UseSubmitBehavior установлено значение false, то в .NET необходимо внедрить необходимый клиентский сценарий для запуска обратной передачи, а не полагаться на поведение отправки формы в браузере. В этом случае код, который он вводит, будет:

__doPostBack('BtnSubmit','')

Это добавляется в конец нашего кода OnClientClick, давая нам этот отрендеренный HTML:

<input type="button" name="BtnSubmit"  onclick="this.disabled = true; this.value ='Submitting...';__doPostBack('BtnSubmit','')"  value="Submit Me!" id="BtnSubmit" />

Это дает приятную кнопку отключения эффекта и обработки текста, пока обратная передача завершается.

Answer 2

OnClientClick кажется очень требовательным при использовании с OnClick.

Я безуспешно пытался использовать следующие варианты:

OnClientClick="return ValidateSearch();" 
OnClientClick="if(ValidateSearch()) return true;"
OnClientClick="ValidateSearch();"

Но они не работали. Работали следующие:

<asp:Button ID="keywordSearch" runat="server" Text="Search" TabIndex="1" 
  OnClick="keywordSearch_Click" 
  OnClientClick="if (!ValidateSearch()) { return false;};" />

Answer 3

Здесь есть два вопроса:

Отключение кнопки на стороне клиента предотвращает обратную передачу

Чтобы преодолеть это, отключите кнопку после события JavaScript onclick. Самый простой способ сделать это - использовать setTimeout, как предложено в этом ответе .

Кроме того, код OnClientClick запускается даже в случае сбоя проверки ASP.NET, поэтому, возможно, стоит добавить проверку для Page_IsValid. Это гарантирует, что кнопка не будет отключена в случае сбоя проверки.

OnClientClick="(function(button) { setTimeout(function () { if (Page_IsValid) button.disabled = true; }, 0); })(this);"

Лучше поместить весь этот код JavaScript в собственную функцию, как показывает вопрос:

OnClientClick="disable(this);"

function disable(button) {
    setTimeout(function () {
        if (Page_IsValid)
            button.disabled = true;
    }, 0);
}

Отключение кнопки на стороне клиента не отключает ее на стороне сервера

Чтобы преодолеть это, отключите кнопку на стороне сервера. Например, в обработчике события OnClick:

OnClick="Button1_Click"

protected void Button1_Click(object sender, EventArgs e)
{
    ((Button)sender).Enabled = false;
}

Наконец, имейте в виду, что предотвращение дублирования нажатий кнопок не мешает двум разным пользователям одновременно отправлять одни и те же данные. Обязательно учитывайте это на стороне сервера.

Answer 4

Vinay (выше) дал эффективный обходной путь. Что на самом деле приводит к тому, что событие OnClick кнопки не работает после функции события OnClientClick является то, что MS определила ее где, когда кнопка отключена (в функции, вызываемой событием OnClientClick), кнопка "уважает" это не пытаясь завершить действие кнопки, вызвав определенный метод события OnClick.

Я боролся несколько часов, пытаясь понять это. Как только я удалил оператор, чтобы отключить кнопку отправки (которая была внутри функции OnClientClick), метод OnClick был вызван без дальнейших проблем.

Microsoft, если вы слушаете, после того, как кнопка нажата, она должна выполнить назначенное ей действие, даже если оно отключено на протяжении всего этого действия. Пока он не отключен при нажатии, он должен выполнить все назначенные методы.

Answer 5

Что если вы не сразу установите кнопку в отключенное состояние, а задержите ее через setTimeout? Ваша функция «отключить» вернется, и отправка будет продолжена.

Answer 6

Ваш JavaScript в порядке, если на этой странице не запущены другие скрипты, которые могут повредить все. Вы можете проверить это, используя Firebug .

Я сейчас немного протестировал, и кажется, что ASP.net игнорирует отключенные элементы управления. В основном, выполняется обратная передача, но, вероятно, среда игнорирует такие события, поскольку она «предполагает», что отключенная кнопка не может вызвать обратную передачу, и поэтому игнорирует возможные подключенные обработчики. Теперь это только мои личные рассуждения, можно использовать Reflector, чтобы проверить это более подробно.

В качестве решения вы могли бы действительно попытаться сделать отключение на более позднем этапе, в основном вы задерживаете вызов control.disabled = "disabled", используя JavaTimer или некоторые другие функции. Таким образом, во-первых, выполняется обратная передача на сервер перед отключением элемента управления функцией JavaScript. Не проверял, но это могло сработать

Answer 7

функция UpdateClick (btn) {

    for (i = 0; i < Page_Validators.length; i++) {

        ValidatorValidate(Page_Validators[i]);

        if (Page_Validators[i].isvalid == false)

            return false;
    }

    btn.disabled = 'false';

    btn.value = 'Please Wait...';

    return true;
}