JavaScript: истинный сброс формы для скрытых полей

Question

К сожалению, функция form.reset () не сбрасывает скрытые вводы формы. Проверено в FF3 и Chromium.

Есть ли у кого-нибудь идеи, как сделать сброс для скрытых полей?

Answer 1

Кажется, что самый простой способ сделать это с отображением : нет текстовое поле вместо скрытого поля. В этом случае процесс сброса по умолчанию регулярно.

Answer 2

Это правильно согласно стандарту , к сожалению. Плохая спецификация бородавки ИМО. Тем не менее, IE предоставляет скрытые поля с возможностью сброса defaultValue. См. это обсуждение : в HTML5 оно (увы) не изменится.

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

Поскольку вы вообще не можете получить исходное значение атрибута value, вам придется продублировать его в другом атрибуте и извлечь его. eg.:

<form id="f">

<input type="hidden" name="foo" value="bar" class="value=bar"/>

function resetForm() {
    var f= document.getElementById('f');
    f.reset();
    f.elements.foo.value= Element_getClassValue(f.elements.foo, 'value');
}

function Element_getClassValue(el, classname) {
    var prefix= classname+'=';
    var classes= el.className.split(/\s+/);
    for (var i= classes.length; i-->0;)
        if (classes[i].substring(0, prefix.length)===prefix)
            return classes[i].substring(prefix.length);
    return '';
}

Альтернативные способы контрабанды этого значения могут включать HTML5 data, другой резервный атрибут, такой как title, сразу следующий <!-- comment --> для чтения значения, явную дополнительную информацию JS или дополнительные скрытые поля для хранения значения по умолчанию.

Каким бы ни был подход, он должен был бы загромождать HTML; он не может быть создан сценарием во время готовности документа, потому что некоторые браузеры к тому времени уже выполнят переопределение значения поля запомненным значением (после перезагрузки или нажатия кнопки назад).

Answer 3

Еще один ответ, если кто-нибудь придет сюда в поисках одного. Сериализуйте форму после загрузки страницы и используйте эти значения для сброса скрытых полей позже:

var serializedForm = $('#myForm').serialize();

Затем для сброса формы:

function fullReset(){

    $('#myForm').reset(); // resets everything except hidden fields


    var formFields = decodeURIComponent(serializedForm).split('&'); //split up the serialized form into variable pairs

    //put it into an associative array
    var splitFields = new Array();
    for(i in formFields){
        vals= formFields[i].split('=');
        splitFields[vals[0]] = vals[1];
    }
    $('#myForm').find('input[type=hidden]').each(function(){    
        this.value = splitFields[this.name];
    });

}

Answer 4

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

//fix form reset (hidden fields don't get reset - this will fix that pain in the arse issue)
$( document ).ready(function() {
  $("#myForm").find("input:hidden").each(function() {
      $(this).data("myDefaultValue", $(this).val());
  });

  $("#myForm").off("reset.myarse");
  $("#myForm").on("reset.myarse", function() {
     var myDefaultValue = $(this).data("myDefaultValue");
     if (myDefaultValue != null) {
       $(this).val(myDefaultValue);
     }
  });
}

Надеюсь, это кому-нибудь поможет:)

Answer 5

Вы можете использовать jQuery - это очистит скрытые поля:

$('form').on('reset', function() {
  $("input[type='hidden']", $(this)).val('');
});

Совет: просто убедитесь, что вы не сбрасываете поле токена csrf или что-либо еще, что не должно быть очищено. При необходимости вы можете сузить спецификацию элемента.

Если вы хотите восстановить значение поля по умолчанию, которое вы можете использовать (не проверено):

$('form').on('reset', function() {
  $("input[type='hidden']", $(this)).each(function() {
    var $t = $(this);
    $t.val($t.data('defaultvalue'));
  });
});

и сохраните значение по умолчанию в свойстве data-defaultvalue="Something".

Answer 6

Вы можете сбросить скрытое значение поля ввода, используя строку ниже, вам просто нужно изменить идентификатор формы вместо frmForm.

$("#frmForm input:hidden").val(' ');

Answer 7

$('#form :reset').on('click',function(e)({
    e.preventDefault();
    e.stopImmediatePropagation();
    $("#form input:hidden,#form :text,#form textarea").val('');
});

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

Answer 8

Это будет делать:

$("#form input:hidden").val('').trigger('change');

Answer 9

Как бы я это сделал, поместил прослушиватель событий в событие изменения скрытого поля. В этой функции слушателя вы можете сохранить начальное значение в хранилище элемента DOM ( mootools , jquery ) и затем прослушать событие сброса формы, чтобы восстановить начальные значения, сохраненные в хранилище скрытых полей формы.

Answer 10

Создайте кнопку и добавьте JavaScript к событию onClick, которое очищает поля.

Тем не менее, мне любопытно, почему вы хотите сбросить эти поля. Обычно они содержат внутренние данные. Если бы я очистил их в своем коде, публикация формы потерпит неудачу (например, после того, как пользователь введет новые данные и попытается отправить форму).

[ПРАВИТЬ] Я неправильно понял ваш вопрос. Если вы беспокоитесь о том, что кто-то может изменить значения в скрытых полях, сбросить их невозможно. Например, вы можете вызвать reset() в форме, но не в поле в форме.

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

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