?

Log in

No account? Create an account
Main

Cброс формы.

just for the record...  это я до дневничка дорвался.... надо бы притормозить :) все на ту же тему простых и незначительных фишечек.

Обычно для сброса формы нам достаточно просто употребить нужную кнопку:
<input type="reset">
Однако, если у Вас есть форма поиска, которая хранит значения при переходе по страницам и сортировкам, то такой ход не пройдет -- значения выставлены в форме в html, а кнопкой можно сбросить только то, что в текущем окне меняли.


Руки потянулись к jQuery и готово решение в одну строку:
$('form :input').val("");

Однако хехе. У нас не сбросились селекты, а у радио кнопок и чекбоксов вместо состояния checked сбросились значения value.

Можно было бы ручками написать, но stackoverflow сразу дает нам решение:
http://www.learningjquery.com/2007/08/clearing-form-data

вот такой плагинчик:
$.fn.clearForm = function() {
  return this.each(function() {
    var type = this.type, tag = this.tagName.toLowerCase();
    if (tag == 'form')
      return $(':input',this).clearForm();
    if (type == 'text' || type == 'password' || tag == 'textarea')
      this.value = '';
    else if (type == 'checkbox' || type == 'radio')
      this.checked = false;
    else if (tag == 'select')
      this.selectedIndex = -1;
  });
};

Может не только форму скидывать и выбранные элементы.
После этого только к кнопке прикрепить:
<input type="button" value="Сброс" name="Reset" 
onClick="$(this.form).clearForm()"/>

Там у мужичка в комментах кстати народ активно пишет, что весь его плагин можно заменить на
$('form')[].reset();
хехе.

Я кстати в if (tag == 'select')

Вписал
this.selectedIndex = 0;

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

UPD. спасибо lusever за комментарий.

Comments

Вместо:
<input type="button" value="Сброс" name="Reset" 
onClick="$(this).parents('form:first').clearForm()"/>

пишем:
<input type="button" value="Сброс" name="Reset" 
onClick="$(this.form).clearForm()"/>
спасибо.