Как выбрать родительскую форму в зависимости от того, какая кнопка отправки нажата?

У меня есть веб-страница с тремя формами. Не вложенные, только один за другим (они почти идентичны, только одна скрытая переменная, которая отличается). Пользователь будет заполнять только одну форму, и я хотел бы проверить /etc все формы только с одним JS script.

Итак, как, когда пользователь нажимает кнопку отправки формы # 1, могу ли я сделать js script только с полями в форме1? Я понимаю, что это имеет какое-то отношение к $(this).parents, но я не уверен, что с ним делать.

Моя проверка script (которую я использовал в другом месте, только с одной формой) выглядит примерно так:


$(document).ready(function(){
    $("#submit").click(function(){
        $(".error").hide();
        var hasError = false;

        var nameVal = $("#name").val();
        if(nameVal == '') {
            $("#name").after('Please enter your name.');
            hasError = true;
        }


        if(hasError == false) {blah blah do all the processing stuff}

Так что мне нужно заменить такие вещи, как $( "# name" ). val() с $(this).parents('form'). name.val()? Или есть лучший способ сделать это?

Спасибо!

Ответ 1

Вы можете выбрать форму следующим образом:

$("#submit").click(function(){
    var form = $(this).parents('form:first');
    ...
});

Однако обычно лучше присоединить событие к событию отправки самой формы, поскольку оно будет срабатывать даже при отправке, нажав клавишу ввода из одного из полей:

$('form#myform1').submit(function(e){
     e.preventDefault(); //Prevent the normal submission action
     var form = this;
     // ... Handle form submission
});

Чтобы выбрать поля внутри формы, используйте контекст формы. Например:

$("input[name='somename']",form).val();

Ответ 2

Я нашел этот ответ, когда искал, как найти форму элемента ввода. Я хотел добавить примечание, потому что теперь есть лучший способ, чем использовать:

var form = $(this).parents('form:first');

Я не уверен, когда он был добавлен в jQuery, но метод closeest() делает именно то, что нужно более чисто, чем использование parent(). С ближайшим к нему кодом можно изменить:

var form = $(this).closest('form');

Он перемещается и находит первый элемент, который соответствует тому, что вы ищете, и останавливается там, поэтому нет необходимости указывать: сначала.

Ответ 3

Чтобы получить форму, в которой находится подача, почему бы не просто

this.form

Самый простой и быстрый путь к результату.

Ответ 4

Я использовал следующий метод, и он отлично работал у меня

$('#mybutton').click(function(){
        clearForm($('#mybutton').closest("form"));
    });

$('#mybutton').closest("form") помогло.

Ответ 5

Эйлин: Нет, это не var nameVal = form.inputname.val(); , Это должно быть либо...

в jQuery:

// you can use IDs (easier)

var nameVal =  $(form).find('#id').val();

// or use the [name=Fieldname] to search for the field

var nameVal =  $(form).find('[name=Fieldname]').val();

Или в JavaScript:

var nameVal = this.form.FieldName.value;

Или комбинация:

var nameVal = $(this.form.FieldName).val();

С помощью jQuery вы можете даже просматривать все входные данные в форме:

$(form).find('input, select, textarea').each(function(){

  var name = this.name;
  // OR
  var name = $(this).attr('name');

  var value = this.value;
  // OR
  var value = $(this).val();
  ....
  });