Запретить изменение флажка при нажатии на него

Мне нужен флажок на веб-странице. Когда я нажимаю на нее, он отправляет запрос ajax на сервер. Когда сервер отвечает, я хочу, чтобы флажок изменился. Я могу исправить все, кроме того факта, что чекбокс сразу меняет состояние при нажатии.


javascript checkbox
person Community    schedule 10.10.2008    source источник

Ответы (6)


arrow_upward
4
arrow_downward

Ты уверен, что действительно этого хочешь? Ajax-запрос может занять некоторое время. Когда пользователь не получает обратной связи, он может щелкать снова и снова, пока что-то не произойдет. Когда это деактивирует кнопку (снова через некоторое время), пользователь становится еще более озадаченным.

Скорее подумайте о предоставлении немедленной обратной связи (например, установите флажок) и отобразите рядом с ним индикатор, который сигнализирует о связи с сервером (например, знаменитая прялка). Когда результат вернется, скройте индикатор и при необходимости снимите флажок. Вы также можете запретить публикацию формы во время запроса ajax.

person Olaf Kock    schedule 10.10.2008

arrow_upward
2
arrow_downward

Вероятно, вы могли бы сделать что-то вроде этого: когда флажок установлен, установите флажок «отключено» (это делает флажок серым и делает его недоступным для редактирования), сделайте вызов ajax, и как только вы получите возврат ajax, удалите «отключено» из флажка. Что-то вроде этого (с использованием jQuery, непроверено):

$('#mycheckbox').click( function() {
  var checkbox = this;
  $(checkbox).attr('disabled','1');
  $.post( url, data, function() {
    // if successful
    $(checkbox).removeAttr('disabled');
  }
}
person Parand    schedule 10.10.2008

arrow_upward
1
arrow_downward

Добавьте в свой onclick «return false;» и не должно меняться.

person Chris Shaffer    schedule 10.10.2008
comment
В некоторых браузерах вы можете видеть, как он мерцает. И если вы выполняете какое-то другое действие синхронно перед возвратом false, флажок останется установленным, пока ваш код не достигнет оператора return. - person Adam Bellaire; 10.10.2008

arrow_upward
1
arrow_downward 

<input id="theChkbox" type="checkbox" onclick="this.checked=!this.checked;sendAjaxRequest(this);">

this.checked=!this.checked сбросит состояние флажка до того, что было до того, как он был нажат. Это должно работать во всех браузерах без мерцания состояния (слишком сильно).

sendAjaxRequest() сотворит вашу магию, и когда запрос вернется, установите соответствующее проверенное состояние флажка. Передача this в sendAjaxRequest() должна дать вам ссылку на флажок, чтобы вы могли настроить его состояние. В противном случае просто используйте document.getElementById("theChkbox"), чтобы получить ссылку на него, чтобы установить его состояние.

person Grant Wagner    schedule 10.10.2008

arrow_upward
0
arrow_downward

Вы можете начать свой метод onchange с checkbox.checked=NOT checkbox.checked (возможно, вам придется изменить его для выбранного вами языка), вы, вероятно, получите мерцание, но оно должно вернуться достаточно быстро.

person tloach    schedule 10.10.2008
comment
Я всегда думал, что это checkbox.checked=false, которого я никогда раньше не видел = НЕТ. Ну, я думаю, если NOT не определено, это может сработать. - person Diodeus - James MacFarlane; 10.10.2008
comment
Я использую vbscript, все, что нужно сделать, это изменить настройку checkbox.checked, как бы то ни было. Кроме того, vbscript ужасно работает. - person tloach; 10.10.2008

arrow_upward
0
arrow_downward

Я думаю, вам действительно следует использовать другой подход. Может быть, кнопка/кнопка с изображением, потому что вы хотите запустить некоторые действия для щелчка, чтобы представить конкретную команду (желание) от пользователя. Я попытаюсь объяснить лучше: я думаю, что у вас есть некоторая информация на странице и некоторые гаджеты, где пользователь может щелкнуть и что-то сделать (добавить товар в корзину), и я думаю, что это более удобно, если гаджет имеет более визуальную привлекательность. пользователя, чем флажок (например, «добавить»).

Надеюсь, это поможет.

person Leonel Martins    schedule 10.10.2008