Javascript: Истинная форма reset для скрытых полей

Ответ 1

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

Ответ 2

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

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

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

<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; он не может быть создан script в момент готовности документа, потому что некоторые браузеры уже переопределили значение поля с запоминаемым значением (с помощью кнопки перезагрузки или нажатия кнопки) к тому времени, когда выполняется код.

Ответ 3

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

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

Тогда к reset форма:

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];
    });

}

Ответ 4

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

//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);
     }
  });
}

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

Ответ 5

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

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

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

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

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

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

Ответ 6

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

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

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

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

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

Ответ 7

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

Ответ 8

Это сделает:

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

Ответ 9

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

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