Bagaimana cara memilih formulir induk berdasarkan tombol kirim mana yang diklik?

Saya memiliki halaman web dengan 3 formulir di atasnya. Tidak bersarang, hanya satu demi satu (mereka hampir identik, hanya satu variabel tersembunyi yang berbeda). Seorang pengguna hanya akan mengisi satu formulir, dan saya ingin memvalidasi / dll semua formulir hanya dengan satu skrip JS.

Jadi bagaimana, ketika pengguna mengklik tombol kirim dari formulir # 1, apakah saya membuat skrip js saya hanya berurusan dengan bidang di form1? Saya tahu itu ada hubungannya dengan $ (ini). Orangtua, tapi saya tidak yakin apa yang harus dilakukan dengan itu.

Skrip validasi saya (yang saya gunakan di tempat lain, hanya dengan satu bentuk) terlihat seperti ini:

$(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}

Jadi apakah saya perlu mengganti hal-hal seperti $ ("# name"). Val () dengan $ (this) .parents ('form'). Name.val ()? Atau ada cara yang lebih baik untuk melakukan ini?

Terima kasih!

Anda dapat memilih formulir seperti ini:

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

Namun, umumnya lebih baik untuk melampirkan acara ke ajukan acara formulir itu sendiri, karena akan memicu bahkan ketika mengirimkan dengan menekan tombol enter dari salah satu bidang:

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

Untuk memilih bidang di dalam formulir, gunakan konteks formulir. Sebagai contoh:

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

Saya menemukan jawaban ini ketika mencari cara menemukan bentuk elemen input. Saya ingin menambahkan catatan karena sekarang ada cara yang lebih baik daripada menggunakan:

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

Saya tidak yakin kapan ditambahkan ke jQuery tetapi metode terdekat () melakukan apa yang dibutuhkan lebih bersih daripada menggunakan orang tua (). Dengan kode terdekat dapat diubah menjadi ini:

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

Itu melintasi dan menemukan elemen pertama yang cocok dengan apa yang Anda cari dan berhenti di sana, jadi tidak perlu menentukan: pertama.

Untuk mendapatkan formulir yang diserahkan ada di dalam mengapa tidak adil

this.form

Jalur termudah & tercepat menuju hasilnya.

Saya menggunakan metode berikut & ini bekerja dengan baik untuk saya

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

$('#mybutton').closest("form") melakukan trik untukku.

Eileen: Tidak, tidak var nameVal = form.inputname.val(); . Itu harus ...

di 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();

Atau dalam JavaScript:

var nameVal = this.form.FieldName.value;

Atau kombinasi:

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

Dengan jQuery, Anda bahkan dapat mengulangi semua input dalam bentuk:

$(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();
  ....
  });