Как отключить кнопку отправки в jQuery, если поля формы не были изменены?
-
22-08-2019 - |
Вопрос
У меня есть форма HTML, которая содержит текстовые поля, флажки, радиобуттоны и кнопку отправки.
Я бы хотел, чтобы эта кнопка отправки включена только в том случае, если содержимое полей будет изменено. Теперь вот улов: Если пользователь изменяет содержимое поля обратно на исходные значения, кнопка формы должна быть снова отключена.
- Исходное значение поля "foo" => кнопка отправки отключена
- Пользователь изменений значения поля на «bar» => кнопка отправки становится включенной
- Пользователь изменений значения поля обратно в «foo» => кнопка отправки снова становится отключенной
Как достичь этого с помощью jQuery? Есть ли какое -либо общее решение или сценарий, который я мог бы использовать с какой -либо формой?
РЕДАКТИРОВАТЬ: То, что я прошу, не может быть сделано с простой отслеживание грязного состояния.
Решение
Используйте отслеживание грязного состояния. Прикрепите логическое значение (например, ISDirty) к каждому входному управлению и переключайте его всякий раз, когда изменяется значение. При отправке проверки формы изменились, по крайней мере, одно или несколько значений, а затем отправьте форму. В противном случае отобразить предупреждение пользователю.
Другое решение состоит в том, чтобы вызвать общую функцию, когда изменяется значение управления. В этой функции вы можете установить глобальную переменную (isdirty) на True, если что -то изменилось, а также включить/отключить кнопку отправки.
var isDirty = false;
function SomethingChanged(){
if( !isDirty ) isDirty = true;
btnSubmit.disabled = !isDirty;
}
Общая функция для любого управления
Допущения: добавьте начальное значение каждого элемента управления в атрибут "initval"
function SomethingChanged(control){
if( control.value != control.InitVal )
control.IsDirty = true;
else
control.IsDirty = false;
}
В приведенной выше функции, чтобы сделать его общим
- InitValue - начальное значение управления
- Isdirty - логическое значение, указывающее на то, что значение управления изменилось
Другие советы
Всего два шага:
- хранить хэш всех начальных значений в переменной JavaScript
- Университет каждого входа пересчитывается, который хэш и проверяет его в хранящемся. Если это то же самое, отключите кнопку отправки, если это не так, включите ее.
Взглянуть на проверка плагина.
Это кажется лучшим ответом.
1401-USING-JQUERY-TO-LEDGERY-THE-ONCHANGE-method-of-inputs.htm
Я не проверял, что ниже :-) Но это то, что вы имеете в виду?
$(document).ready(function() {
$("#myform :input").attr("init",$(this).val()).bind("change.dirty", function(evt) {
if ($(this).val()!=$(this).attr("init")) $(this).addClass("dirty");
else $(this).removeClass("dirty");
$('#thebutton').attr("disabled",!$("#myform .dirty").size());
});
});
*-pike
Должно быть возможно сохранить весь объект формы (как есть, либо путем итерации с.
Вы можете использовать Грязный поле Вместо этого плагин и установлен DenotedIrtyform: true. Теперь, если в вашей форме есть класс «Dirtyform» означает, что у вас есть неспасенные изменения.
То, что вы могли бы сделать, это настроить сценарий jQuery, чтобы сканировать страницу на загрузке страницы и проверить форму, инвентаризировать поля и их значения, а затем проверить этот массив ввода справочного массива всякий раз, когда ввод обновляется.